/* fnt.css */ /* fnt.css - self-hosted fonts (Roboto and Roboto Condensed are loaded from Google Fonts in meta.php) */ /* machine names */ @font-face { font-family: 'luminesign'; src: url('/webfont/gt0-webfont.woff2') format('woff2'), url('/webfont/gt0-webfont.woff') format('woff'); font-display: swap; } /* icon font - https://themify.me/themify-icons */ @font-face { font-family: 'themify'; src: url('/webfont/themify.woff') format('woff'), url('/webfont/themify.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: block; } /* reset.css */ /* reset.css - zero browser default spacing and styling, plus site-wide base rules */ /* standard reset (based on Eric Meyer's reset, obsolete elements removed) */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strong, sub, sup, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, main, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section { display: block; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote::before, blockquote::after, q::before, q::after { content: none; } table, td { border-collapse: collapse; border-spacing: 0; } /* site base */ body { background-color: #ffffff; } html body { -webkit-text-size-adjust: 100%; -moz-text-size-adjust: none; text-size-adjust: 100%; text-align: left; font-weight: 300; font-family: 'Roboto', sans-serif; -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: grayscale; } a, a:link, a:hover { text-decoration: none; } div, ul, li, .boxfix, *::after, *::before, input[type=text], textarea, input[type=checkbox] { box-sizing: border-box; } img { display: block; margin: 0; padding: 0; border: none; } /* helpers */ .clear { clear: both; height: 1px; margin: 0 0 -1px; } .clearDiv::after { content: ""; display: table; clear: both; } .embed-video { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; width: 100%; } .embed-video iframe, .embed-video object, .embed-video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* accessibility */ .sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; } .skip-link { position: absolute; left: 1rem; top: -20rem; z-index: 100000; background-color: #000; color: #fff; padding: 1rem 1.6rem; font-size: 1.6rem; font-weight: 400; } .skip-link:focus { top: 1rem; } button.btn-link, button.acc-btn, button.arrow, button.slider-toggle { -webkit-appearance: none; appearance: none; border: 0; background: none; margin: 0; padding: 0; font: inherit; color: inherit; text-align: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer; } button.acc-btn { display: block; width: 100%; line-height: inherit; } :focus-visible { outline: 3px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 5px #000; } .lity:focus-visible, .lity-wrap:focus-visible, [tabindex="-1"]:focus-visible { outline: none; box-shadow: none; } #hamburger a:focus-visible, #hamburger button.acc-btn:focus-visible { outline-offset: -3px; box-shadow: none; } /* default.css */ /* default.css - desktop styles: loaded for every screen size; the band files only override what differs */ html, body { font-size: 10px !important; } .noHamburger { display: block; } .hamburger { display: none; } body { background-color: black; } #fixed { width: 100%; position: fixed; z-index: 6000; background-color: #000; } #master { max-width: 137.8rem; margin-left: auto; margin-right: auto; background-repeat: no-repeat; background-size: 100% auto; } #master-sans { max-width: 137.8rem; margin-left: auto; margin-right: auto; } .none { display: none; } .container { width: 100%; } .container-nav { background-color: #ED1C24; height: 4.2rem; border-top: 3px solid #808080; margin-left: auto; margin-right: auto; } .container-subnav { background-color: rgb(77,78,83); height: 4rem; border-top: 2px solid #808080; margin-left: auto; margin-right: auto; } @media (min-width: 930px) { .container-subnavPlus { background-color: rgb(77,78,83); height: 4.8rem; border-top: 2px solid #808080; margin-left: auto; margin-right: auto; } } .container-black { background-color: #000; } .bottom-rule { border-bottom: 3px solid #808080; } .offset-sub { height: calc(17rem + 4.2rem + 4rem); } .offset-subPlus { height: calc(17rem + 4.2rem + 4.8rem); } .offset-nosub { height: calc(17rem + 4.2rem); } .red { color: #ED1C24; } @media (min-width: 1044px) { .flexCentreCentre { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } } @media (min-width: 1044px) { .flexLeftCentre { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: left; -moz-box-pack: left; -ms-flex-pack: left; -webkit-justify-content: left; justify-content: left; -webkit-box-align: center; -moz-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } } @media (min-width: 1044px) { .squish { display: none !important; } } @media (min-width: 1044px) { .noSquish:before { padding-left: 0.8rem !important; padding-right: 0.8rem !important; } } /* header */ #header a.logo img { width: 100%; } @media (min-width: 930px) { #header p span { font-family: "Roboto Condensed", sans-serif; color: #A7A9AC; margin-left: 2rem; } } @media (min-width: 930px) { #header .flags { width: 38.6rem; margin-left: auto; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; } } @media (min-width: 930px) { #header .flags img { width: 100%; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; } } /* header shrink */ @media (min-width: 930px) { .header-shrink { height: 9rem !important; } } @media (min-width: 930px) { .col-header1-shrink { width: 15.8rem !important; padding-top: 1.3rem !important; } } @media (min-width: 930px) { .col-header2-shrink { width: calc(100% - 15.8rem) !important; } } @media (min-width: 930px) { .ps-login-shrink { width: 24.4rem !important; margin-bottom: 1rem !important; margin-left: calc(100% - 24.4rem) !important; } } @media (min-width: 930px) { .uk-shrink { font-size: 1.6rem !important; line-height: 1.8rem !important; } } @media (min-width: 930px) { .world-shrink { font-size: 1.3rem !important; line-height: 1.4rem !important; margin-bottom: 0 !important; } } @media (min-width: 930px) { .flags-shrink { display: none !important; } } @media (min-width: 1044px) { .offset-sub-shrink { transition: all 0.4s ease; } } @media (min-width: 930px) { .offset-sub-shrink { height: calc(9rem + 4.2rem + 2.3rem) !important; } } @media (min-width: 1044px) { .offset-nosub-shrink { transition: all 0.4s ease; } } @media (min-width: 930px) { .offset-nosub-shrink { height: calc(9rem + 4.2rem) !important; } } @media (min-width: 1044px) { .offset-subPlus-shrink { transition: all 0.4s ease; } } @media (min-width: 930px) { .offset-subPlus-shrink { height: calc(9rem + 4.2rem + 3.1rem) !important; } } /* navigation */ #navigation, #sub-navigation { font-family: "Roboto Condensed", sans-serif; } @media (min-width: 930px) { #sub-navigationPlus { font-family: "Roboto Condensed", sans-serif; } } @media (min-width: 930px) { #navigation ul li { font-family: "Roboto Condensed", sans-serif; float: left; display: block; } } @media (min-width: 930px) { #navigation ul li a.home-icon, #navigation ul li a.home-icon-selected { float: left; display: block; -webkit-transition: -webkit-transform .5s ease-in-out; transition: transform .5s ease-in-out; background-color: transparent !important; padding: .85rem !important; } } @media (min-width: 930px) { #navigation ul li a.home-icon:hover, #navigation ul li a.home-icon-selected:hover { -webkit-transform: rotate(360deg); transform: rotate(360deg); background-color: transparent !important; } } @media (min-width: 930px) { #navigation ul li a, #navigation ul li a:link { font-weight: 400; color: #fff; text-transform: uppercase; letter-spacing: .05rem; font-size: 1.7rem; line-height: 3.9rem; padding-left: 1.28rem; padding-right: 1.28rem; display: block; } } @media (min-width: 930px) { #navigation ul li a:hover, #navigation ul li a.selected { color: rgb(77,78,83); color: #000; font-weight: 400; } } @media (min-width: 930px) { #navigation ul li a.findmach, #navigation ul li a.findmach:link { color: #fff; background-color: rgb(139,182,46) !important; } } @media (min-width: 930px) { #navigation ul li a.findmach:hover, #navigation ul li a.findmach-selected { color: #fff; background-color: rgb(77,78,83) !important; } } @media (min-width: 930px) { #navigation ul li:before { content: "|"; font-size: 1.7rem; line-height: 3.9rem; color: #fff; float: left; background-color: #ED1C24; } } @media (min-width: 930px) { #navigation ul li:nth-of-type(1):before, #navigation ul li:nth-of-type(2):before, #navigation ul li:nth-of-type(9):before { content: ""; } } /* sub navigation */ #sub-navigation ul { text-align: center; float: left; width: calc(100% - 3.8rem); } #sub-navigation ul li { display: inline; font-weight: 400; font-size: 1.4rem; line-height: 3.7rem; color: #fff; text-transform: uppercase; letter-spacing: .05rem; } #sub-navigation ul li a, #sub-navigation ul li a:link { color: #fff; } #sub-navigation ul li a:hover, #sub-navigation ul li a.selected { color: #ED1C24; } #sub-navigation ul li:before { content: "|"; padding-left: 1.3rem; padding-right: 1.3rem; } #sub-navigation ul li:first-of-type:before { content: ""; padding-left: 0; padding-right: 0; } #sub-navigation .navigation-panel-scrolltop { float: right; width: 3.8rem; height: 3.8rem; position: relative; } #sub-navigation .navigation-panel-scrolltop .arrow:before { content: ""; position: absolute; top: 0; right: 0; font-family: "themify"; font-size: 1.2rem; text-align: right; line-height: 3.8rem; display: block; color: #fff; width: 100%; } #sub-navigation .navigation-panel-scrolltop .arrow:hover:before { content: ""; position: absolute; font-family: "themify"; font-size: 1.2rem; text-align: right; line-height: 3.8rem; color: #ED1C24; width: 100%; } /* sub navigation plus*/ @media (min-width: 930px) { #sub-navigationPlus ul { text-align: center; float: left; width: calc(100% - 3.8rem); padding-top: 0.6rem; } } @media (min-width: 930px) { #sub-navigationPlus ul li { display: inline-block; font-weight: 400; font-size: 1.4rem; line-height: 1.7rem; color: #fff; text-transform: uppercase; letter-spacing: .03rem; vertical-align: middle; } } @media (min-width: 930px) { #sub-navigationPlus ul li a, #sub-navigationPlus ul li a:link { color: #fff; text-align: center; } } @media (min-width: 930px) { #sub-navigationPlus ul li a:hover, #sub-navigationPlus ul li a.selected { color: #ED1C24; } } @media (min-width: 930px) { #sub-navigationPlus ul li { padding-left: 1.1rem; margin-left: 1.1rem; border-left: 1px solid white; } } @media (min-width: 930px) { #sub-navigationPlus ul li:first-of-type { padding-left: 0; margin-left: 0; border-left: none; } } @media (min-width: 930px) { #sub-navigationPlus .navigation-panel-scrolltop { float: right; width: 3.8rem; height: 3.8rem; position: relative; } } @media (min-width: 930px) { #sub-navigationPlus .navigation-panel-scrolltop .arrow:before { content: ""; position: absolute; top: 0; right: 0; font-family: "themify"; font-size: 1.2rem; text-align: right; line-height: 3.8rem; display: block; color: #fff; width: 100%; } } @media (min-width: 930px) { #sub-navigationPlus .navigation-panel-scrolltop .arrow:hover:before { content: ""; position: absolute; font-family: "themify"; font-size: 1.2rem; text-align: right; line-height: 3.8rem; color: #ED1C24; width: 100%; } } @media (min-width: 930px) { #sub-navigationPlus .extraPad { padding-top: 0.85rem; padding-bottom: 0.85rem; } } /* header - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #header { margin-left: auto; margin-right: auto; height: 17rem; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #header { max-width: 104rem; } } #navigation, #sub-navigation { margin-left: auto; margin-right: auto; } @media (min-width: 1044px) { #sub-navigationPlus { max-width: 104rem; } } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #navigation, #sub-navigation { max-width: 104rem; } } @media (min-width: 930px) { #sub-navigationPlus { margin-left: auto; margin-right: auto; } } #content { margin-left: auto; margin-right: auto; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #content { max-width: 104rem; } } @media (min-width: 1044px) { #sliderMarkets { max-width: 137.8rem; margin-left: auto; margin-right: auto; position: relative; } } #slider { max-width: 110rem; margin-left: auto; margin-right: auto; position: relative; } #slider-machine { max-width: 110rem; margin-left: auto; margin-right: auto; position: relative; } #slider-contact { max-width: 110rem; margin-left: auto; margin-right: auto; position: relative; } #slider-contact iframe { filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -o-filter: grayscale(100%); -ms-filter: grayscale(100%); } #icons { max-width: 104rem; margin-left: auto; margin-right: auto; margin-bottom: 2rem; } .sansMargin { margin-bottom: 0 !important; } #icons-pop { margin-left: auto; margin-right: auto; margin-bottom: 0; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #icons-pop { max-width: 100%; } } #stripe-area { margin-left: auto; margin-right: auto; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #stripe-area { max-width: 104rem; } } #primary { margin-left: auto; margin-right: auto; overflow: hidden; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #primary { max-width: 104rem; } } #primaryMRD { margin-left: auto; margin-right: auto; overflow: hidden; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #primaryMRD { max-width: 104rem; } } #news { margin-left: auto; margin-right: auto; overflow: hidden; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #news { max-width: 104rem; } } #news-detail { margin-left: auto; margin-right: auto; overflow: hidden; margin-bottom: 4rem; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #news-detail { max-width: 104rem; } } #pagination { margin-left: auto; margin-right: auto; overflow: hidden; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #pagination { max-width: 104rem; } } #news-area { margin-left: auto; margin-right: auto; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #news-area { max-width: 104rem; } } /* primary - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .primary-sans { background-color: black; border-top: 3px solid #808080; } .primary-red { background-color: black; border-top: 3px solid #ED1C24; border-bottom: 3px solid #ED1C24; } #primary h1, #news-detail h1, #primary h2.hd1, #news-detail h2.hd1 { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.8rem; line-height: 3.2rem; color: #ED1C24; margin-bottom: 1rem; } #primary h2, #news-detail h2 { font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #primary h2 span { font-weight: 100; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #primary .machinename { font-family: "luminesign"; color: #ED1C24; font-size: 3.4rem; line-height: 3.8rem; margin-bottom: 2rem; } #primary p:first-of-type, #news-detail p:first-of-type { font-weight: 300; font-size: 2rem; line-height: 2.5rem; color: #fff; margin-bottom: 1rem; } #primary p, #news-detail p { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #primary strong, #news-detail strong { font-weight: 500; } #primary ul li, #news-detail ul li { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } #primary ul li:before, #news-detail ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } #primary blockquote, #news-detail blockquote { display: block; background-color: rgba(255,255,255,0.1); padding: 2rem; margin-bottom: 1rem; margin-top: 1rem; } #primary blockquote p, #primary blockquote p:first-of-type, #news-detail blockquote p, #news-detail blockquote p:first-of-type { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; } #primary .red { color: #ED1C24; } #primary .big { font-weight: 300; font-size: 2rem; line-height: 2.5rem; color: #fff; margin-bottom: 1rem; } #primary a, #primary a:link { color: #ED1C24; } #primary a:hover { color: #ED1C24; text-decoration: underline; } .text-area { padding-top: 4rem; padding-bottom: 4rem; } /* /width of right block is 41.2rem */ #furtherInfo { margin-left: auto; margin-right: auto; overflow: hidden; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #furtherInfo { max-width: 104rem; } } #furtherInfo .text-area { padding-top: 1rem; padding-bottom: 4rem; } #furtherInfo p { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #furtherInfo a, #furtherInfo a:link { color: #ED1C24; } #furtherInfo a:hover { color: #ED1C24; text-decoration: underline; } #news-detail a { color: #ED1C24 !important; } #news-detail a:hover { color: #fff !important; } /* primary Machine Range Detail- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #primaryMRD h1, #primaryMRD h2.hd1 { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.8rem; line-height: 3.2rem; color: #ED1C24; margin-bottom: 1rem; } #primaryMRD h2 { font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #primaryMRD h2 span { font-weight: 100; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #primaryMRD .machinename { font-family: "luminesign"; color: #ED1C24; font-size: 4.8rem; line-height: 4.8rem; margin-bottom: 1.2rem; } #primaryMRD p:first-of-type { font-weight: 400; font-size: 2.4rem; line-height: 2.8rem; color: #ED1C24; margin-bottom: 1.2rem; } #primaryMRD p { font-weight: 300; font-size: 2rem; line-height: 2.8rem; color: #fff; margin-bottom: 1.2rem; } #primaryMRD strong { font-weight: 500; } #primaryMRD ul li { font-weight: 300; font-size: 2rem; line-height: 2.2rem; color: #fff; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } #primaryMRD ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } #primaryMRD blockquote { display: block; background-color: rgba(255,255,255,0.1); padding: 2rem; margin-bottom: 1rem; margin-top: 1rem; } #primaryMRD blockquote p, #primaryMRD blockquote p:first-of-type { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; } #primaryMRD .red { color: #ED1C24; } #primaryMRD .big { font-weight: 300; font-size: 2rem; line-height: 2.5rem; color: #fff; margin-bottom: 1rem; } #primaryMRD a, #primaryMRD a:link { color: #ED1C24; } #primaryMRD a:hover { color: #ED1C24; text-decoration: underline; } .machine-block { text-align: center; } #machine-info h2 { font-weight: 500; font-size: 1.6rem; line-height: 2rem; color: #000; margin-bottom: .4rem; } #machine-info p { font-weight: 300; font-size: 1.6rem; line-height: 2rem; color: #000; margin-bottom: 1rem; } #machine-info ul li { font-weight: 300; font-size: 1.6rem; line-height: 2rem; color: #000; margin-bottom: .4rem; padding-left: 1rem; position: relative; } #machine-info ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } #machine-info .specBlock { height: 7.2rem; } #machine-info .machineSpec { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.4rem; line-height: 1.8rem; color: white; } #machine-info .machinePacks { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.4rem; line-height: 1.8rem; color: #ED1C24; font-style: italic; } .machine-item { display: inline-block; margin-left: 0.5rem; margin-right: 0.5rem; margin-bottom: 3rem; font-family: "luminesign"; color: #ED1C24; text-align: center; font-size: 3rem; line-height: 3.8rem; vertical-align: bottom; } .machine-info-inset { padding-left: 2rem; padding-right: 2rem; padding-top: 1rem; padding-bottom: 1rem; } .machine-item:hover { color: white; } .machine-item img { width: auto; height: 25rem; margin-bottom: .8rem; margin-left: auto; margin-right: auto; } .machine-info { width: 41.2rem; padding-top: 3px; padding-left: 3px; padding-right: 3px; background-color: #fff; float: right; } #machine-info table { padding: 1rem; text-align: center; } #machine-info table td { border: 1px solid #929292; padding-top: .6rem; padding-bottom: .6rem; padding-left: 2rem !important; padding-right: 2rem; } #machine-info table td { font-size: 1.3rem; line-height: 1.6rem; color: #000; } #machine-info table tr:first-of-type td { background-color: #ED1C24; color: #fff; font-weight: 500; border: 1px solid white; } #machine-info table tr td:first-of-type { text-align: left; border-left: none; font-weight: 500; } #machine-info table tr td:last-of-type { border-right: none; } #machine-info table tr { margin: 1rem !important; } /* general */ h4 { font-weight: 300; font-size: 2.6rem; line-height: 2.8rem; color: #ED1C24; margin-bottom: 3rem; } /* jcarousel for icon slider - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .jcarousel-wrapper { background-color: black; height: auto; padding-left: 4rem; padding-right: 4rem; padding-top: 2rem; border: 1px solid #484849; position: relative; } .jcarousel-wrapper2 { background-color: black; height: auto; padding-left: 4rem; padding-right: 4rem; padding-top: 2rem; position: relative; } .jcarousel { position: relative; overflow: hidden; } .jcarousel ul { width: 20000em; position: relative; } .jcarousel ul li { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; float: left; margin-left: 2.3rem; margin-right: 2.3rem; margin-bottom: 2rem; min-height: 6rem; } .jcarousel-control-prev { left: 1rem; top: 4.5rem; } .jcarousel-control-next { right: 1rem; top: 4.5rem; } .jcarousel-control-prev:hover, .jcarousel-control-next:hover { background-color: #fff; color: #ED1C24; } /* Flashing */ .jcarousel ul li a { display: block; } .jcarousel ul li a:hover { background-image: url("/gfx/seal-glow.png"); background-position: center center; background-repeat: no-repeat; } /* pop jcarousel for icon slider */ .jcarousel-wrapper-pop { background-color: black; height: auto; padding-left: 4rem; padding-right: 4rem; padding-top: 1rem; padding-bottom: 1.6rem; border-top: 3px solid #ED1C24; border-bottom: 3px solid #ED1C24; position: relative; } .jcarousel-pop { position: relative; overflow: hidden; } .jcarousel-pop ul { width: 69.4rem; position: relative; } .jcarousel-pop ul li { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; margin-left: 0.75rem; margin-right: 0.75rem; } @media (min-width: 930px) { .jcarousel-pop ul li { float: left; } } .jcarousel-control-prev, .jcarousel-control-next { display: none; z-index: 100; width: 20px; height: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; position: absolute; cursor: pointer; text-decoration: none; text-align: center; color: #fff; font-size: 20px; font-family: Arial; line-height: 20px; background-color: #ED1C24; } .jcarousel-pop .jcarousel-control-prev { display: none; } .jcarousel-pop .jcarousel-control-next { display: none; } .jcarousel-pop .jcarousel-control-prev:hover, .jcarousel-control-next:hover { display: none; } /* Flashing */ .jcarousel-pop ul li a { display: block; } .jcarousel-pop ul li a:hover { background-image: url("/gfx/seal-glow2.png"); background-position: center center; background-repeat: no-repeat; } /* Greyscaled */ .greyme-pop { -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.4; } #rec-machine { width: 100%; background-image: url("/gfx/rec-machin-bg.jpg"); background-position: center center; background-repeat: no-repeat; } #rec-machine h1, #rec-machine h2.hd1 { background-color: #ED1C24; max-width: 69.4rem; font-family: "luminesign"; color: #fff; padding-left: 4rem; text-align: center; font-size: 2.8rem; line-height: 2rem; padding-top: 2rem; padding-bottom: 2rem; text-align: left; } #rec-machine .rec-pop-image { position: relative; padding-bottom: 3rem; padding-left: 4rem; padding-right: 4rem; padding-top: 6rem; } #rec-machine .rec-pop-image img { width: 100%; } #rec-machine .pop-link { text-align: center; } #rec-machine .pop-link a { font-family: "Roboto Condensed", sans-serif; display: inline-block; background-color: #ED1C24; color: white; font-size: 1.4rem; line-height: 2.2rem; font-weight: 300; text-transform: uppercase; -webkit-border-top-left-radius: 12px; -webkit-border-top-right-radius: 12px; -moz-border-radius-topleft: 12px; -moz-border-radius-topright: 12px; border-top-left-radius: 12px; border-top-right-radius: 12px; padding-bottom: 1rem; padding-top: .8rem; padding-right: 2rem; padding-left: 2rem; } #rec-machine .pop-link a:hover { background-color: rgb(77, 78, 83); } #rec-machine .pop-link a strong { font-weight: 400; } #rec-machine .pop-inset { padding-left: 4rem; padding-right: 4rem; padding-top: 2rem; padding-bottom: 2rem; color: white; font-size: 1.6rem; line-height: 2rem; } #rec-machine .bot-stripe { background-color: black; background-image: url("/gfx/stripe.png"); background-repeat: repeat; background-position: center bottom; } /* inline pop ups home - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #home-pop { background-color: #000; height: auto; position: relative; background-image: url("/gfx/seal-icon-pop-bg.jpg"); background-repeat: no-repeat; background-position: center bottom; } @media (min-width: 930px) { #home-pop { width: 69rem; } } #home-pop .sicon { position: absolute; top: 2rem; left: 4rem; width: auto; height: 11.1rem; } #home-pop .sicon img { width: auto; height: 11.1rem; } #home-pop .seal-image { padding-top: 15rem; padding-bottom: 3rem; padding-left: 5rem; padding-right: 4rem; width: 100%; } #home-pop .seal-image img { width: 100%; } /* inline pop ups global locations - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #locations-pop { width: 74rem; background-color: #fff; height: auto; } #locations-pop .pop-content { padding-left: 2rem; padding-right: 2rem; padding-top: 1.8rem; padding-bottom: 2rem; } #locations-pop .pop-content p { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #000; margin-bottom: .8rem; } #locations-pop .pop-content h2 { font-weight: 500; font-size: 2rem; line-height: 2.5rem; color: #000; margin-bottom: 1rem; } #locations-pop .pop-content strong { font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; color: #000; margin-bottom: .8rem; } #locations-pop .pop-content a, #locations-pop .pop-content a:link { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #000; margin-bottom: .8rem; } #locations-pop .pop-content a:hover { color: #ED1C24; } #locations-slider { width: 100%; } /* stripe blocks - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .stripe { display: block; } .stripe2 { display: none; } .stripe-full { background-color: rgba(0,0,0,0.85); background-image: url(/gfx/stripe.png); background-position: center top; height: auto; margin-bottom: 1rem; padding-top: 3rem; padding-bottom: 3rem; } .stripe-block { background-color: rgba(0,0,0,0.85); background-image: url(/gfx/stripe.png); background-position: center top; height: auto; padding-left: 1.9%; padding-right: 1.9%; border: 1px solid #484849; box-shadow: inset 3px 3px 3px rgba(255,255,255,0.1), inset -3px -3px 3px rgba(0,0,0,0.3); margin-bottom: 2rem; padding-top: 2rem; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { .stripe-block { max-width: 104rem; } } .range { display: inline-block; padding-left: 1.5rem; padding-right: 1.5rem; padding-top: .5rem; padding-bottom: .4rem; color: #fff; font-size: 1.8rem; line-height: 2.2rem; font-weight: 300; -webkit-border-top-left-radius: 12px; -webkit-border-top-right-radius: 12px; -moz-border-radius-topleft: 12px; -moz-border-radius-topright: 12px; border-top-left-radius: 12px; border-top-right-radius: 12px; background-color: #ED1C24; text-transform: uppercase; margin-top: 1rem; } .stripe-box { float: left; margin-left: 1.9%; margin-right: 1.9%; width: calc(25% - 3.8%); margin-bottom: 2rem; } .stripe-box-machine { margin-bottom: 2rem; } @media (min-width: 1044px) { .stripe-box-machine { float: left; } } @media (min-width: 930px) { .stripe-box-machine { margin-left: 1.9%; margin-right: 1.9%; } } .stripe-box-machine h1, .stripe-box-machine h2.hd1 { font-family: "luminesign"; color: #ED1C24; text-align: center; font-size: 1.8rem; line-height: 2rem; } .stripe-box-machine img { height: 14rem; width: auto; padding: .5rem; margin-bottom: 1rem; } .stripe-box-machine a:hover > h1, .stripe-box-machine a:hover > h2.hd1 { color: #fff; } .stripe-box img, .stripe-box2 img { width: 100%; margin-bottom: 1rem; } .stripe-box a:hover > h1, .stripe-box2 a:hover > h1, .stripe-box a:hover > h2.hd1, .stripe-box2 a:hover > h2.hd1 { color: #ED1C24; } .stripe-box h1, .stripe-box2 h1, .stripe-box h2.hd1, .stripe-box2 h2.hd1 { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 1.7rem; line-height: 2rem; color: #fff; text-transform: uppercase; text-align: center; width: 100%; margin-bottom: .8rem; } #stripe-area p { font-weight: 300; font-size: 1.5rem; line-height: 2rem; color: #fff; width: 100%; margin-bottom: .4rem; } /* scale */ /* flashing - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .stripe-box a:hover > img { opacity: 1; -webkit-animation: flash 1.5s; animation: flash 1.5s; } /* trays and materials - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #trays-materials { margin-left: auto; margin-right: auto; overflow: hidden; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #trays-materials { max-width: 137.8rem; } } #trays-materials .stripe-tm { border-bottom: 4px solid #ED1C24; background-color: black; } #trays-materials .stripe-area-tm { margin-left: auto; margin-right: auto; } @media (min-width: 1044px) { #trays-materials .stripe-area-tm { max-width: 104rem; } } #trays-materials .imagearea-tm { width: calc(100% - 40rem); text-align: center; padding-top: 3rem; } @media (min-width: 930px) { #trays-materials .imagearea-tm { float: left; padding-right: 4rem; } } #trays-materials .imagearea-tm img { max-height: 26rem; max-width: 100%; margin-left: auto; margin-right: auto; } #trays-materials .textarea-tm { width: 40rem; padding-top: 3rem; } @media (min-width: 930px) { #trays-materials .textarea-tm { float: right; } } #trays-materials .textarea-tm h2 { color: white; font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.6rem; line-height: 2.8rem; margin-bottom: 1rem; } #trays-materials .textarea-tm p { color: white; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; } @media (min-width: 930px) { #trays-materials .stripe-tm:nth-of-type(even) .imagearea-tm { float: right !important; padding-left: 4rem; padding-right: 0; } } @media (min-width: 930px) { #trays-materials .stripe-tm:nth-of-type(even) .textarea-tm { float: left !important; } } #trays-materials ul { padding-top: 2rem; } #trays-materials ul li { display: inline-block; margin-right: 0.7rem; font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.8rem; } #trays-materials ul li a { display: block; padding-left: 1.5rem; padding-right: 1.5rem; background-color: #ED1C24; text-transform: uppercase; color: white; padding-top: 0.8rem; padding-bottom: 0.6rem; line-height: 1.8rem; } @media (min-width: 930px) { #trays-materials ul li a { -webkit-border-top-left-radius: 12px; -webkit-border-top-right-radius: 12px; -moz-border-radius-topleft: 12px; -moz-border-radius-topright: 12px; border-top-left-radius: 12px; border-top-right-radius: 12px; } } #trays-materials ul li a:hover { background-color: black; } /* processes */ #processes { max-width: 137.8rem; margin-left: auto; margin-right: auto; overflow: hidden; } #processes .stripe-proc { border-bottom: 4px solid #ED1C24; background-image: url(/gfx/processslice-bg.jpg); background-repeat: no-repeat; background-position: center bottom; padding-top: 2rem; padding-bottom: 2rem; } #processes .stripe-area-proc { margin-left: auto; margin-right: auto; } @media (min-width: 930px) { #processes .stripe-area-proc { max-width: 104rem; } } #processes .sealarea-proc { float: left; width: 20%; text-align: center; padding-top: 5rem; } #processes .sealarea-proc img { max-width: 100%; margin-left: auto; margin-right: auto; } #processes .imagearea-proc { float: left; width: 40%; padding-left: 5%; padding-right: 5%; text-align: center; } #processes .imagearea-proc img { max-height: 26rem; max-width: 100%; margin-left: auto; margin-right: auto; } #processes .textarea-proc { width: 40%; } @media (min-width: 930px) { #processes .textarea-proc { float: right; } } #processes .textarea-proc h2 { font-family: "Roboto"; font-weight: 400; font-size: 2.4rem; line-height: 100%; color: #ED1C24; margin-bottom: 0.5rem; } #processes .textarea-proc h2 span { color: #ED1C24; } #processes .textarea-proc p { color: white; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; } /* machine range */ .machine-image { background-position: right top; background-repeat: no-repeat; background-size: 100%; } .foodcat-image { background-position: right top; background-repeat: no-repeat; background-size: 100%; } .text-area-machine { padding-top: 4rem; padding-bottom: 4rem; } @media (min-width: 930px) { .text-area-machine { max-width: 50%; min-height: 54.5rem; } } .text-area-food { padding-top: 4rem; padding-bottom: 4rem; } @media (min-width: 930px) { .text-area-food { max-width: 39%; min-height: 34.6rem; } } .text-area-food a { color: rgb(139, 182, 46) !important; } .text-area-food a:hover { color: rgb(139, 182, 46) !important; text-decoration: none; } #machine-area { width: 100%; margin-left: auto; margin-right: auto; } #machine-area .machine-range { display: inline-block; padding-left: 1.5rem; padding-right: 1.5rem; padding-top: .5rem; padding-bottom: .4rem; color: #fff; font-size: 1.8rem; line-height: 2.2rem; font-weight: 300; -webkit-border-bottom-left-radius: 12px; -webkit-border-bottom-right-radius: 12px; -moz-border-radius-bottomleft: 12px; -moz-border-radius-bottomright: 12px; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; background-color: #ED1C24; text-transform: uppercase; margin-bottom: 3rem; } #machine-area .machine-block-outer { border-top: 2px solid #ED1C24; background-color: rgb(32,32,32); } #machine-area .machine-block-outer:nth-of-type(even) { background-color: #000; } #machine-area .machine-block { height: auto; max-width: 104rem; padding-bottom: 3rem; padding-top: 0rem; margin-left: auto; margin-right: auto; text-align: center; } #machine-area .machine-box { margin-left: 0.5rem; margin-right: 0.5rem; margin-bottom: 3rem; display: inline-block; vertical-align: bottom; } #machine-area .machine-box h1, #machine-area .machine-box h2.hd1 { font-family: "luminesign"; color: #ED1C24; text-align: center; font-size: 3rem; line-height: 3.8rem; } #machine-area .machine-box img { height: 25rem; width: auto; padding: 0rem; margin-bottom: 1rem; margin-left: auto; margin-right: auto; } #machine-area .machine-box a:hover > h1, #machine-area .machine-box a:hover > h2.hd1 { color: #fff; } #machine-area .pre-machine-range { width: 100%; text-align: left; } @media (min-width: 930px) { #machine-area .specBlock { height: 7.2rem; } } #machine-area .machineSpec { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.4rem; line-height: 1.8rem; color: white; } #machine-area .machinePacks { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.4rem; line-height: 1.8rem; color: #ED1C24; font-style: italic; } /* se explained - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .machine-range-icons span { font-family: "luminesign"; font-size: 2.4rem; color: #fff; text-transform: none; } .tabBorder { border-top: 3px solid #ED1C24; height: 3px; } #seStripe01 h1 span, #seStripe01 h2.hd1 span { font-family: "luminesign"; } .seImage01 { max-width: 137.8rem; margin-left: auto; margin-right: auto; background-position: right top; background-repeat: no-repeat; background-size: auto 100%; } #seStripe01 { margin-left: auto; margin-right: auto; } @media (min-width: 1044px) { #seStripe01 { width: 104rem; } } #seStripe01 .col01 { width: 50%; height: calc(54.5rem - 3.2rem); padding-top: 8rem; } #seStripe02, #seStripe04 { max-width: 104rem; padding-top: 3rem; padding-bottom: 3rem; margin-left: auto; margin-right: auto; } @media (min-width: 769px) { #seStripe03 { max-width: 104rem; padding-top: 3rem; padding-bottom: 3rem; margin-left: auto; margin-right: auto; } } #seStripe02 .col01 { width: 50%; } @media (min-width: 769px) { #seStripe02 .col01 { float: left; } } #seStripe02 .col01 .logo { margin-bottom: 1rem; } @media (min-width: 930px) { #seStripe02 .col01 .logo { height: 13rem; } } @media (min-width: 930px) { #seStripe02 .col01 .logo img { height: 100%; } } #seStripe02 .col02 { width: 50%; text-align: right; } @media (min-width: 769px) { #seStripe02 .col02 { float: right; } } #seStripe02 .col02 img { height: 37rem; display: inline-block; } @media (min-width: 769px) { #seStripe03 .col02 { width: 47%; float: right; } } @media (min-width: 930px) { #seStripe03 .col02 .logo { height: 13rem; } } @media (min-width: 769px) { #seStripe03 .col02 .logo { margin-bottom: 1rem; } } @media (min-width: 930px) { #seStripe03 .col02 .logo img { height: 100%; } } @media (min-width: 769px) { #seStripe03 .col01 { width: 53%; float: left; } } @media (min-width: 769px) { #seStripe03 .col01 img { height: 37rem; } } #seStripe01 h1, #seStripe02 h1, #seStripe01 h2.hd1, #seStripe02 h2.hd1 { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 2.8rem; line-height: 3.2rem; color: #ED1C24; margin-bottom: 1rem; } @media (min-width: 769px) { #seStripe03 h1, #seStripe03 h2.hd1 { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 2.8rem; line-height: 3.2rem; color: #ED1C24; margin-bottom: 1rem; } } #seStripe01 h2, #seStripe02 h2 { font-family: "Roboto", sans-serif; font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .8rem; } @media (min-width: 769px) { #seStripe03 h2 { font-family: "Roboto", sans-serif; font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .8rem; } } #seStripe01 p, #seStripe02 p { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .8rem; } @media (min-width: 769px) { #seStripe03 p { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .8rem; } } #seStripe01 strong, #seStripe02 strong { font-family: "Roboto", sans-serif; font-weight: 500; } @media (min-width: 769px) { #seStripe03 strong { font-family: "Roboto", sans-serif; font-weight: 500; } } #seStripe01 ul li, #seStripe02 ul li { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } @media (min-width: 769px) { #seStripe03 ul li { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } } #seStripe01 ul li:before, #seStripe02 ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } @media (min-width: 769px) { #seStripe03 ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } } #seStripe01 blockquote, #seStripe02 blockquote { font-family: "Roboto", sans-serif; display: block; background-color: rgba(0,0,0,0.1); padding: 2rem; margin-bottom: 1rem; margin-top: 1rem; } @media (min-width: 769px) { #seStripe03 blockquote { font-family: "Roboto", sans-serif; display: block; background-color: rgba(0,0,0,0.1); padding: 2rem; margin-bottom: 1rem; margin-top: 1rem; } } #seStripe01 blockquote p:first-of-type, #seStripe02 blockquote p:first-of-type { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #000; margin-bottom: .8rem; } @media (min-width: 769px) { #seStripe03 blockquote p:first-of-type { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #000; margin-bottom: .8rem; } } #seStripe01 a, #seStripe01 a:link, #seStripe02 a, #seStripe02 a:link { color: #ED1C24; } @media (min-width: 769px) { #seStripe03 a, #seStripe03 a:link { color: #ED1C24; } } #seStripe01 a:hover, #seStripe02 a:hover { color: #ED1C24; text-decoration: underline; } @media (min-width: 769px) { #seStripe03 a:hover { color: #ED1C24; text-decoration: underline; } } #seStripe01 .red, #seStripe02 .red { color: #ED1C24; } @media (min-width: 769px) { #seStripe03 .red { color: #ED1C24; } } #seStripe01 .big, #seStripe02 .big { font-weight: 300; font-size: 2rem; line-height: 2.5rem; color: #fff; margin-bottom: 1rem; } @media (min-width: 769px) { #seStripe03 .big { font-weight: 300; font-size: 2rem; line-height: 2.5rem; color: #fff; margin-bottom: 1rem; } } #seStripe01 span, #seStripe02 span { font-family: "luminesign"; font-size: 2.4rem; line-height: 3.2rem; color: #ED1C24; } @media (min-width: 769px) { #seStripe03 span { font-family: "luminesign"; font-size: 2.4rem; line-height: 3.2rem; color: #ED1C24; } } #seStripe01, #seStripe02 { color: white; } @media (min-width: 769px) { #seStripe03 { color: white; } } #seStripe04 table, #seStripe04 th, #seStripe04 td { border-collapse: collapse; } #seStripe04 table { width: 100%; color: white; font-family: "Roboto", sans-serif; font-weight: 400; font-size: 1.4rem; line-height: 120%; text-transform: uppercase; } #seStripe04 table tr { border-bottom: 0.2rem solid #333; } #seStripe04 table thead tr { border-bottom: 0; } #seStripe04 table thead { border-bottom: 0; background-color: #ED1C24; margin-bottom: 1rem; padding-top: 2rem; padding-bottom: 2rem; } #seStripe04 .thead { font-family: "Roboto", sans-serif; font-weight: 400; font-size: 1.6rem; line-height: 120%; text-transform: uppercase; color: white; width: 100%; padding: 1rem; } #seStripe04 .thead span { font-family: "luminesign"; text-transform: none; font-size: 2.4rem; } #seStripe04 table td { padding-top: 1rem; padding-bottom: 1rem; } #seStripe04 table td span { font-family: "luminesign"; color: #ED1C24; } #seStripe04 table tr td:nth-of-type(2) { text-align: left; } #seStripe04 table td img { max-height: 7rem; display: inline-block; } #seStripe04 table th, #seStripe04 table td { vertical-align: middle; text-align: center; } #seStripe04 table .tick:before { content: "✓"; font-family: "Arial Unicode MS","Arial"; font-size: 2.8rem; line-height: 3.2rem; color: rgb(139, 182, 46); } #seStripe04 table .cross:before { content: "✗"; font-family: "Arial Unicode MS", "Arial"; font-size: 2.8rem; line-height: 3.2rem; color: #333; } @media (min-width: 769px) { #seStripe03m { display: none; } } /* jcarousel for icon slider */ .machine-range-heading { max-width: 104rem; margin-left: auto; margin-right: auto; text-align: left; } #machine-icons { border-top: 2px solid #ED1C24; background-color: #000; } .machine-range-icons { display: inline-block; padding-left: 1.5rem; padding-right: 1.5rem; padding-top: .5rem; padding-bottom: .4rem; color: #fff; font-size: 1.8rem; line-height: 2.2rem; font-weight: 300; -webkit-border-top-left-radius: 12px; -webkit-border-top-right-radius: 12px; -moz-border-radius-topleft: 12px; -moz-border-radius-topright: 12px; border-top-left-radius: 12px; border-top-right-radius: 12px; background-color: #ED1C24; text-transform: uppercase; } #machine-icons .xcarousel-wrapper { height: auto; max-width: 104rem; padding-left: 4rem; padding-right: 4rem; padding-top: 2rem; position: relative; margin-left: auto; margin-right: auto; } #machine-icons .xcarousel { position: relative; overflow: hidden; } #machine-icons .xcarousel ul { width: 20000em; position: relative; } #machine-icons .xcarousel ul li { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; float: left; margin-left: 2.3rem; margin-right: 2.3rem; margin-bottom: 3rem; min-height: 6rem; } #machine-icons .xcarousel-control-prev, #machine-icons .xcarousel-control-next { z-index: 100; width: 20px; height: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; position: absolute; cursor: pointer; text-decoration: none; text-align: center; color: #fff; font-size: 20px; font-family: Arial; line-height: 20px; background-color: #ED1C24; } #machine-icons .xcarousel-control-prev { left: 1rem; top: 4.5rem; } #machine-icons .xcarousel-control-next { right: 1rem; top: 4.5rem; } #machine-icons .xcarousel-control-prev:hover, #machine-icons .xcarousel-control-next:hover { background-color: #fff; color: #ED1C24; } #machine-icons .xcarousel a:hover img { opacity: 1; -webkit-animation: flash 1s; animation: flash 1s; } @-webkit-keyframes flash { 0% { opacity: .4; } 100% { opacity: 1; } } @keyframes flash { 0% { opacity: .4; } 100% { opacity: 1; } } #machine-icons .nocbak { opacity: .4; } .greyme { -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: .3; } #machine-icons .xcarousel ul li a { display: block; } #machine-icons .xcarousel ul li a:hover, #machine-icons .xcarousel ul li a.selected { background-image: url("/gfx/seal-glow.png"); background-position: center center; background-repeat: no-repeat; } /* food categories detail carousel - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* global locations - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* news blocks - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .news-tab { position: relative; display: inline-block; background-color: #ED1C24; font-weight: 300; font-size: 1.9rem; line-height: 2rem; color: #fff; text-transform: uppercase; padding-top: 1rem; padding-left: 3.9%; padding-right: 3.9%; -webkit-border-top-left-radius: 16px; -webkit-border-top-right-radius: 36px; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 36px; border-top-left-radius: 16px; border-top-right-radius: 36px; margin-top: 2rem; } img.curve { position: absolute; bottom: 0; right: -12px; } .news-block { background-color: #ED1C24; height: auto; width: 100%; padding-left: 1.9%; padding-right: 1.9%; margin-bottom: 2rem; padding-top: 2rem; } .news-box { float: left; margin-left: 1.9%; margin-right: 1.9%; width: calc(25% - 3.8%); margin-bottom: 2rem; } .news-box img { width: 100%; margin-bottom: 1rem; } #news-area a:hover > h1, #news-area a:hover > h2.hd1 { color: #000; } #news-area a:hover > p span { color: #D0BE20; } #news-area h1, #news-area h2.hd1 { font-weight: 300; font-size: 1.5rem; line-height: 1.7rem; color: #fff; text-transform: uppercase; width: 100%; margin-bottom: .8rem; } #news-area p.date { font-weight: 300; font-size: 1.2rem; line-height: 1.4rem; color: #fff; text-transform: uppercase; width: 100%; margin-bottom: .8rem; } #news-area p { font-weight: 300; font-size: 1.4rem; line-height: 1.7rem; color: #000; width: 100%; margin-bottom: .8rem; } #news-area p.more { font-weight: 300; font-size: 1.2rem; line-height: 2rem; color: #fff; text-transform: uppercase; width: 100%; margin-bottom: .8rem; } .news-box a > img { opacity: 1; -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; } .news-box a:hover > img { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } /* slider - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .bx-wrapper ul li:before { content: none !important; padding: 0 !important; } .bx-wrapper ul li { padding: 0 !important; } .bx-wrapper { position: relative; margin: 0; padding: 0; } .bx-wrapper img { max-width: 100%; display: block; } .bx-wrapper .bx-viewport { -webkit-transform: translatez(0); -moz-transform: translatez(0); -ms-transform: translatez(0); -o-transform: translatez(0); transform: translatez(0); } .bx-wrapper .bx-loading { min-height: 50px; background: url(/gfx/bx_loader.gif) center center no-repeat #fff; height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 2000; } .bx-wrapper .bx-pager { position: absolute; bottom: 2rem; right: 6rem; } #slider-contact .bx-pager { position: absolute; top: calc(50% + 2.5rem); left: 2.5rem; } .bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item { display: inline-block; height: 12px; padding-left: 12px; } .bx-wrapper .bx-pager.bx-default-pager a, .bx-wrapper .bx-pager.bx-default-pager a:link { background: none; display: block; width: 12px; height: 12px; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; color: #ED1C24; border: 1px solid #ED1C24; text-indent: -9999px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active { background: #ED1C24; color: #ED1C24; text-indent: -9999px; } .bx-wrapper .slider-caption { position: absolute; left: 3.2rem; top: 0; width: 24%; height: 100%; padding: 2rem; background-color: rgb(0,0,0); font-weight: 300; font-size: 2rem; line-height: 2.4rem; color: #fff; } .bx-wrapper ul li img { margin-left: auto; margin-right: auto; } .bxslider iframe { width: 100% !important; height: 49.2rem !important; padding: 0 !important; margin: 0 !important; border: 0 !important; } #slider-contact .map-caption { position: absolute; left: 1rem; top: calc(50% - 2rem); min-width: 38rem; width: auto; height: 7rem; padding-left: 2rem; padding-right: 2rem; background-color: rgba(255,255,255,1); font-weight: 300; font-size: 2.8rem; line-height: 4rem; color: #ED1C24; z-index: 900; -webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2); -moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2); box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2); } /* tabs - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #tabs { margin-left: auto; margin-right: auto; padding-top: 6rem; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #tabs { max-width: 104rem; } } #machine-info { margin-left: auto; margin-right: auto; padding-top: 2rem; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #machine-info { max-width: 104rem; } } /* modified Tabs */ /* ul */ .c-tabs { list-style: none; } /* li */ .c-tabs__item { display: inline; padding: 0 !important; margin: 0; margin-left: -0.01rem; vertical-align: bottom; } /* li */ .c-tabs__item:first-of-type { margin-left: 0; } /* ul li a */ .c-tabs__link { font-size: 2rem; line-height: 2.4rem; font-weight: 300 !important; display: inline-block; text-decoration: none; padding-left: 3.5rem; padding-right: 3.5rem; color: #fff; -webkit-border-top-left-radius: 12px; -webkit-border-top-right-radius: 12px; -moz-border-radius-topleft: 12px; -moz-border-radius-topright: 12px; border-top-left-radius: 12px; border-top-right-radius: 12px; background-color: rgb(146,146,146); margin-right: 0; padding-top: 0.8rem; padding-bottom: .7rem; vertical-align: bottom; } .c-tabs__item:nth-of-type(even) .c-tabs__link { background-color: rgb(90,90,90); } .c-tabs__item:before { content: "" !important; } .c-tabs__link.is-active, .c-tabs__link:hover, .c-tabs__item:nth-of-type(even) .c-tabs__link:hover, .c-tabs__item:nth-of-type(even) .c-tabs__link.is-active { background-color: #ED1C24; color: #fff; } .c-tabs__content { display: none; width: 100%; float: left; padding: 3.6rem; background-color: #fff !important; } .c-tabs__content2 { display: none; width: 100%; height: 100%; float: left; padding: 0; background-color: #fff; } .c-tabs__content3 { display: none; width: 100%; float: left; padding: 3.6rem; padding-left: 0; padding-right: 0; background-color: black; } .c-tabs { overflow: hidden; } #tabs .left_col { width: 50%; margin-bottom: 3rem; } @media (min-width: 930px) { #tabs .left_col { float: left; padding-right: 2rem; } } @media (min-width: 1044px) { #tabs .leftColFull { width: 100%; float: none; padding-right: 0; margin-bottom: 3rem; } } #tabs .right_col { width: 50%; margin-bottom: 3rem; } @media (min-width: 930px) { #tabs .right_col { float: left; padding-left: 2rem; } } #tabs .left_col2 { width: 25%; float: left; padding-right: 2rem; margin-bottom: 3rem; } #tabs .right_col2 { width: 75%; float: left; padding-left: 2rem; margin-bottom: 3rem; } #tabs .left_col3 { width: 40%; margin-bottom: 3rem; } @media (min-width: 930px) { #tabs .left_col3 { float: left; padding-right: 2rem; } } #tabs .right_col3 { width: 60%; margin-bottom: 3rem; } @media (min-width: 930px) { #tabs .right_col3 { float: left; padding-left: 2rem; } } #full-map .left_fullmap { width: 40%; margin-bottom: 3rem; } @media (min-width: 930px) { #full-map .left_fullmap { float: left; padding-right: 2rem; } } #full-map .right_fullmap { width: 60%; margin-bottom: 3rem; } @media (min-width: 930px) { #full-map .right_fullmap { float: left; padding-left: 2rem; } } #tabs .feature-img img { width: 100%; } #tabs object { width: 100%; min-height: 100%; } #tabs .right_col img { width: 100%; } #tabs h2, #full-map h2 { font-weight: 500; font-size: 1.4rem; line-height: 3rem; color: #fff; margin-bottom: 2rem; margin-top: 3rem; display: inline-block; background-color: #ED1C24; padding-left: 1.6rem; padding-right: 1.6rem; } #tabs h3, #full-map h3 { font-weight: 500; font-size: 1.4rem; line-height: 2rem; color: #000; margin-bottom: .8rem; margin-top: 3rem; } #full-map h3:first-of-type { margin-top: 0; } #tabs .left_col2 h2 { margin-top: 0; } #tabs .right_col2 h2 { margin-top: 0; } #tabs p, #full-map p { font-weight: 300; font-size: 1.3rem; line-height: 1.6rem; color: #000; margin-bottom: .8rem; } #tabs strong, #full-map strong { font-weight: 500; } #tabs ul li, #full-map ul li { font-weight: 300; font-size: 1.3rem; line-height: 1.6rem; color: #000; margin-bottom: .4rem; position: relative; padding-left: 1rem; } #tabs .left_col ul li::before, #tabs .leftColFull ul li::before, #tabs .right_col ul li::before, #tabs .left_col2 ul li::before, #tabs .right_col2 ul li::before, #tabs .left_col3 ul li::before, #tabs .right_col3 ul li::before, #tabs .left_fullmap ul li::before, #tabs .right_fullmap ul li::before { content: "•"; font-weight: 500; position: absolute; left: 0; top: 0; color: #ED1C24; } #tabs .feature-img { margin-bottom: 4rem; } #tabs table td, #full-map table td { padding-left: 2rem; padding-bottom: .5rem; padding-top: .5rem; } #tabs table td:first-of-type, #full-map table td:first-of-type { padding-left: 0; font-weight: 500; } #tabs table td strong, #full-map table td strong { font-weight: 500; } #tabs table tr, #full-map table tr { border-bottom: 1px solid #ccc; } #tabs table tr:first-of-type, #full-map table tr:first-of-type { border-top: 1px solid #ccc; } #tabs table td p, #full-map table td p { margin-bottom: 0; } #tabs .baseTable td, #full-map .baseTable td { padding-left: 2rem; padding-bottom: .5rem; padding-top: .5rem; } #tabs .baseTable td:first-of-type, #full-map .baseTable td:first-of-type { padding-left: 0; font-weight: 300; } #tabs .baseTable td strong, #full-map .baseTable td strong { font-weight: 500; } #tabs .baseTable tr, #full-map .baseTable tr { border-bottom: 1px solid #ccc; } #tabs .baseTable tr:first-of-type, #full-map .baseTable tr:first-of-type { border-top: 1px solid #ccc; } #tabs .baseTable td p, #full-map .baseTable td p { margin-bottom: 0; } .togglelink { display: block; padding-top: 3rem; margin-bottom: 2rem; font-weight: 500; font-size: 1.6rem; line-height: 2rem; color: #ED1C24; margin-bottom: 1rem; } .togglelink:hover { color: #000; } #tabs table tbody { font-weight: 300; font-size: 1.3rem; line-height: 1.6rem; color: #000; } #tabs table { margin-bottom: 2rem; } #tabs .c-tabs__content2 .pdfdownload { width: 6rem; position: absolute; left: 0; top: 2.5rem; z-index: 400; } #tabs .c-tabs__content2 .pdfdownload img { width: 100%; } #tabs .c-tabs__content2 object { background-color: #fff; height: 80rem; } #tabs .machine-gallery { height: 24rem; float: left; margin-right: 4rem; margin-bottom: 4rem; } #tabs .machine-gallery img { height: 100%; } .machine-gallery-back { background-image: url(/gfx/proseal-bg2.jpg); background-position: center top; background-repeat: no-repeat; background-size: 100% auto; background-color: black !important; } #machine-gallery-pop { height: auto; background-color: black; padding: 6rem; background-image: url(/gfx/proseal-bg2.jpg); background-position: center top; background-repeat: no-repeat; background-size: 100% auto; } #machine-gallery-pop img { max-width: 90rem; max-height: 65rem; } /* news - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #news .news-panel { margin-bottom: 4rem; } #news .list-image { width: 28rem; } @media (min-width: 930px) { #news .list-image { padding-right: 3rem; float: left; } } #news .list-image img { width: 100%; } #news .list-text { width: calc(100% - 28rem); } @media (min-width: 930px) { #news .list-text { float: left; } } #news .date { font-weight: 500; font-size: 1.4rem; line-height: 1.6rem; color: #fff; margin-bottom: 1rem; } #news h1, #news h2.hd1 { font-weight: 500; font-size: 1.6rem; line-height: 2rem; color: #FFF; margin-bottom: 1rem; text-transform: uppercase; } #news p { font-weight: 300; font-size: 1.6rem; line-height: 2rem; color: #FFF; margin-bottom: 1rem; } #news .more-news { font-weight: 300; font-size: 1.2rem; line-height: 2rem; color: #ED1C24; text-transform: uppercase; } #news .more-news:hover { color: #fff; } /* news detail - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #news .news-image-panel { margin-bottom: 4rem; } #news .detail-image { width: calc(33.33% - 1.666rem); float: left; margin-left: 2.5rem; } @media (min-width: 930px) { #news .detail-image:first-of-type { margin-left: 0; } } #news .detail-image img { width: 100%; } /* news pagination - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #pagination .blocked { display: inline-block; padding-left: 1.6rem; padding-right: 1.6rem; font-weight: 500; font-size: 1.5rem; line-height: 3.8rem; color: #fff; background-color: #ED1C24; float: left; margin-bottom: 0; } #pagination .notblocked { display: inline-block; padding-left: 1.6rem; padding-right: 1.6rem; font-weight: 500; font-size: 1.5rem; line-height: 3.8rem; color: #ceccc0; background-color: #FFF; text-decoration: none; float: left; margin-bottom: 0; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #pagination .notblocked { margin-left: .8rem; } } #pagination a, #pagination a:link, #pagination .unblocked { display: inline-block; padding-left: 1.6rem; padding-right: 1.6rem; font-size: 1.5rem; line-height: 3.8rem; color: #ED1C24; background-color: #fff; text-decoration: none; float: left; margin-bottom: 0; font-weight: 500; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #pagination a, #pagination a:link, #pagination .unblocked { margin-left: .8rem; } } #pagination a:hover { display: inline-block; padding-left: 1.6rem; padding-right: 1.6rem; font-weight: 500; font-size: 1.5rem; line-height: 3.8rem; color: #FFF; background-color: #ED1C24; text-decoration: none; } /* contact - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .address-panel { margin-bottom: 4rem; } .inputArea { padding-bottom: 4rem; } .inputArea .col1 { width: 50%; } @media (min-width: 930px) { .inputArea .col1 { padding-right: 2rem; float: left; } } .inputArea .col2 { width: 50%; } @media (min-width: 930px) { .inputArea .col2 { padding-left: 2rem; float: left; } } .inputArea p { color: #fff !important; color: white; } @media (min-width: 1044px) { .inputArea p { font-family: "Roboto", sans-serif !important; font-weight: 300; font-size: 1.6rem !important; line-height: 110%; } } @media (min-width: 1044px) { .inputArea p a { white-space: nowrap; } } .relative { position: relative; } .inputArea input[type=text] { border: 1px solid #fff; width: 100%; display: block; font-size: 1.6rem; font-weight: 300; color: #fff; padding: .8rem; margin-bottom: 1rem; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: .4rem; -moz-border-radius: .4rem; border-radius: .4rem; background-color: transparent; font-family: "Roboto", sans-serif !important; } .inputArea textarea { border: 1px solid #fff; width: 100%; display: block; font-size: 1.6rem; font-weight: 300; color: #fff; padding: .8rem; margin-bottom: 1rem; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; resize: none; -webkit-border-radius: .4rem; -moz-border-radius: .4rem; border-radius: .4rem; background-color: transparent; height: 13.2rem; font-family: "Roboto", sans-serif !important; } .inputArea a.sbtn, .inputArea a.sbtn:link { background-color: #929292; color: #000 !important; letter-spacing: 1px; display: inline-block; padding-left: 2.4rem; padding-right: 2.4rem; text-decoration: none !important; font-size: 1.6rem; line-height: 3.8rem; font-weight: 300; } .inputArea a.sbtn:hover { background-color: #ED1C24; color: #fff !important; } .inputArea .tick { font-family: Arial; font-weight: 400; font-size: 1.3rem; line-height: 2rem; text-align: center; width: 2rem; height: 2rem; background-color: #929292; -moz-border-radius: 2rem; -webkit-border-radius: 2rem; border-radius: 2rem; position: absolute; right: .8rem; top: .8rem; color: #fff; z-index: 100; } .inputArea .cross, .inputArea .invalid { font-family: Arial; font-weight: 400; font-size: 1.3rem; line-height: 2rem; text-align: center; width: 2rem; height: 2rem; background-color: #ED1C24; -moz-border-radius: 2rem; -webkit-border-radius: 2rem; border-radius: 2rem; position: absolute; right: .8rem; top: .8rem; color: #fff; z-index: 100; } .inputArea .red { color: #ED1C24; } ::-webkit-input-placeholder { font-size: 1.6rem; color: #929292; font-family: "Roboto", sans-serif !important; } :-moz-placeholder { font-size: 1.6rem; color: #929292; opacity: 1; font-family: "Roboto", sans-serif !important; } ::-moz-placeholder { font-size: 1.6rem; color: #929292; opacity: 1; font-family: "Roboto", sans-serif !important; } :-ms-input-placeholder { font-size: 1.6rem; color: #929292; font-family: "Roboto", sans-serif !important; } .inputArea textarea:focus, .inputArea input:focus { background-color: rgba(0,0,0,.5); } #contact { margin-left: auto; margin-right: auto; } @media (min-width: 1044px) { #contact { max-width: 104rem; } } #contact .address-block { width: 33.33%; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { #contact .address-block { margin-bottom: 2rem; } } @media (min-width: 930px) { #contact .address-block { float: left; } } #contact h2 { font-weight: 500; font-size: 1.6rem; line-height: 2rem; color: #ED1C24; margin-bottom: .4rem; } #contact p { font-weight: 300; font-size: 1.6rem; line-height: 2rem; color: #fff; margin-bottom: 1rem; } #contact strong { font-weight: 500; } #contact a, #contact a:link { font-weight: 300; font-size: 1.6rem; line-height: 2rem; color: #fff; margin-bottom: 1rem; } #contact a:hover { color: #ED1C24; } /* find your machine - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #checkboxes input[type=checkbox] { display: none; } #checkboxes input[type=radio] { display: none; } #checkboxes input[type=radio]:checked + .box-outline { border: 1px solid red; background-color: #ED1C24; } #checkboxes input[type=checkbox]:checked + .box-outline { border: 1px solid red; background-color: #ED1C24; } .fillit { background-color: rgba(255,255,255,0.2); border: 1px solid #fff !important; } #findarea { padding-bottom: 4rem; } #findarea .box-outline { cursor: pointer; border: 1px solid #fff; width: 100%; display: block; font-size: 1.6rem; font-weight: 300; color: #fff; padding: .8rem; margin-bottom: 1rem; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: .4rem; -moz-border-radius: .4rem; border-radius: .4rem; background-color: transparent; font-family: "Roboto", sans-serif !important; } #findarea .findblock { width: calc(33% - 2.5rem); } @media (min-width: 930px) { #findarea .findblock { float: left; margin-left: 4rem; min-height: 46rem; } } #findarea .findblock { padding: 2rem; border: 1px solid #ED1C24; } #findarea .findblock { position: relative; } @media (min-width: 930px) { #findarea .findblock:first-of-type { float: left; margin-left: 0; } } #findarea .reset, #findarea .process { background-color: #929292; color: #000 !important; letter-spacing: 1px; display: inline-block; padding-left: 2rem; padding-right: 2rem; text-decoration: none !important; font-size: 1.4rem; line-height: 3.2rem; font-weight: 300; border: none; } #findarea .reset:hover, #findarea .process:hover { background-color: #ED1C24; color: #fff !important; } #findarea .reset { position: absolute; bottom: 2rem; left: 2rem; } #findarea .process { position: absolute; bottom: 2rem; right: 2rem; } #findarea .tick { font-family: Arial; font-weight: 400; font-size: 1.3rem; line-height: 2rem; text-align: center; width: 2rem; height: 2rem; background-color: #929292; -moz-border-radius: 2rem; -webkit-border-radius: 2rem; border-radius: 2rem; position: absolute; right: 2rem; top: 2rem; color: #fff; z-index: 100; } #findarea .cross { font-family: Arial; font-weight: 400; font-size: 1.3rem; line-height: 2rem; text-align: center; width: 2rem; height: 2rem; background-color: #ED1C24; -moz-border-radius: 2rem; -webkit-border-radius: 2rem; border-radius: 2rem; position: absolute; right: 2rem; top: 2rem; color: #fff; z-index: 100; } #search-again { background-color: #929292; border: none; color: #000; padding-left: 2rem; padding-right: 2rem; text-align: center; text-decoration: none; display: inline-block; font-size: 1.4rem; line-height: 3.2rem; font-weight: 300; cursor: pointer; letter-spacing: 1px; text-transform: uppercase; } #search-again:hover { background-color: #ED1C24; color: #fff; } .rounded { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } /* innovations (old) - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* innovations - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #innovations { margin-left: auto; margin-right: auto; } @media (min-width: 930px) { #innovations { max-width: 121.8rem; } } #innovations .innovations-panel { width: 100%; background-repeat: no-repeat; } @media (min-width: 769px) { #innovations .innovations-panel { height: 49.1rem; } } #innovations .innovations-content { margin-left: auto; margin-right: auto; } @media (min-width: 1044px) { #innovations .innovations-content { max-width: 104rem; } } @media (min-width: 769px) { #innovations .innovations-content { height: 49.1rem; } } #innovations .innovations-items { padding-top: 3rem; } @media (min-width: 930px) { #innovations .innovations-items { max-width: 42rem; } } @media (min-width: 769px) { #innovations .innovations-items { height: 49.1rem; } } #innovations .imgtop { margin-bottom: 2rem; } #innovations .imgbot { margin-top: 2rem; } #innovations img { max-width: 38rem; } #innovations .pushdown1 { padding-top: 3rem; } #innovations .pushdown2 { padding-top: 4rem; } #innovations .pushdown3 { padding-top: 5rem; } #innovations .pushdown4 { padding-top: 6rem; } #innovations .pushdown5 { padding-top: 7rem; } #innovations h1, #innovations h2.hd1 { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.4rem; line-height: 2.8rem; color: #ED1C24; margin-bottom: 1rem; } #innovations h2 { font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #innovations h2 span { font-weight: 100; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #innovations p { font-weight: 300; font-size: 1.4rem; line-height: 2rem; color: #fff; margin-bottom: 0.8rem; } #innovations strong { font-weight: 500; } #innovations ul li { font-weight: 300; font-size: 1.6rem; line-height: 2rem; color: #fff; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } #innovations ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; font-size: 2rem; } /* innovationsNew - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .innovationsNew { margin-left: auto; margin-right: auto; } @media (min-width: 769px) { .innovationsNew { max-width: 121.8rem; } } .innovationsNew .imagefwiv { width: 100%; margin-bottom: 5rem; } .innovationsNew .imagefwiv img { width: 100%; } .innovationsNew .videofwiv { width: 100%; margin-bottom: 5rem; } .innovationsNew .textto { max-width: 104rem; margin-left: auto; margin-right: auto; margin-bottom: 5rem; } .innovationsNew .imageBackgroundtoi { background-repeat: no-repeat; background-size: contain; width: 100%; height: 49.1rem; position: relative; margin-bottom: 5rem; } .innovationsNew .texttoi { width: 100%; } .innovationsNew .padLefttoi { padding-left: 60%; padding-right: 8.9rem; background-position: left center; } .innovationsNew .padRighttoi { padding-right: 60%; padding-left: 8.9rem; background-position: right center; } .innovationsNew .pad4 { padding-left: 4%; padding-right: 4%; } .innovationsNew .pad8 { padding-left: 8%; padding-right: 8%; } .innovationsNew .pad12 { padding-left: 12%; padding-right: 12%; } .innovationsNew .pad16 { padding-left: 16%; padding-right: 16%; } .innovationsNew .pad20 { padding-left: 20%; padding-right: 20%; } .innovationsNew .itv { max-width: 104rem; margin-left: auto; margin-right: auto; margin-bottom: 5rem; } @media (min-width: 769px) { .innovationsNew .itv { display: flex; } } .innovationsNew .imageareaitv { display: block; } @media (min-width: 769px) { .innovationsNew .imageareaitv { float: left; } } .innovationsNew .imageareaitv img { width: 100%; } .padLeftitv { padding-left: 4rem; } .padRightitv { padding-right: 4rem; } @media (min-width: 769px) { .innovationsNew .textareaitv { float: left; } } @media (min-width: 769px) { .innovationsNew .width35 { width: 35%; } } @media (min-width: 769px) { .innovationsNew .width40 { width: 40%; } } @media (min-width: 769px) { .innovationsNew .width45 { width: 45%; } } @media (min-width: 769px) { .innovationsNew .width50 { width: 50%; } } @media (min-width: 769px) { .innovationsNew .width55 { width: 55%; } } @media (min-width: 769px) { .innovationsNew .width60 { width: 60%; } } @media (min-width: 769px) { .innovationsNew .width65 { width: 65%; } } @media (min-width: 769px) { .innovationsNew .width70 { width: 70%; } } @media (min-width: 769px) { .innovationsNew .width75 { width: 75%; } } .innovationsNew h2 { font-family: "Roboto"; font-weight: 400; font-size: 2.4rem; line-height: 140%; color: #ED1C24; margin-bottom: 1rem; } .innovationsNew p { font-family: "Roboto"; font-weight: 300; font-size: 1.8rem; line-height: 140%; color: #fff; margin-bottom: 1.6rem; } .innovationsNew strong { font-weight: 500; } .innovationsNew ul li { font-family: "Roboto"; font-weight: 300; font-size: 1.8rem; line-height: 130%; color: #fff; margin-bottom: 0.6rem; position: relative; padding-left: 1.8rem; } .innovationsNew ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-family: "Roboto"; font-weight: 400; } .innovationsNew .big { font-family: "Roboto"; font-weight: 400; font-size: 2.4rem; line-height: 140%; } .innovationsNew .red { color: #ED1C24 !important; } @media (min-width: 1044px) { .innovationsNew a, .innovationsNew a:link { color: #fff; } } @media (min-width: 1044px) { .innovationsNew a:hover { color: #ED1C24; } } .innovationsLand { margin-left: auto; margin-right: auto; overflow: hidden; } @media (min-width: 1044px) { .innovationsLand { max-width: 104rem; } } .innovationsLand .imageBackgroundtoi { background-repeat: no-repeat; width: 100%; height: 35rem; position: relative; background-position: left center; } @media (min-width: 930px) { .innovationsLand .imageBackgroundtoi { background-size: contain; } } .innovationsLand .texttoi { width: 50%; padding-left: 0; } .innovationsLand h1, .innovationsLand h2.hd1 { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.8rem; line-height: 3.2rem; color: #ED1C24; margin-bottom: 1rem; } .innovationsLand h2 { font-family: "Roboto"; font-weight: 400; font-size: 2.4rem; line-height: 140%; color: #ED1C24; margin-bottom: 1rem; } .innovationsLand p { font-family: "Roboto"; font-weight: 300; font-size: 1.6rem; line-height: 140%; color: #fff; margin-bottom: 1.6rem; } .innovationsLand strong { font-weight: 500; } .innovationsLand ul li { font-family: "Roboto"; font-weight: 300; font-size: 1.6rem; line-height: 130%; color: #fff; margin-bottom: 0.6rem; position: relative; padding-left: 1.8rem; } .innovationsLand ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-family: "Roboto"; font-weight: 400; } .innovationsLand .big { font-family: "Roboto"; font-weight: 400; font-size: 2.4rem; line-height: 140%; } .innovationsLand .red { color: #ED1C24 !important; } .innovationsLand a, .innovationsLand a:link { color: #fff; } .innovationsLand a:hover { color: #ED1C24; } #image1218 { max-width: 121.8rem; margin-left: auto; margin-right: auto; } #image1218 img { width: 100%; } #image1218 .pageHeading { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 4.8rem; line-height: 5.8rem; color: #ED1C24; margin-bottom: 1.2rem; padding-top: 3rem; padding-left: 8.9rem; } #image1218 .pageHeading span { color: white; } #testKitchen .textArea { margin-left: auto; margin-right: auto; padding-top: 3rem; padding-bottom: 3rem; } @media (min-width: 1044px) { #testKitchen .textArea { max-width: 104rem; } } #testKitchen .textArea p:nth-of-type(1) { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.2rem; line-height: 2.6rem; color: #fff; margin-bottom: 1.2rem; } #testKitchen .textArea .red { color: #ED1C24 !important; } #testKitchen .textArea > p { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 1.8rem; line-height: 2.2rem; color: #fff; margin-bottom: 1.2rem; } #testKitchen .textArea .redLink { color: #ED1C24 !important; text-decoration: underline; } #testKitchen .textArea .redLink:hover { color: white !important; } #testKitchen .textArea .whiteLink { color: white !important; } #testKitchen .textArea .whiteLink:hover { color: white !important; text-decoration: underline; } #testKitchen .textArea .serviceLinks { padding-left: 4rem; font-size: 2.4rem; line-height: 120%; padding-top: 1rem; padding-bottom: 1rem; } #testKitchen { max-width: 121.8rem; margin-left: auto; margin-right: auto; } #testKitchen .testKitchen-panel { width: 100%; background-repeat: no-repeat; } @media (min-width: 769px) { #testKitchen .testKitchen-panel { height: 44.2rem; } } #testKitchen .testKitchen-content { margin-left: auto; margin-right: auto; } @media (min-width: 1044px) { #testKitchen .testKitchen-content { max-width: 104rem; } } @media (min-width: 769px) { #testKitchen .testKitchen-content { height: 44.2rem; } } #testKitchen .testKitchen-items { padding-top: 3rem; } @media (min-width: 930px) { #testKitchen .testKitchen-items { max-width: 45.7rem; } } @media (min-width: 769px) { #testKitchen .testKitchen-items { height: 44.2rem; } } #testKitchen .imgtop { margin-bottom: 2rem; } #testKitchen .imgbot { margin-top: 2rem; } #testKitchen img { max-width: 38rem; } #testKitchen .pushdown1 { padding-top: 3rem; } #testKitchen .pushdown2 { padding-top: 4rem; } #testKitchen .pushdown3 { padding-top: 5rem; } #testKitchen .pushdown4 { padding-top: 6rem; } #testKitchen .pushdown5 { padding-top: 7rem; } #testKitchen h1, #testKitchen h2.hd1 { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 4.8rem; line-height: 5.8rem; color: #ED1C24; margin-bottom: 1.2rem; } #testKitchen h2 { font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #testKitchen h2 span { font-weight: 100; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #testKitchen p { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 1.8rem; line-height: 2.2rem; color: #fff; margin-bottom: 0.8rem; } #testKitchen p:first-of-type { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.2rem; line-height: 2.6rem; color: #fff; margin-bottom: 0.8rem; } #testKitchen .red { color: #ED1C24 !important; } #testKitchen .black { color: black !important; } #testKitchen strong { font-weight: 500; } #testKitchen ul li { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 1.4rem; line-height: 2rem; color: #fff; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } #testKitchen ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } /* case landing - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #caseLanding { max-width: 104rem; margin-left: auto; margin-right: auto; overflow: hidden; } #caseLanding .textAreaLanding { padding-top: 4rem; padding-bottom: 4rem; max-width: 52%; } @media (min-width: 769px) { #caseLanding .textAreaLanding { min-height: 68.7rem; } } #caseLanding .pushdown1 { padding-top: 3rem; } #caseLanding .pushdown2 { padding-top: 4rem; } #caseLanding .pushdown3 { padding-top: 5rem; } #caseLanding .pushdown4 { padding-top: 6rem; } #caseLanding .pushdown5 { padding-top: 7rem; } .caseLandingImage { background-position: right bottom; background-repeat: no-repeat; } @media (min-width: 1044px) { .caseLandingImage { max-width: 121.8rem; margin-right: auto; margin-left: auto; } } #caseLanding h1, #caseLanding h2.hd1 { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.8rem; line-height: 3.2rem; color: #ED1C24; margin-bottom: 1rem; } #caseLanding h2 { font-weight: 400; font-size: 2.4rem; line-height: 120%; color: #fff; margin-bottom: 2rem; } #caseLanding span { font-weight: 100; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 2rem; } #caseLanding p { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #caseLanding strong { font-weight: 500; } #caseLanding ul li { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } #caseLanding ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } #caseLanding blockquote { display: block; background-color: rgba(255,255,255,0.1); padding: 2rem; margin-bottom: 1rem; margin-top: 1rem; } #caseLanding p:first-of-type, #news-detail blockquote p, #news-detail blockquote p:first-of-type { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; } #caseLanding .red { color: #ED1C24; } #caseLanding .big { font-weight: 300; font-size: 2rem; line-height: 2.5rem; color: #fff; margin-bottom: 1rem; } #caseLanding a, #caseLanding a:link { color: #ED1C24; } #caseLanding a:hover { color: #ED1C24; text-decoration: underline; } .caseLandLink { display: block; } .caseLandLink img { width: 100%; } /* case studies - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .marTop { margin-top: 0; } .caseTabArea { max-width: 121.8rem; margin-left: auto; margin-right: auto; text-align: left; position: relative; border-bottom: 3px solid #ED1C24; } .caseTabs { display: inline-block; padding-left: 2.5rem; padding-right: 2.5rem; padding-top: .5rem; padding-bottom: .4rem; color: #fff; font-size: 1.8rem; line-height: 2.2rem; font-weight: 400; -webkit-border-top-left-radius: 12px; -webkit-border-top-right-radius: 12px; -moz-border-radius-topleft: 12px; -moz-border-radius-topright: 12px; border-top-left-radius: 12px; border-top-right-radius: 12px; background-color: #ED1C24; position: absolute; top: -3.1rem; left: 8.9rem; } #caseBrief { max-width: 121.8rem; margin-left: auto; margin-right: auto; } #caseBrief .caseBriefPanel { width: 100%; background-repeat: no-repeat; background-image: url(/gfx/caseBriefBackground.jpg); background-position: center center; } #caseBrief .caseBriefContent { margin-left: auto; margin-right: auto; } @media (min-width: 1044px) { #caseBrief .caseBriefContent { max-width: 104rem; } } #caseBrief .caseBriefItem { padding-top: 3rem; padding-bottom: 3rem; padding-right: 4rem; } @media (min-width: 1044px) { #caseBrief .caseBriefItem { max-width: 54rem; } } @media (min-width: 930px) { #caseBrief .caseBriefItem { float: left; } } #caseBrief .caseBriefImage { padding-top: 2rem; padding-bottom: 2rem; } @media (min-width: 1044px) { #caseBrief .caseBriefImage { max-width: 50rem; } } @media (min-width: 930px) { #caseBrief .caseBriefImage { float: right; } } #caseBrief .caseBriefImage > img { width: 100%; } #caseBrief .imgtop { margin-bottom: 2rem; } #caseBrief .imgbot { margin-top: 2rem; } #caseBrief .pushdown1 { padding-top: 3rem; } #caseBrief .pushdown2 { padding-top: 4rem; } #caseBrief .pushdown3 { padding-top: 5rem; } #caseBrief .pushdown4 { padding-top: 6rem; } #caseBrief .pushdown5 { padding-top: 7rem; } #caseBrief h1, #caseBrief h2.hd1 { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 4.8rem; line-height: 5.8rem; color: #ED1C24; margin-bottom: 1.2rem; } #caseBrief h2 { font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #caseBrief h2 span { font-weight: 100; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #caseBrief p { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 1.8rem; line-height: 2.2rem; color: #fff; margin-bottom: 0.8rem; } #caseBrief p:first-of-type { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.2rem; line-height: 2.6rem; color: #fff; margin-bottom: 0.8rem; } #caseBrief .red { color: #ED1C24 !important; } #caseBrief .black { color: black !important; } #caseBrief strong { font-weight: 500; } #caseBrief ul li { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 1.4rem; line-height: 2rem; color: #fff; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } /* case solution - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #caseSol { margin-left: auto; margin-right: auto; } @media (min-width: 930px) { #caseSol { max-width: 121.8rem; } } #caseSol .caseSolItem { display: block; background-color: rgb(133,135,142); padding-right: 5.8rem; padding-top: 3.8rem; float: left; padding-left: 2.4rem; padding-bottom: 6rem; border-bottom: 3px solid #ED1C24; } @media (min-width: 930px) { #caseSol .caseSolItem { background-image: url(/gfx/lightArrow.png); background-repeat: repeat-y; background-position: right top; } } #caseSol .type4 { width: 25%; } @media (min-width: 769px) { #caseSol .type4 .caseImg { width: 18.6rem; } } #caseSol .type4:nth-of-type(4n+1) { background-image: none !important; } #caseSol .type4:nth-of-type(2), #caseSol .type4:nth-of-type(6) { padding-left: 5.4rem !important; } #caseSol .type4:nth-of-type(2n+1) { background-color: rgb(97,98,104); } @media (min-width: 930px) { #caseSol .type4:nth-of-type(2n+1) { background-image: url(/gfx/darkArrow.png); } } #caseSol .type3 { width: 33.33%; } #caseSol .type3 .caseImg { width: 24.6rem; } #caseSol .type3:nth-of-type(3n+1) { background-image: none !important; } #caseSol .type3:nth-of-type(2), #caseSol .type3:nth-of-type(5) { padding-left: 5.4rem !important; } #caseSol .type3:nth-of-type(2n+1) { background-color: rgb(97,98,104); } @media (min-width: 930px) { #caseSol .type3:nth-of-type(2n+1) { background-image: url(/gfx/darkArrow.png); } } #caseSol .caseNum { width: 4rem; height: 4rem; border-radius: 50%; background-color: #ED1C24; margin-left: auto; margin-right: auto; margin-bottom: 2rem; text-align: center; font-size: 3rem; line-height: 4rem; color: white; font-weight: 400; } #caseSol .caseImg { height: auto; margin-bottom: 2.4rem; } #caseSol .caseImg img { width: 100%; } #caseSol .caseText { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 1.8rem; line-height: 2.2rem; color: #fff; margin-bottom: 0.8rem; } /* case image swap/overlay - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .cd-image-container { position: relative; width: 100%; max-width: 121.8rem; margin: 0 auto; } .cd-image-container img { display: block; } .cd-image-label { position: absolute; bottom: 0; right: 0; color: #ffffff; padding: 1em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; opacity: 0; -webkit-transform: translateY(20px); -moz-transform: translateY(20px); -ms-transform: translateY(20px); -o-transform: translateY(20px); transform: translateY(20px); -webkit-transition: -webkit-transform 0.3s 0.7s, opacity 0.3s 0.7s; -moz-transition: -moz-transform 0.3s 0.7s, opacity 0.3s 0.7s; transition: transform 0.3s 0.7s, opacity 0.3s 0.7s; } .cd-image-label.is-hidden { visibility: hidden; } .is-visible .cd-image-label { opacity: 1; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } .cd-resize-img { position: absolute; top: 0; left: 0; width: 0; height: 100%; overflow: hidden; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .cd-resize-img img { position: absolute; left: 0; top: 0; display: block; height: 100%; width: auto; max-width: none; } .cd-resize-img .cd-image-label { right: auto; left: 0; } .is-visible .cd-resize-img { width: 50%; -webkit-animation: cd-bounce-in 0.7s; -moz-animation: cd-bounce-in 0.7s; animation: cd-bounce-in 0.7s; } @-webkit-keyframes cd-bounce-in { 0% { width: 0; } 60% { width: 55%; } 100% { width: 50%; } } @-moz-keyframes cd-bounce-in { 0% { width: 0; } 60% { width: 55%; } 100% { width: 50%; } } @keyframes cd-bounce-in { 0% { width: 0; } 60% { width: 55%; } 100% { width: 50%; } } .cd-handle { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; position: absolute; height: 6rem; width: 6rem; left: 50%; top: 50%; margin-left: -3rem; margin-top: -3rem; border-radius: 50%; border: 4px solid white; background: rgba(0,0,0,0.3) url("/gfx/cd-arrows.svg") no-repeat center center; cursor: move; opacity: 0; -webkit-transform: translate3d(0, 0, 0) scale(0); -moz-transform: translate3d(0, 0, 0) scale(0); -ms-transform: translate3d(0, 0, 0) scale(0); -o-transform: translate3d(0, 0, 0) scale(0); transform: translate3d(0, 0, 0) scale(0); } .cd-handle.draggable { background-color: #ED1C24; } .is-visible .cd-handle { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale(1); -moz-transform: translate3d(0, 0, 0) scale(1); -ms-transform: translate3d(0, 0, 0) scale(1); -o-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); -webkit-transition: -webkit-transform 0.3s 0.7s, opacity 0s 0.7s; -moz-transition: -moz-transform 0.3s 0.7s, opacity 0s 0.7s; transition: transform 0.3s 0.7s, opacity 0s 0.7s; } /* gender pay gap */ #primaryGender { margin-left: auto; margin-right: auto; overflow: hidden; } @media (min-width: 1044px) { #primaryGender { max-width: 104rem; } } #primaryGender h1, #primaryGender h2.hd1 { font-family: "Roboto Condensed", sans-serif; font-weight: 300; font-size: 2.8rem; line-height: 3.2rem; color: #ED1C24; margin-bottom: 1rem; } #primaryGender h2 { font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #primaryGender h2 span { font-weight: 100; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #primaryGender p { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: 1rem; } #primaryGender strong { font-weight: 500; } #primaryGender em { font-style: italic; } #primaryGender ul li { font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #fff; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } #primaryGender ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } #primaryGender .red { color: #ED1C24; } #primaryGender .big { font-weight: 300; font-size: 2rem; line-height: 2.5rem; color: #fff; margin-bottom: 1rem; } #primaryGender a, #primaryGender a:link { color: #ED1C24; } #primaryGender a:hover { color: #ED1C24; text-decoration: underline; } #primaryGender table { padding: 1rem; text-align: left; margin-top: 2rem; margin-bottom: 2rem; } #primaryGender table td { border: 1px solid #929292; padding-top: .6rem; padding-bottom: .6rem; padding-left: 2rem !important; padding-right: 2rem; } #primaryGender table td { font-size: 1.6rem; line-height: 2.2rem; color: #fff; } #primaryGender table tr:first-of-type td { background-color: #ED1C24; color: #fff; font-weight: 500; border: 1px solid white; } #primaryGender table tr td:first-of-type { text-align: left; border-left: none; font-weight: 500; } #primaryGender table tr td:last-of-type { border-right: none; } #primaryGender table tr { margin: 1rem !important; } #primaryGender hr { border: 0; padding: 0; margin: 0; } #primaryGender hr { width: 100%; height: 0.2rem; background-color: #ED1C24; margin-top: 2rem; margin-bottom: 2rem; } #primaryGender .chartArea1 { margin-top: 2rem; margin-bottom: 2rem; } #primaryGender .chartArea2 { margin-top: 2rem; margin-bottom: 2rem; } #primaryGender .chart50 { width: calc(50% - 1.5rem); padding: 3rem; } @media (min-width: 769px) { #primaryGender .chart50:nth-of-type(odd) { float: left; } } @media (min-width: 769px) { #primaryGender .chart50:nth-of-type(even) { float: right; } } #primaryGender .chart50 img { width: 100%; } #primaryGender .chartArea2Inner { width: 100%; padding: 1.5rem; } #primaryGender .chart25 { width: 25%; float: left; padding: 1.5rem; } #primaryGender .chart25 img { width: 100%; } #primaryGender .tableShow { display: block; } #primaryGender .tableHide { display: none; } /* footer - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #footer { max-width: 104rem; margin-left: auto; margin-right: auto; padding-top: 4rem; padding-bottom: 4rem; } #footer .cols { width: 20%; } @media (min-width: 930px) { #footer .cols { float: left; } } #footer .col-4 { padding-left: 0; } #footer h1, #footer h2.hd1 { font-weight: 500; font-size: 1.6rem; line-height: 1.8rem; color: #fff; margin-bottom: 1.6rem; } #footer ul li { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.4rem; line-height: 1.6rem; color: #fff; margin-bottom: .6rem; padding-left: 0; } #footer ul li:before { content: "" !important; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } #footer a, #footer a:link { font-family: "Roboto", sans-serif; color: #fff; } #footer a:hover, #footer a.selected { color: #ED1C24; } #footer p { font-weight: 300; font-size: 1.4rem; line-height: 2rem; color: #fff; margin-bottom: 1.6rem; } #footer ul { margin-bottom: 2rem; } #footer .copyright { font-weight: 300; font-size: 1.3rem; line-height: 2rem; color: #fff; margin-bottom: 1.6rem; font-style: italic; } @media (min-width: 930px) { #footer .campdenBri img { width: 70%; } } #footer .copyright a { color: #ccc; } #footer .copyright a:hover { color: #ED1C24; } /* used for search popups - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .lity { z-index: 999990; position: fixed; top: 0; right: 0; bottom: 0; left: 0; white-space: nowrap; background-color: rgba(0, 0, 0, 0.4); outline: none !important; opacity: 0.8; -webkit-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .lity.lity-opened { opacity: 1; } .lity.lity-closed { opacity: 0; } .lity * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .lity-wrap { z-index: 999990; position: fixed; top: 0; right: 0; bottom: 0; left: 0; text-align: center; outline: none !important; } .lity-wrap:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; margin-right: -0.25em; } .lity-loader { z-index: 999991; color: #fff; position: absolute; top: 50%; margin-top: -0.8rem; width: 100%; text-align: center; font-size: 1.4rem; font-family: Arial, Helvetica, sans-serif; opacity: 0; -webkit-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .lity-loading .lity-loader { opacity: 1; } .lity-container { z-index: 999992; position: relative; text-align: left; vertical-align: middle; display: inline-block; white-space: normal; outline: none !important; background-color: black; overflow-y: auto; overflow-x: hidden; } @media (min-width: 930px) { .lity-container { max-height: 90%; } } .lity-content { z-index: 999993; width: 100%; -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 0.3s ease; -o-transition: -o-transform 0.3s ease; transition: transform 0.3s ease; } .lity-loading .lity-content, .lity-closed .lity-content { -webkit-transform: scale(0.8); -ms-transform: scale(0.8); -o-transform: scale(0.8); transform: scale(0.8); } .lity-content:after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; display: block; right: 0; width: auto; height: auto; z-index: -1; -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); } .lity-close { z-index: 999994; position: absolute; right: 4%; top: 1rem; -webkit-appearance: none; cursor: pointer; text-decoration: none; text-align: center; padding: 0; border: 0; background: none; -webkit-box-shadow: none; box-shadow: none; background-color: #ED1C24; border-radius: 2rem; width: 4rem; height: 4rem; font-size: 2.4rem; line-height: 3.6rem; font-weight: 300; font-family: "themify"; color: #FFF; padding-bottom: 0.4rem; } .lity-close::-moz-focus-inner { border: 0; padding: 0; } .lity-close:hover, .lity-close:focus, .lity-close:active, .lity-close:visited { text-decoration: none; text-align: center; padding: 0; background: transparent; cursor: pointer; font-family: "themify"; color: #ED1C24; border: 0; background: none; -webkit-box-shadow: none; box-shadow: none; font-size: 2.4rem; line-height: 3.6rem; font-weight: 300; padding-bottom: 0.4rem; border-radius: 2rem; background-color: #FFF; } /* Image */ .lity-image img { max-width: 100%; display: block; line-height: 0; border: 0; } /* iFrame */ .lity-iframe .lity-container { width: 100%; max-width: 69.4rem; } .lity-iframe-container { width: 100%; height: 0; padding-top: 56.25%; overflow: auto; pointer-events: auto; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-overflow-scrolling: touch; } .lity-iframe-container iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } .lity-hide { display: none; } /* overrides - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .lumin { font-family: "luminesign", sans-serif !important; font-weight: 300; } .sansBackground { background: none; } .redTabRule { border-bottom: 3px solid #ED1C24; position: absolute; top: 5.9rem; left: 0; right: 0; z-index: 100; } .footerRule3 { border-top: 3px solid #ED1C24; max-width: 137.8rem; margin-left: auto; margin-right: auto; } .footerRule2 { border-top: 3px solid #ED1C24; max-width: 121.8rem; margin-left: auto; margin-right: auto; } .footerRule1 { border-top: 3px solid #ED1C24; margin-left: auto; margin-right: auto; } @media (min-width: 100px) and (max-width: 929px), (min-width: 1044px) { .footerRule1 { max-width: 104rem; } } /* New Rules March 2021 */ #headerps { max-width: 104rem; margin-left: auto; margin-right: auto; height: 17rem; transition: all 0.4s ease; } #headerps .col-header1ps { width: 40%; float: left; } #headerps .col-header1ps .jbt { height: 17rem; width: auto; transition: all 0.4s ease; } #headerps .col-header2ps { width: 60%; float: right; } #headerps .ps-loginAreaps { width: 100%; display: block; } #headerps .logoAreaps { width: 100%; padding-top: 1.8rem; padding-bottom: 1.8rem; height: 13.4rem; text-align: right; transition: all 0.4s ease; } #headerps .logops { height: 100%; width: auto; float: right; transition: all 0.4s ease; } @media (min-width: 930px) { .headerpsShrink { height: 12.5rem !important; } } @media (min-width: 930px) { .jbtShrink { height: 12.5rem !important; } } @media (min-width: 930px) { .logoAreapsShrink { height: 8.9rem !important; padding-top: 1.2rem !important; padding-bottom: 1.2rem !important; } } .offset-subps { height: calc(17rem + 4.2rem + 4rem); transition: all 0.4s ease; } @media (min-width: 930px) { .offset-subps-shrink { height: calc(12.5rem + 4.2rem + 2.3rem) !important; } } @media (min-width: 930px) { .offset-nosubps-shrink { height: calc(12.5rem + 4.2rem) !important; } } @media (min-width: 930px) { .offset-subPlusps-shrink { height: calc(12.5rem + 4.2rem + 3.1rem) !important; } } .ukps { font-family: "Roboto Condensed", sans-serif; font-weight: 400 !important; font-size: 1.6rem !important; line-height: 2.2rem !important; color: #fff; text-transform: uppercase; display: block; } .ukps span { font-family: "Roboto Condensed", sans-serif; color: #A7A9AC; } .rangeJBT { display: inline-block; padding-left: 1.5rem; padding-right: 1.5rem; padding-top: .5rem; padding-bottom: .4rem; color: #fff; font-size: 1.8rem; line-height: 2.2rem; font-weight: 300; -webkit-border-top-left-radius: 12px; -webkit-border-top-right-radius: 12px; -moz-border-radius-topleft: 12px; -moz-border-radius-topright: 12px; border-top-left-radius: 12px; border-top-right-radius: 12px; background-color: #0076CC; text-transform: uppercase; margin-top: 1rem; } .careers { max-width: 104rem; margin-left: auto; margin-right: auto; } .careersItem { width: 100%; } .careersImage { width: 68% !important; background-position: center center; background-size: cover; background-repeat: no-repeat; position: relative; } @media (min-width: 769px) { .careersImage { float: left; } } .careersText { width: 32%; background-color: black; } @media (min-width: 769px) { .careersText { float: right; } } .careersh4 { font-family: "Roboto"; font-weight: 200; font-size: 3.5rem; line-height: 140%; color: white; margin-bottom: 2rem; } .careersP { font-family: "Roboto"; font-weight: 300; font-size: 2.2rem; line-height: 120%; color: white; margin-bottom: 2rem; } .careersText strong { font-weight: 500; } .careersA { color: #ED1C24; text-decoration: none; } .careersA:hover { color: white; text-decoration: none; } .careersImageGrad { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .careersImageGrad { background: linear-gradient(to right, rgba(0,0,0,0) 40%,rgba(0,0,0,1) 90%,rgba(0,0,0,1) 100%); } @media (min-width: 769px) { .careersHeight { height: 43.2rem; } } .cLandingImage { max-width: 104rem; margin-left: auto; margin-right: auto; } .cLandingImage { background-position: center center; background-size: cover; background-repeat: no-repeat; position: relative; } @media (min-width: 769px) { .cLandingImage { padding-bottom: 30%; } } .cLandingHeading { padding-left: 6rem; padding-right: 10rem; padding-top: 2.4rem; padding-bottom: 2.4rem; } .cLandingHeading { font-family: "Roboto"; font-weight: 400; font-size: 8rem; line-height: 100%; color: white; } .cLandingHeading { position: absolute; bottom: 5rem; left: 0; } .careersRule { border-bottom: 3px solid #ED1C24; } .careers .careersRule:last-child { border-bottom: none; } /* New Rules 16 June 2021 */ #headerps .ps-loginps { display: block; padding-left: 1.6rem; padding-right: 1.6rem; background-color: rgb(77,78,83); border-bottom-left-radius: 1.2rem; border-bottom-right-radius: 1.2rem; color: white; font-family: "Roboto Condensed", sans-serif; text-align: center; font-weight: 400; letter-spacing: .05rem; font-size: 1.5rem; line-height: 3.6rem; float: right; margin-left: 0.6rem; } #headerps .ps-loginps:hover { background-color: #ED1C24; } #headerps .psJBT { display: block; padding-left: 1.6rem; padding-right: 1.6rem; background-color: rgb(0,118,204); border-bottom-left-radius: 1.2rem; border-bottom-right-radius: 1.2rem; color: white; font-family: "Roboto Condensed", sans-serif; text-align: center; font-weight: 400; letter-spacing: .05rem; font-size: 1.5rem; line-height: 3.6rem; float: right; } #headerps .psJBT:hover { background-color: rgba(0,118,204,0.8); } #headerps .psACS { display: block; padding-left: 1.6rem; padding-right: 1.6rem; background-color: rgb(129,185,53); border-bottom-left-radius: 1.2rem; border-bottom-right-radius: 1.2rem; color: white; font-family: "Roboto Condensed", sans-serif; text-align: center; font-weight: 400; letter-spacing: .05rem; font-size: 1.5rem; line-height: 3.6rem; float: right; margin-left: 0.6rem; } #headerps .psACS:hover { background-color: rgba(129,185,53,0.8); } .iForm { width: 100%; height: 760px; } /* new table for cookie policy */ #primary table { width: 100%; padding: 1rem; text-align: left; } #primary table td, #primary table th { border: 1px solid #929292; padding-top: .6rem; padding-bottom: .6rem; padding-left: 2rem !important; padding-right: 2rem; } #primary table td { font-size: 1.3rem; line-height: 1.6rem; color: white; } #primary table tr th { font-size: 1.3rem; line-height: 1.6rem; color: white; background-color: #eeeeee; color: black; border: 1px solid #929292; } #primary table tr th { text-align: left; font-weight: 500; } @media (min-width: 769px) { #primary table tr { margin: 1rem !important; } } .logoStrip { width: 100%; margin-top: 2rem; margin-bottom: 2rem; } .logoStrip .footerLogo { height: 7rem; float: left; margin-right: 2rem; } .logoStrip .footerLogo img { height: 100%; width: auto; } .logoStrip .footerLogo:last-of-type { padding-top: 1.5rem; padding-bottom: 1.5rem; } .accreditations { display: inline-block; } .accTxt { font-size: 1.3rem; line-height: 100%; weight: 300; color: white; padding-top: 1rem; padding-bottom: 2rem; text-align: center; padding-right: 21rem; } /* accessibility additions */ #checkboxes label, #checkboxes input[type=radio], #checkboxes input[type=checkbox] { cursor: pointer; } .navigation-panel-scrolltop button.arrow { display: block; width: 100%; height: 100%; } .slider-toggle { position: absolute; z-index: 60; right: 2rem; bottom: 1.4rem; width: 3.2rem; height: 3.2rem; border-radius: 50%; background-color: rgba(0,0,0,0.6) !important; color: #fff !important; font-size: 1.2rem !important; line-height: 3.2rem; text-align: center !important; } .slider-toggle:hover { background-color: #ED1C24 !important; } /* only becomes a scroll box when the table is too wide, so normal tables keep their spacing */ .table-scroll { max-width: 100%; } .table-scroll.is-scrollable { overflow-x: auto; } /* tabletLarge.css */ @media (min-width: 930px) and (max-width: 1043px) { /* tabletLarge.css - overrides of default.css for this size band only (generated from the original full file) */ /* band styles */ html, body { font-size: 9px !important; } .noSquish { display: none !important; } .squish:before { padding-left: 0.8rem !important; padding-right: 0.8rem !important; } #sub-navigation ul { width: calc(100% - 5.3rem); } #sub-navigation .navigation-panel-scrolltop { margin-right: 1.5rem; } #sub-navigationPlus ul li { letter-spacing: .02rem; } #sub-navigationPlus ul li { padding-left: 1.15rem; margin-left: 1.15rem; } #header { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #navigation, #sub-navigation, #sub-navigationPlus { width: 100%; } #content { width: 100%; } #icons { max-width: 100%; } #icons-pop { width: 100%; } #stripe-area { width: 100%; } #primary { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #primaryMRD { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #news { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #news-detail { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #pagination { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #news-area { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #furtherInfo { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #rec-machine .pop-link a { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } .stripe-block { width: 100%; text-align: center; } .range { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } .stripe-box-machine { display: inline-block; } #trays-materials { width: 100%; } #trays-materials .stripe-area-tm { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #trays-materials ul li a { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } #processes .stripe-area-proc { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #machine-area .machine-range { -webkit-border-bottom-left-radius: 1.2rem; -webkit-border-bottom-right-radius: 1.2rem; -moz-border-radius-bottomleft: 1.2rem; -moz-border-radius-bottomright: 1.2rem; border-bottom-left-radius: 1.2rem; border-bottom-right-radius: 1.2rem; } #seStripe01 { max-width: 94%; } #seStripe02, #seStripe03, #seStripe04 { max-width: 94%; } .machine-range-icons { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } img.curve { right: -1.2rem; } .bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item { height: 1.2rem; } .bx-wrapper .bx-pager.bx-default-pager a, .bx-wrapper .bx-pager.bx-default-pager a:link { width: 1.2rem; height: 1.2rem; } #tabs { width: 100%; } #machine-info { width: 100%; } .c-tabs__link { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } .inputArea p { color: #fff !important; } ::-webkit-input-placeholder { font-size: 1.6rem; } :-moz-placeholder { font-size: 1.6rem; } ::-moz-placeholder { font-size: 1.6rem; } :-ms-input-placeholder { font-size: 1.6rem; } #contact { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #innovations .innovations-content { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } .innovationsNew .flexCentreCentre { display: flex; justify-content: center; align-items: center; } .innovationsNew .flexLeftCentre { display: flex; justify-content: left; align-items: center; } .innovationsNew .textto { padding-left: 2rem; padding-right: 2rem; } .innovationsNew .itv { padding-left: 2rem; padding-right: 2rem; } .innovationsNew .imageareaitv { display: block; } .innovationsLand { width: 100%; } .innovationsLand .imageBackgroundtoi { background-position: right center; } .innovationsLand .texttoi { padding-left: 4rem; } .innovationsLand .flexCentreCentre { display: flex; justify-content: center; align-items: center; } .innovationsLand .flexLeftCentre { display: flex; justify-content: left; align-items: center; } #testKitchen .textArea { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #testKitchen .testKitchen-content { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #caseLanding .textAreaLanding { padding-left: 2rem; } .caseLandingImage { background-size: 130%; } .caseTabs { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; top: -3rem; left: 1.5rem; } #caseBrief { max-width: 100%; } #caseBrief .caseBriefContent { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #caseBrief .caseBriefItem { width: 50%; } #caseBrief .caseBriefImage { width: 50%; } #caseSol .type4 .caseImg { width: 15.6rem; } .cd-image-container img { width: 100%; } .cd-resize-img img { width: auto; } #primaryGender { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #footer { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #footer .col-4 { padding-left: 4rem; } #footer .campdenBri img { width: 90%; } .lity { top: 0; left: 0; } .lity-wrap { top: 0; left: 0; text-align: center; } .lity-loader { top: 50%; width: 100%; text-align: center; } .lity-container { text-align: left; display: inline-block; } .lity-content { width: 100%; } .lity-close { top: 1rem; cursor: pointer; text-align: center; width: 4rem; cursor: pointer; } .lity-close:hover, .lity-close:focus, .lity-close:active, .lity-close:visited { padding: 0; padding: 0; } .lity-iframe-container { width: 100%; } .lity-hide { display: none; } .redTabRule { top: 5.7rem; left: 0; } .footerRule1 { width: 100%; } .ukps { display: block; } .rangeJBT { display: inline-block; } .careersItem .flexLeftCentre { display: flex; justify-content: left; align-items: center; } .careersItem { width: 100%; } .careersImage { width: 68% !important; } .careersText { width: 32%; } .careersImageGrad { top: 0; left: 0; } .cLandingImage { padding-bottom: 40%; } .cLandingHeading { left: 0; } .iForm { width: 100%; } .logoStrip { width: 100%; } .accreditations { display: inline-block; } .accTxt { text-align: center; } } /* tabletSmall.css */ @media (min-width: 769px) and (max-width: 929px) { /* tabletSmall.css - overrides of default.css for this size band only (generated from the original full file) */ /* band styles */ html, body { font-size: 9px !important; } .noHamburger { display: none; } .hamburger { display: block; } #master { padding-left: 0rem; padding-right: 0rem; } #master-sans { padding-left: 0rem; padding-right: 0rem; } .offset-sub { height: 11rem; } .offset-nosub { height: 11rem; } .offset-subPlus { height: 11.3rem; } #header { padding-left: 1.5rem; padding-right: 1.5rem; position: relative; } #sub-navigation { display: none; } #hamburger ul { margin: 0; padding: 0; list-style: none; overflow: hidden; z-index: 80000; } #hamburger .btn .menu { display: none; position: fixed; top: 12.5rem; right: 0; bottom: 0; width: auto; max-width: 100vw; background-color: #ED1C24; padding: 2rem 2.5rem 3rem 2rem; overflow-x: hidden !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; } #hamburger .btn-link { font-family: "themify"; font-size: 3.2rem; color: #ED1C24; line-height: 3.2rem; padding-left: 14rem; background-color: transparent; padding-right: 1.5rem; padding-top: 0.9rem; text-align: center; display: block; } #hamburger .btn-link:hover { color: white; } #hamburger .main a, #hamburger .main { display: block; color: white; font-size: 2rem; line-height: 3.4rem; text-decoration: none; white-space: nowrap; font-weight: 400; text-align: right; text-transform: uppercase; } #hamburger .main a:hover, #hamburger .main:hover { color: black; } #hamburger .subh a { display: block; color: rgba(255,255,255,0.7); font-size: 1.6rem; line-height: 2.2rem; text-decoration: none; white-space: nowrap; font-weight: 400; text-align: right; text-transform: uppercase; padding-top: 0.4rem; padding-bottom: 0.4rem; } #hamburger .subh a:hover { color: black; } #hamburger .menu { clear: both; } #hamburger .scrollme { padding-left: 3.5rem; } [data-accordion] [data-content] { overflow: hidden; max-height: 0; } [data-accordion] { line-height: 1; } [data-accordion] > [data-control] { cursor: pointer; position: relative; } [data-accordion] > [data-control]:before { content: "\e62a"; position: absolute; left: -3.5rem; top: 0; font-family: "themify"; font-size: 1.6rem; line-height: 3.4rem; color: white; } [data-accordion].open > [data-control]:before { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); color: black; } #header { height: 11rem; border-bottom: 1px solid #ED1C24; } #icons { max-width: 100%; } #stripe-area { max-width: 100%; } #primary { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #primaryMRD { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #news { max-width: 100%; } #news-detail { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #pagination { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #news-area { max-width: 100%; } #furtherInfo { max-width: 100%; } #furtherInfo .text-area { padding-left: 1.5rem; padding-right: 1.5rem; } .machine-item img { height: 18rem; } #machine-info table td { padding-left: 0.6rem !important; padding-right: 0.6rem; } .jcarousel-wrapper { padding-top: 1.4rem; } .jcarousel ul li { margin-left: 1rem; margin-right: 1rem; } .jcarousel ul li img { height: 9rem; } .jcarousel-control-prev { top: 4rem; } .jcarousel-control-next { top: 4rem; } .jcarousel ul li a:hover { background-size: 8rem; } .jcarousel-wrapper-pop { padding-left: 1.5rem; padding-right: 1.5rem; text-align: center; } .jcarousel-pop ul { width: 100%; } .jcarousel-pop ul li { display: inline-block; } #rec-machine .pop-link a { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } #locations-pop { width: 100%; } #locations-slider img { width: 100%; } .stripe-block { text-align: center; } .range { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } .stripe-box { width: calc(33.33% - 3.8%); } .stripe-box-machine { display: inline-block; } #stripe-area .stripe-block:nth-of-type(2) .stripe-box:first-of-type h1, #stripe-area .stripe-block:nth-of-type(2) .stripe-box:first-of-type h2.hd1 { letter-spacing: -0.1rem; } #trays-materials .stripe-area-tm { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; padding-bottom: 1rem; } #trays-materials .imagearea-tm { width: 90%; } #trays-materials .textarea-tm { width: 100%; } #trays-materials ul li { margin-bottom: 0.7rem; } #trays-materials ul li a { -webkit-border-radius: 1.2rem; -webkit-border-radius: 1.2rem; -moz-border-radius: 1.2rem; -moz-border-radius: 1.2rem; border-radius: 1.2rem; border-radius: 1.2rem; } #processes .stripe-proc { padding-left: 1.5rem; padding-right: 1.5rem; } #processes .stripe-area-proc { width: 100%; } #processes .sealarea-proc { padding-top: 0rem; vertical-align: baseline; margin-right: 5%; } #processes .imagearea-proc { width: 65%; margin-bottom: 1rem; } #processes .imagearea-proc img { max-height: 28rem; } #processes .textarea-proc { width: 100%; } .machine-image { background-size: 175%; } .foodcat-image { background-size: 175%; } .text-area-machine { padding-top: 21rem; width: 100%; } .text-area-food { padding-top: 21rem; width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #machine-area .machine-range { -webkit-border-bottom-left-radius: 1.2rem; -webkit-border-bottom-right-radius: 1.2rem; -moz-border-radius-bottomleft: 1.2rem; -moz-border-radius-bottomright: 1.2rem; border-bottom-left-radius: 1.2rem; border-bottom-right-radius: 1.2rem; } #machine-area .machine-box img { height: 17rem; } #seStripe01 { max-width: 94%; } #seStripe01 .col01 { width: 60%; height: calc(48.5rem - 3.2rem); padding-top: 4rem; } #seStripe02, #seStripe03, #seStripe04 { max-width: 94%; } #seStripe02 .col01 .logo img { max-width: 90%; } #seStripe02 .col02 img { height: 29rem; } #seStripe03 .col02 .logo img { max-width: 90%; } #seStripe03 .col01 img { height: 29rem; } .machine-range-icons { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } #machine-icons .xcarousel ul li { margin-left: 1rem; margin-right: 1rem; margin-bottom: 2rem; } #machine-icons .xcarousel ul li img { height: 7.4rem; } #machine-icons .xcarousel-control-prev { top: 4rem; } #machine-icons .xcarousel-control-next { top: 4rem; } #machine-icons .xcarousel ul li a:hover, #machine-icons .xcarousel ul li a.selected { background-size: 6.4rem; } .news-box { width: calc(50% - 3.8%); min-height: 34rem; } .bx-wrapper .bx-loading { position: absolute; } .bx-wrapper .bx-pager { position: absolute; } #slider-contact .bx-pager { top: calc(50% + 2.5rem); } .bx-wrapper .slider-caption { position: absolute; } #slider-contact .map-caption { top: calc(50% - 2rem); } .c-tabs__link { font-size: 1.5rem; line-height: 2rem; padding-left: 0.8rem; padding-right: 0.8rem; -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } .c-tabs__content { padding: 1.5rem; } #tabs .left_col { width: 100%; } #tabs .right_col { width: 100%; } #tabs .left_col2 { width: 35%; } #tabs .right_col2 { width: 65%; } #tabs .left_col3 { width: 100%; } #tabs .right_col3 { width: 100%; } #full-map .left_fullmap { width: 100%; } #full-map .right_fullmap { width: 100%; } #full-map table td { padding-left: 2rem; } #tabs .c-tabs__content2 object { height: 70rem; } #news .news-panel { padding-left: 1.5rem; padding-right: 1.5rem; } #news .list-image { width: 100%; margin-bottom: 1rem; } #news .list-text { width: 100%; } #news .news-image-panel { padding-left: 1.5rem; padding-right: 1.5rem; } #news .detail-image { width: calc(50% - 0.75rem); margin-left: 1.5rem; margin-bottom: 1.5rem; } #news .detail-image:nth-of-type(2n + 1) { margin-left: 0; } #pagination .blocked { padding-left: 1rem; padding-right: 1rem; } #pagination .notblocked { padding-left: 1rem; padding-right: 1rem; margin-left: 0rem; } #pagination a, #pagination a:link, #pagination .unblocked { padding-left: 1rem; padding-right: 1rem; margin-left: 0; } #pagination a:hover { padding-left: 1rem; padding-right: 1rem; } .inputArea .col1 { width: 100%; } .inputArea .col2 { width: 100%; } .inputArea p { color: #fff !important; } .inputArea textarea { height: 18.7rem; } .inputArea .tick { position: absolute; } .inputArea .cross, .inputArea .invalid { position: absolute; } ::-webkit-input-placeholder { font-size: 1.6rem; } :-moz-placeholder { font-size: 1.6rem; } ::-moz-placeholder { font-size: 1.6rem; } :-ms-input-placeholder { font-size: 1.6rem; } #contact { width: 100%; } #contact .address-block { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #findarea .findblock { width: 100%; margin-bottom: 2rem; } #findarea .findblock:last-of-type { padding-bottom: 8rem; } #findarea .tick { top: 2rem; } #findarea .cross { top: 2rem; } #innovations { width: 100%; } #innovations .innovations-content { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #innovations .innovations-items { width: 100%; float: none !important; } .innovationsNew .flexCentreCentre { display: flex; justify-content: center; align-items: center; } .innovationsNew .flexLeftCentre { display: flex; justify-content: left; align-items: center; } .innovationsNew .textto { padding-left: 2rem; padding-right: 2rem; } .innovationsNew .imageBackgroundtoi { position: relative; } .innovationsNew .itv { padding-left: 2rem; padding-right: 2rem; } .innovationsNew .imageareaitv { display: block; } .innovationsLand { width: 100%; } .innovationsLand .imageBackgroundtoi { position: relative; } .innovationsLand .texttoi { width: 60%; padding-left: 4rem; } .innovationsLand .flexCentreCentre { display: flex; justify-content: center; align-items: center; } .innovationsLand .flexLeftCentre { display: flex; justify-content: left; align-items: center; } #image1218 .pageHeading { padding-left: 1.5rem; padding-right: 1.5rem; } #testKitchen .textArea { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #testKitchen .testKitchen-content { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #testKitchen .testKitchen-items { width: 100%; } #caseLanding .textAreaLanding { padding-left: 2rem; } .caseLandingImage { background-size: 130%; } .marTop { margin-top: 5rem; } .caseTabs { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; top: -3rem; left: 0rem; } #caseBrief .caseBriefContent { width: 100%; } #caseBrief .caseBriefItem { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #caseBrief .caseBriefImage { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #caseBrief .pushdown4 { padding-top: 3rem; } #caseSol { width: 100%; } #caseSol .caseSolItem { padding-right: 1.5rem; padding-left: 1.5rem; } #caseSol .type4 { width: 50%; } #caseSol .type4:nth-of-type(2), #caseSol .type4:nth-of-type(6) { padding-left: 1.5rem !important; } #caseSol .type3:nth-of-type(2), #caseSol .type3:nth-of-type(5) { padding-left: 1.5rem !important; } .cd-image-container { display: none; } .is-visible .cd-resize-img { width: 50%; } #primaryGender { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #footer { padding-top: 2rem; padding-left: 1.5rem; padding-right: 1.5rem; } #footer .cols { width: 100%; display: none; } #footer .cols:last-of-type { display: block; } #footer p span { font-family: "Roboto Condensed", sans-serif; color: #A7A9AC; } #footer .flags { width: 100%; margin-left: auto; margin-bottom: 2.4rem; } #footer .flags img { width: 50%; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; } #footer .col-4 { padding-left: 4rem; } #footer a.selected { color: #ED1C24; } #footer .copyright a { color: #ccc; } .lity { top: 0; left: 0; } .lity-wrap { top: 0; left: 0; text-align: center; } .lity-loader { top: 50%; margin-top: -0.8rem; width: 100%; text-align: center; font-size: 1.4rem; } .lity-container { text-align: left; display: inline-block; height: 100%; } .lity-content { width: 100%; } .lity-close { top: 1rem; cursor: pointer; text-align: center; padding: 0; width: 4rem; height: 4rem; font-size: 2.4rem; line-height: 3.6rem; cursor: pointer; } .lity-close:hover, .lity-close:focus, .lity-close:active, .lity-close:visited { padding: 0; padding: 0; cursor: pointer; } .lity-iframe .lity-container { width: 100%; height: 100%; } .lity-iframe-container { width: 100%; height: 0; padding-top: 56.25%; } .lity-hide { display: none; } .redTabRule { top: 5.4rem; left: 0; } .footerRule2 { display: none; } #headerps { height: 12.5rem; border-bottom: 2px solid #6C6B6A; } #headerps .col-header1ps .jbt { height: 12.5rem; } #headerps .logoAreaps { height: 8.9rem; padding-right: 6.8rem; } .offset-subps { height: 11.4rem; } .ukps { font-size: 1.6rem !important; line-height: 2.2rem !important; display: block; } .rangeJBT { display: inline-block; padding-top: .5rem; font-size: 1.8rem; line-height: 2.2rem; margin-top: 1rem; } #hamburger { position: absolute; top: 4.5rem; right: 0; } #hamburger .btn-link { padding-bottom: 3.98rem; } .careersItem .flexLeftCentre { display: flex; justify-content: left; align-items: center; } .careersItem { width: 100%; } .careersImage { width: 62% !important; } .careersText { width: 38%; padding-right: 2rem; } .careersh4 { font-size: 3.5rem; line-height: 140%; } .careersP { font-size: 2.2rem; line-height: 120%; } .careersImageGrad { top: 0; left: 0; } .careersHeight { height: 43.2rem; } .cLandingImage { padding-bottom: 40%; } .cLandingHeading { padding-top: 2.4rem; } .cLandingHeading { font-size: 8rem; line-height: 100%; } .cLandingHeading { left: 0; } .iForm { width: 100%; height: 800px; } #primary .hscroll { overflow-x: auto; } .logoStrip { width: 100%; margin-top: 2rem; } .logoStrip .footerLogo { height: 7rem; } .accreditations { display: inline-block; } .accTxt { font-size: 1.3rem; line-height: 100%; padding-top: 1rem; text-align: center; } /* accessibility: collapsed submenus are hidden from keyboard and screen readers */ #hamburger [data-accordion]:not(.open) > [data-content] { visibility: hidden; } } /* smartphone.css */ @media (min-width: 100px) and (max-width: 768px) { /* smartphone.css - overrides of default.css for this size band only (generated from the original full file) */ /* band styles */ html, body { font-size: 9px !important; } .noHamburger { display: none; } .hamburger { display: block; } #master { padding-left: 0rem; padding-right: 0rem; } #master-sans { padding-left: 0rem; padding-right: 0rem; } .offset-sub { height: 11rem; } .offset-nosub { height: 11rem; } .offset-subPlus { height: 11.3rem; } #header { padding-left: 1.5rem; padding-right: 1.5rem; position: relative; } #sub-navigation { display: none; } #hamburger ul { margin: 0; padding: 0; list-style: none; overflow: hidden; z-index: 80000; } #hamburger .btn .menu { display: none; position: fixed; top: 12.5rem; right: 0; bottom: 0; width: auto; max-width: 100vw; background-color: #ED1C24; padding: 2rem 2.5rem 3rem 2rem; overflow-x: hidden !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; } #hamburger .btn-link { font-family: "themify"; font-size: 3.2rem; color: #ED1C24; line-height: 3.2rem; padding-left: 14rem; background-color: transparent; padding-right: 1.5rem; padding-top: 0.9rem; text-align: center; display: block; } #hamburger .btn-link:hover { color: white; } #hamburger .main a, #hamburger .main { display: block; color: white; font-size: 2rem; line-height: 3.4rem; text-decoration: none; white-space: nowrap; font-weight: 400; text-align: right; text-transform: uppercase; } #hamburger .main a:hover, #hamburger .main:hover { color: black; } #hamburger .subh a { display: block; color: rgba(255,255,255,0.7); font-size: 1.6rem; line-height: 2.2rem; text-decoration: none; white-space: nowrap; font-weight: 400; text-align: right; text-transform: uppercase; padding-top: 0.4rem; padding-bottom: 0.4rem; } #hamburger .subh a:hover { color: black; } #hamburger .menu { clear: both; } #hamburger .scrollme { padding-left: 3.5rem; } [data-accordion] [data-content] { overflow: hidden; max-height: 0; } [data-accordion] { line-height: 1; } [data-accordion] > [data-control] { cursor: pointer; position: relative; } [data-accordion] > [data-control]:before { content: "\e62a"; position: absolute; left: -3.5rem; top: 0; font-family: "themify"; font-size: 1.6rem; line-height: 3.4rem; color: white; } [data-accordion].open > [data-control]:before { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); color: black; } #header { height: 11rem; border-bottom: 1px solid #ED1C24; } #icons { max-width: 100%; } #stripe-area { max-width: 100%; } #primary { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #primaryMRD { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #news { max-width: 100%; } #news-detail { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #pagination { max-width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #news-area { max-width: 100%; } #furtherInfo { max-width: 100%; } #furtherInfo .text-area { padding-left: 1.5rem; padding-right: 1.5rem; } .machine-item img { height: 18rem; } #machine-info table td { padding-left: 0.6rem !important; padding-right: 0.6rem; } .jcarousel-wrapper { padding-top: 1.4rem; } .jcarousel ul li { margin-left: 1rem; margin-right: 1rem; } .jcarousel ul li img { height: 7.4rem; } .jcarousel-control-prev { top: 4rem; } .jcarousel-control-next { top: 4rem; } .jcarousel ul li a:hover { background-size: 6.4rem; } .jcarousel-wrapper-pop { padding-left: 1.5rem; padding-right: 1.5rem; text-align: center; } .jcarousel-pop ul { width: 100%; } .jcarousel-pop ul li { display: inline-block; } #rec-machine .pop-link a { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } #locations-pop { width: 100%; } #locations-slider img { width: 100%; } .stripe-block { text-align: center; } .range { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } .stripe-box { width: calc(50% - 3.8%); } .stripe-box-machine { display: inline-block; } #stripe-area .stripe-block:nth-of-type(2) .stripe-box:first-of-type h1, #stripe-area .stripe-block:nth-of-type(2) .stripe-box:first-of-type h2.hd1 { letter-spacing: -0.1rem; } #trays-materials .stripe-area-tm { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; padding-bottom: 1rem; } #trays-materials .imagearea-tm { width: 90%; } #trays-materials .textarea-tm { width: 100%; } #trays-materials ul li { margin-bottom: 0.7rem; } #trays-materials ul li a { -webkit-border-radius: 1.2rem; -webkit-border-radius: 1.2rem; -moz-border-radius: 1.2rem; -moz-border-radius: 1.2rem; border-radius: 1.2rem; border-radius: 1.2rem; } #processes .stripe-proc { padding-left: 1.5rem; padding-right: 1.5rem; } #processes .stripe-area-proc { width: 100%; } #processes .sealarea-proc { padding-top: 0rem; vertical-align: baseline; margin-right: 5%; } #processes .imagearea-proc { width: 65%; margin-bottom: 1rem; } #processes .imagearea-proc img { max-height: 28rem; } #processes .textarea-proc { width: 100%; } .machine-image { background-size: 175%; } .foodcat-image { background-size: 175%; } .text-area-machine { padding-top: 21rem; width: 100%; } .text-area-food { padding-top: 21rem; width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #machine-area .machine-range { -webkit-border-bottom-left-radius: 1.2rem; -webkit-border-bottom-right-radius: 1.2rem; -moz-border-radius-bottomleft: 1.2rem; -moz-border-radius-bottomright: 1.2rem; border-bottom-left-radius: 1.2rem; border-bottom-right-radius: 1.2rem; } #machine-area .machine-box img { height: 17rem; } .seImage01 { background-position: center top; } #seStripe01 { max-width: 94%; } #seStripe01 .col01 { width: 100%; height: calc(60.5rem - 3.2rem); padding-top: 4rem; } #seStripe02, #seStripe04 { max-width: 94%; } #seStripe03m { max-width: 94%; padding-top: 3rem; padding-bottom: 3rem; margin-left: auto; margin-right: auto; } #seStripe02 .col01 { width: 100%; } #seStripe02 .col01 .logo img { max-width: 90%; } #seStripe02 .col02 { width: 100%; text-align: center; padding-top: 1rem; } #seStripe02 .col02 img { height: 24rem; } #seStripe03 { display: none; } #seStripe03m .col02 { width: 100%; } #seStripe03m .col02 .logo { margin-bottom: 1rem; } #seStripe03m .col02 .logo img { max-width: 90%; } #seStripe03m .col01 { width: 100%; text-align: center; padding-top: 1rem; } #seStripe03m .col01 img { height: 24rem; display: inline-block; } #seStripe03m h1, #seStripe03m h2.hd1 { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 2.8rem; line-height: 3.2rem; color: #ED1C24; margin-bottom: 1rem; } #seStripe03m h2 { font-family: "Roboto", sans-serif; font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .8rem; } #seStripe03m p { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .8rem; } #seStripe03m strong { font-family: "Roboto", sans-serif; font-weight: 500; } #seStripe03m ul li { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: .4rem; position: relative; padding-left: 1.8rem; } #seStripe03m ul li:before { content: "• "; position: absolute; left: 0; top: 0; color: #ED1C24; font-weight: 500; } #seStripe03m blockquote { font-family: "Roboto", sans-serif; display: block; background-color: rgba(0,0,0,0.1); padding: 2rem; margin-bottom: 1rem; margin-top: 1rem; } #seStripe03m blockquote p:first-of-type { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; line-height: 2.2rem; color: #000; margin-bottom: .8rem; } #seStripe03m a, #seStripe03m a:link { color: #ED1C24; } #seStripe03m a:hover { color: #ED1C24; text-decoration: underline; } #seStripe03m .red { color: #ED1C24; } #seStripe03m .big { font-weight: 300; font-size: 2rem; line-height: 2.5rem; color: #fff; margin-bottom: 1rem; } #seStripe03m span { font-family: "luminesign"; font-size: 2.4rem; line-height: 3.2rem; color: #ED1C24; } #seStripe03m { color: white; } .machine-range-icons { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } #machine-icons .xcarousel ul li { margin-left: 1rem; margin-right: 1rem; margin-bottom: 2rem; } #machine-icons .xcarousel ul li img { height: 7.4rem; } #machine-icons .xcarousel-control-prev { top: 4rem; } #machine-icons .xcarousel-control-next { top: 4rem; } #machine-icons .xcarousel ul li a:hover, #machine-icons .xcarousel ul li a.selected { background-size: 6.4rem; } .news-box { width: calc(50% - 3.8%); min-height: 34rem; } .bx-wrapper .bx-loading { position: absolute; } .bx-wrapper .bx-pager { position: absolute; } #slider-contact .bx-pager { top: calc(50% + 2.5rem); } .bx-wrapper .slider-caption { position: absolute; } #slider-contact .map-caption { top: calc(50% - 2rem); } .c-tabs__link { font-size: 1.5rem; line-height: 2rem; padding-left: 0.8rem; padding-right: 0.8rem; -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; } .c-tabs__content { padding: 1.5rem; } #tabs .left_col { width: 100%; } #tabs .right_col { width: 100%; } #tabs .left_col2 { width: 35%; } #tabs .right_col2 { width: 65%; } #tabs .left_col3 { width: 100%; } #tabs .right_col3 { width: 100%; } #full-map .left_fullmap { width: 100%; } #full-map .right_fullmap { width: 100%; } #tabs ul li, #full-map ul li { font-size: 1.2rem; line-height: 1.5rem; padding-left: 0.6rem; } #full-map table td { padding-left: 2rem; } #tabs .c-tabs__content2 object { height: 10rem; } #news .news-panel { padding-left: 1.5rem; padding-right: 1.5rem; } #news .list-image { width: 100%; margin-bottom: 1rem; } #news .list-text { width: 100%; } #news .news-image-panel { padding-left: 1.5rem; padding-right: 1.5rem; } #news .detail-image { width: calc(50% - 0.75rem); margin-left: 1.5rem; margin-bottom: 1.5rem; } #news .detail-image:nth-of-type(2n + 1) { margin-left: 0; } #pagination .blocked { padding-left: 1rem; padding-right: 1rem; } #pagination .notblocked { padding-left: 1rem; padding-right: 1rem; margin-left: 0rem; } #pagination a, #pagination a:link, #pagination .unblocked { padding-left: 1rem; padding-right: 1rem; margin-left: 0; } #pagination a:hover { padding-left: 1rem; padding-right: 1rem; } .inputArea .col1 { width: 100%; } .inputArea .col2 { width: 100%; } .inputArea p { color: #fff !important; } .inputArea textarea { height: 18.7rem; } .inputArea .tick { position: absolute; } .inputArea .cross, .inputArea .invalid { position: absolute; } ::-webkit-input-placeholder { font-size: 1.6rem; } :-moz-placeholder { font-size: 1.6rem; } ::-moz-placeholder { font-size: 1.6rem; } :-ms-input-placeholder { font-size: 1.6rem; } #contact { width: 100%; } #contact .address-block { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #findarea .findblock { width: 100%; margin-bottom: 2rem; } #findarea .findblock:last-of-type { padding-bottom: 8rem; } #findarea .tick { top: 2rem; } #findarea .cross { top: 2rem; } #innovations { width: 100%; } #innovations .innovations-panel { min-height: 47.1rem; } #innovations .innovations-content { width: 100%; min-height: 47.1rem; padding-left: 1.5rem; padding-right: 1.5rem; } #innovations .innovations-items { width: 100%; min-height: 47.1rem; padding-bottom: 3rem; float: none !important; } #innovations img { max-width: 28rem; } #innovations .pushdown1 { padding-top: 2rem; } #innovations .pushdown2 { padding-top: 2rem; } #innovations .pushdown3 { padding-top: 2rem; } #innovations .pushdown4 { padding-top: 2rem; } #innovations .pushdown5 { padding-top: 2rem; } .innovationsNew { width: 100%; } .innovationsNew .flexCentreCentre { display: flex; justify-content: center; align-items: center; } .innovationsNew .flexLeftCentre { display: flex; justify-content: left; align-items: center; } .innovationsNew .textto { padding-left: 1.5rem; padding-right: 1.5rem; } .innovationsNew .imageBackgroundtoi { background-size: cover; height: 20rem; position: relative; } .innovationsNew .padLefttoi { padding-left: 30%; padding-right: 0; background-position: right center; } .innovationsNew .padRighttoi { padding-right: 30%; padding-left: 0; } .innovationsNew .itv { padding-left: 1.5rem; padding-right: 1.5rem; } .innovationsNew .imageareaitv { display: block; width: 100%; margin-bottom: 2rem; } .padLeftitv { padding-left: 0; } .padRightitv { padding-right: 0; } .innovationsNew .textareaitv { width: 100%; } .innovationsLand { width: 100%; } .innovationsLand .imageBackgroundtoi { position: relative; } .innovationsLand .texttoi { width: 100%; padding-left: 2rem; padding-right: 2rem; } .innovationsLand .flexCentreCentre { display: flex; justify-content: center; align-items: center; } .innovationsLand .flexLeftCentre { display: flex; justify-content: left; align-items: center; } #image1218 .pageHeading { padding-left: 1.5rem; padding-right: 1.5rem; } #testKitchen .textArea { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #testKitchen .textArea .serviceLinks { padding-left: 0; } #testKitchen .testKitchen-panel { min-height: 44.2rem; } #testKitchen .testKitchen-content { width: 100%; min-height: 44.2rem; padding-left: 1.5rem; padding-right: 1.5rem; } #testKitchen .testKitchen-items { width: 100%; min-height: 44.2rem; padding-bottom: 3rem; } #testKitchen .pushdown1 { padding-top: 2rem; } #testKitchen .pushdown2 { padding-top: 2rem; } #testKitchen .pushdown3 { padding-top: 2rem; } #testKitchen .pushdown4 { padding-top: 2rem; } #testKitchen .pushdown5 { padding-top: 2rem; } #caseLanding .textAreaLanding { padding-bottom: 8rem; max-width: 100%; padding-left: 2rem; padding-right: 2rem; } .caseLandingImage { background-position: 42rem bottom; background-size: 100%; } .caseLandLink { padding-top: 4rem; padding-bottom: 5rem; } .caseTabs { -webkit-border-top-left-radius: 1.2rem; -webkit-border-top-right-radius: 1.2rem; -moz-border-radius-topleft: 1.2rem; -moz-border-radius-topright: 1.2rem; border-top-left-radius: 1.2rem; border-top-right-radius: 1.2rem; top: -3rem; left: 0rem; } #caseBrief .caseBriefContent { width: 100%; } #caseBrief .caseBriefItem { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #caseBrief .caseBriefImage { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #caseBrief .pushdown4 { padding-top: 3rem; } .marTop { margin-top: 5rem; } #caseSol { width: 100%; } #caseSol .caseSolItem { padding-right: 1.5rem; padding-left: 1.5rem; } #caseSol .type4 { width: 50%; } #caseSol .type4 .caseImg { max-width: 18.6rem; } #caseSol .type4:nth-of-type(2), #caseSol .type4:nth-of-type(6) { padding-left: 1.5rem !important; } #caseSol .type3:nth-of-type(2), #caseSol .type3:nth-of-type(5) { padding-left: 1.5rem !important; } .cd-image-container { display: none; } .is-visible .cd-resize-img { width: 50%; } #primaryGender { width: 100%; padding-left: 1.5rem; padding-right: 1.5rem; } #primaryGender .chartArea1 { margin-top: 1rem; margin-bottom: 1rem; } #primaryGender .chartArea2 { margin-top: 1rem; margin-bottom: 1rem; } #primaryGender .chart50 { width: 100%; padding: 2rem; margin-bottom: 1rem; } #primaryGender .chartArea2Inner { padding: 1rem; } #primaryGender .chart25 { width: 50%; padding: 1rem; } #primaryGender .tableShow { display: none; } #primaryGender .tableHide { display: block; } #footer { padding-top: 2rem; padding-left: 1.5rem; padding-right: 1.5rem; } #footer .cols { width: 100%; display: none; } #footer .cols:last-of-type { display: block; } #footer p span { font-family: "Roboto Condensed", sans-serif; color: #A7A9AC; } #footer .flags { width: 100%; margin-left: auto; margin-bottom: 2.4rem; } #footer .flags img { width: 100%; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; } #footer .col-4 { padding-left: 4rem; } #footer a.selected { color: #ED1C24; } #footer .copyright a { color: #ccc; } .lity { top: 0; left: 0; } .lity-wrap { top: 0; left: 0; text-align: center; } .lity-loader { top: 50%; margin-top: -0.8rem; width: 100%; text-align: center; font-size: 1.4rem; } .lity-container { text-align: left; display: inline-block; height: 100%; } .lity-content { width: 100%; } .lity-close { top: 1rem; cursor: pointer; text-align: center; padding: 0; width: 4rem; height: 4rem; font-size: 2.4rem; line-height: 3.6rem; cursor: pointer; padding-bottom: 0.4rem; } .lity-close:hover, .lity-close:focus, .lity-close:active, .lity-close:visited { padding: 0; padding: 0; cursor: pointer; } .lity-iframe .lity-container { width: 100%; height: 100%; } .lity-iframe-container { width: 100%; height: 0; padding-top: 56.25%; } .lity-hide { display: none; } .redTabRule { top: 5.4rem; left: 0; } .footerRule2 { display: none; } #headerps { height: 12.5rem; border-bottom: 2px solid #6C6B6A; } #headerps .col-header1ps .jbt { height: 12.5rem; } .offset-subps { height: 11.4rem; } .ukps { font-size: 1.6rem !important; line-height: 2.2rem !important; display: block; } .rangeJBT { display: inline-block; padding-top: .5rem; padding-bottom: .4rem; font-size: 1.8rem; line-height: 2.2rem; margin-top: 1rem; } #hamburger { position: absolute; top: 4.5rem; right: 0; } #hamburger .btn-link { padding-bottom: 3.98rem; } .careersItem { width: 100%; } .careersImage { width: 100% !important; height: 30rem; } .careersText { width: 100%; padding-left: 2rem; padding-right: 2rem; padding-top: 2rem; padding-bottom: 2rem; } .careersh4 { font-size: 3.5rem; line-height: 140%; } .careersP { font-size: 2.2rem; line-height: 120%; } .careersImageGrad { top: 0; left: 0; display: none; } .cLandingImage { height: 30rem; } .cLandingHeading { padding-left: 4rem; padding-right: 4rem; padding-top: 2.4rem; padding-bottom: 2.4rem; } .cLandingHeading { font-size: 5rem; line-height: 100%; } .cLandingHeading { left: 0; } #headerps { position: relative; } #headerps .ps-loginAreaps { position: absolute; right: 0; top: 0; z-index: 10; } #headerps .logoAreaps { padding-top: 5rem; padding-bottom: 0; height: 11.3rem; padding-right: 6.8rem; } .iForm { width: 100%; height: 1090px; } #primary .hscroll { overflow-x: auto; } #primary table { padding: 0.4rem; } #primary table td, #primary table th { padding-left: 1rem !important; padding-right: 1rem; } .logoStrip { width: 100%; margin-top: 2rem; } .logoStrip .footerLogo { height: 7rem; } .accreditations { display: inline-block; } .accTxt { font-size: 1.3rem; line-height: 100%; padding-top: 1rem; padding-bottom: 2rem; text-align: center; } /* accessibility: collapsed submenus are hidden from keyboard and screen readers */ #hamburger [data-accordion]:not(.open) > [data-content] { visibility: hidden; } }