img, iframe {max-width: 100%; height: auto} html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%} :root { --main-bg: #fff; --light: #f5f5f5; --light-comp: #4d4d4d; --dark: #333; --dark-comp: #fff; --primary: #004A66; --primary-comp: #fff; --secondary: #31435a; --secondary-comp: #fff; }.bg-dark, .bg-primary { color: var(--dark-comp, #fff); }.bg-dark { background-color: var(--dark, #333); }.bg-primary { background-color: var(--primary, #004A66); }.bg-light { background-color: var(--light, #f5f5f5); }.downloadbtns p:has(.btn) { text-align: center; }.wrap:has(.downloadbtns) { padding: 0 20px; } body { font-family: 'Red Hat Display', Arial, Helvetica, sans-serif; font-size: 18px; line-height: 1.5; text-align: center; min-width: 320px; }body, footer a { color: var(--light-comp, #4d4d4d); }body, header ul, .hero h1, .hero p { padding: 0; margin: 0; }blockquote { border-left: 5px solid #ccc; padding-left: 15px; margin: 1em 0; }h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; }h1, h6, nav, form input[type=submit], .btn, .contactmain p { text-transform: uppercase; }h1, h2, h3, h4, h5, h6 { line-height: 1.3; }h1 { font-size: 32px }h2 { font-size: 24px; color: var(--primary, #2878b5); }h3 { font-size: 18px }h4 { font-size: 16px; }h5 { font-size: 13px; }img, iframe { max-width: 100%; height: auto;display:block;margin:0 auto }iframe { display: block; aspect-ratio: auto 16 / 9; width: 100%; margin: 1em auto; }.fullwidth { width: 100%; }a img, iframe { border: none; }.bgimg { position: relative; }.bgimg > img:first-of-type { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center; inset: 0; z-index: 0; }a, .partnersmain img { transition: ease-in-out .3s; }a, header a:hover, form input[type=submit]:hover, .btn:hover, footer a:hover, .contactmain a:hover, .solutions a:hover { text-decoration: none; }a, header a:hover, footer a:hover, .contactmain a:hover { color: var(--primary, #004A66); }a:hover { text-decoration: underline; }hr { border-width: 1px; border-color: #eee; border-style: none none solid; margin: 40px 0; }.imgLeft, .imgRight { max-width: 45%; }.imgLeft { float: left; margin: 10px 4% 2% 0; }.imgRight { float: right; margin: 10px 0 2% 4%; }.clear { clear: both; }.nowrap, a[href^=tel] { white-space: nowrap; }sup { line-height: 0; }.hide { display: none !important; }.center, .ccpaNotice, .ctamain h2, .ctamain h3, .ctamain p, .contactmain h2, .contactmain p, .contactmain li { text-align: center !important; }.wrap { display: block; max-width: 1080px; margin: 0 auto; position: relative; }.mid { align-items: center; align-self: center; }.grid { display: grid; grid-gap: 10px 20px; }.grid.half { grid-template-columns: repeat(2, 1fr); }.grid.third { grid-template-columns: repeat(3, 1fr); }.grid.fourth { grid-template-columns: repeat(4, 1fr); } header, footer, .about .grid h3 span { font-size: 16px; }header, .hero { position: relative; }header { z-index: 999; } header .grid, footer .cta .grid { grid-template-columns: 250px 1fr; }header .grid > div:last-of-type, .hero h1, .hero p, footer .subfoot .grid > div:last-of-type { text-align: center; }header img { padding: 0 10%; }nav li { display: inline-block; font-weight: bold; margin-left: 20px; }nav li a:hover { color: var(--light, #f5f5f5); }nav a, .hero h1, .hero p, .contactmain a { color: var(--dark-comp, #fff); } .hero, .ctamain, .contactmain { background-size: cover; background-position: center; position: relative; }.hero:before, .hero .wrap:after, .ctamain:before, .contactmain:before { content: ""; position: absolute; }.hero:before, .ctamain:before, .contactmain:before { width: 100%; height: 100%; background-color: rgba(0, 0, 0, .5); top: 0; left: 0; z-index: 2; }.hero .wrap:after { max-width: 600px; background-color: #fff; height: 1px; top: 80%; right: 150px; }.hero { width: 100%; height: 550px; margin-top: -260px; position: relative; }.hero.bgimg > img:first-of-type { object-position: center 25%; }.hero > .wrap { top: 75%; transform: translateY(-75%); z-index: 10; position: relative; }.hero h1, .hero p, .ctamain p, .contactmain h2, .contactmain p { padding: 0 10px; text-shadow: 2px 2px 3px rgba(0, 0, 0, .3); }.hero h1, .contactmain h2 { font-size: 36px; }.hero p { font-size: 24px; font-weight: bold; }.hero .btn { margin-top: 40px; text-shadow: none; }.ctamain p, main h1, main h2, main h3, main h4 { text-wrap: balance; } .countup { padding-top: 50px }.countup p { font-size: 24px; text-align: center; border-radius: 10px; padding: 50px 0; background-color: var(--light, #f5f5f5); box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px; max-width: 530px; }.countup strong { display: block; font-weight: 800; font-size: 40px; line-height: 1.2; font-family: "Google Sans", sans-serif; letter-spacing: -2px; }.aboutmain .wrap { padding: 50px 10px 40px; }.aboutmain img { max-width: 30%; height: auto; }.servicesmain a.btn{padding:10px 25px}.servicesmain .grid.half { padding: 3% 0; }.servicesmain .wrap { padding: 50px 10px 40px; }.servicesmain .grid h2 { align-content: center; }.ctamain:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(64, 64, 64, 0.8); pointer-events: none; z-index: 1; }.ctamain { height: 340px; font-weight: bold; }.ctamain .wrap { position: relative; z-index: 2; }.ctamain .wrap, .contactmain .wrap, .solutions .emphasis .wrap { top: 50%; transform: translateY(-50%); }.ctamain p { max-width: 900px; margin: 20px auto; }.solutionsmain .wrap { padding: 60px 10px; }.solutionsmain h3 { display: flex; align-items: center; gap: 10px; }.testimonialsmain .wrap { padding: 60px 10px; }.testimonialsmain p { margin: 0; padding-left: 20px; }.news-container { margin: 0 auto; padding: 20px }.news-item { padding: 10px 0 }.news-date { font-size: 0.9em; margin-bottom: 10px }.news-summary { font-size: 1em }.news-summary, .news-date, .news-item h3 { text-align: left; }.image-item { max-height: 200px; width: 100%; overflow: hidden; }.image-item img { object-fit: contain; }.newsnresource .wrap { padding: 20px 10px; }.partnersmain .wrap { padding: 20px 10px; }.partnersmain img { display:inline-block;vertical-align: middle; filter: grayscale(100%); opacity: 50%; margin: 40px 30px; }.partnersmain img:hover { filter: grayscale(0); opacity: 100%; }.contactmain { height: 600px; font-weight: bold; position: relative; }.contactmain h2 { color: var(--dark-comp, #fff); }.contactmain ul { max-width: 850px; padding: 20px 0; margin: 40px auto; border-top: 1px solid #fff; border-bottom: 1px solid #fff; }.contactmain p a { padding: 0 10px; }.flow { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; max-width: 100%; }.step { background-color: #004a66; color: var(--primary-comp, #fff); padding: 15px 20px; border-radius: 5px; margin: 10px; position: relative; flex: 1 1 150px; text-align: center; }.step:not(:last-child)::after { content: ""; position: absolute; right: -20px; top: 50%; transform: translateY(-50%); border-left: 20px solid #004a66; border-top: 10px solid transparent; border-bottom: 10px solid transparent; } form { margin: 20px 0; }form .grid { grid-gap: 0 10px; }form label { display: block; }form input[type=text], form input[type=email], form input[type=tel], form input[type=file], form input[type=submit], form select, form textarea, form input[type=password], .btn { font-family: 'Red Hat Display', sans-serif; font-size: 16px; }form input[type=text], form input[type=email], form input[type=tel], form select, form textarea, form input[type=password] { background-color: var(--main-bg, #fff); margin-bottom: 10px; padding: 0 10px; border: 1px solid #f5f5f5; }form input[type=text], form input[type=email], form input[type=tel], form select, form input[type=password] { height: 45px; }form input[type=text], form input[type=email], form input[type=tel], form textarea, form input[type=password] { width: calc(100% - 20px); }form select { width: 100%; }form input[type=file] { margin-left: 10px; border-radius: 0; }form textarea { height: 100px; padding: 15px 10px; }form input[type=submit], .btn { display: inline-block; min-width: 110px; font-weight: bold; text-align: center; line-height: 1.6; background-color: var(--primary, #004A66); color: var(--primary-comp, #fff); padding: 10px 40px; margin: 10px 0; border: none; border-radius: 3px; transition: ease-in-out .3s; }form input[type=submit] { min-width: 250px; margin: 0; }form input[type=submit]:hover, .btn:hover { cursor: pointer; background-color: var(--secondary, #31435a); color: var(--primary-comp, #fff); } footer .grid.fourth { padding: 40px 0; border-top: 1px solid #eee; border-bottom: 1px solid #eee; } main, .about, .solutions, .contact { padding: 40px 10px; }.nolist, footer ul, .contactmain ul, .contact ul { list-style: none; padding-left: 0; }.solutions ul, .aboutmain ul { list-style: none; padding-left: 0; }.solutions li, .aboutmain li { position: relative; padding-left: 40px; margin-bottom: 15px; line-height: 1.2; }.solutions li:before, .aboutmain li:before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; background-color: var(--primary, #004A66); border-radius: 2px; transition: all 0.4s ease-in-out; }.solutions li:hover:before, .aboutmain li:hover:before { transform: translateY(-50%) rotate(45deg) scale(1.1); background-color: var(--secondary, #31435a); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); }.solutions ul.checkbox li:before { content: "✓"; width: auto; height: auto; background-color: transparent; border-radius: 0; font-weight: 900; font-size: 18px; color: var(--primary, #004A66); display: flex; align-items: center; justify-content: center; left: -5px; }.solutions ul.checkbox li:hover:before { transform: translateY(-50%) scale(1.2); color: var(--secondary, #31435a); box-shadow: none; }.product-logos img { height: 120px; width: auto; object-fit: contain; }.about .grid { padding: 50px 0 40px; margin: 50px 0; }.about .grid h3 span { display: block; margin: 5px 0; }.manageditchart .wrap { padding: 60px 10px; }.manageditchart .grid div { align-content: center; }.contact .grid.mid { grid-template-columns: 300px 1fr; padding: 40px 0 50px; }.contact .grid.mid ul { padding: 10px 0 10px 70px; position: relative; }.contact li:first-of-type { position: absolute; top: 10px; left: 20px; }body.solutions-default .grid.third > div { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); padding: 10px; }.solutions .grid.third > div { border: 1px solid #ddd; padding: 10px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }.solutions .grid.third > div p { font-size: 17px; }.breaches { font-size: 28px !important; font-weight: 700 !important; color: #333 !important; text-transform: uppercase !important; letter-spacing: 1px !important; text-shadow: 1px 1px 0px #004A66 !important; margin: 20px 0 !important; padding: 15px !important; line-height: 1.4 !important; font-family: 'Red Hat Display', Arial, sans-serif !important; border-right: 3px solid #004A66 !important; }.grid.postbase > div { display: flex; flex-direction: column; }.grid.postbase img { height: 200px; width: auto; object-fit: contain; }.about span { font-style: italic; font-weight: normal; }.printers { border-left: 5px solid var(--primary, #004a66); padding: 30px; background-color: #f9f9f9; border-radius: 8px; }.printers .bg-light { padding: 25px; background-color: var(--primary, #004a66); color: #fff; border-radius: 6px; border-top: 3px solid var(--secondary, #31435a); }.printers h2 { text-align: center; font-size: 34px; }.printers .bg-light h2 { color: #fff; }.pad { padding-left: 10px; padding-right: 10px; }.newsblog.homepage .post { display: flex !important; flex-direction: column !important; gap: 10px; position: relative; }.newsblog.homepage .posts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }.newsblog .post img, .newsblog .postThumbnail { height: 150px !important; width: 100% !important; object-fit: cover; display: block !important; margin: 0 !important; padding: 0 !important; flex-shrink: 0; order: 1 !important; }.newsblog .post > h2, .newsblog .post > h3, section .post > h3 { margin-top: 0 !important; margin-bottom: 10px !important; order: 2 !important; }.newsblog .post > p { margin: 0 !important; padding: 0 !important; order: 3 !important; }.newsblog .post > p:nth-of-type(1) { font-size: 0.9em; margin-bottom: 5px !important; order: 3 !important; }.newsblog .post > p:nth-of-type(2) { order: 4 !important; }.newsblog .post > a, .newsblog .post a { margin-top: auto !important; align-self: flex-start; order: 5 !important; } @media(max-width:999px) { .grid.fourth, .grid.fifth { grid-template-columns: repeat(2, 1fr); } .flow:has(.step) { flex-direction: column; } .step { flex: none; width: clamp(280px, 9vw, 75%); position: relative; margin: 0 auto 30px; } .step:not(:last-child)::after { content: ""; position: absolute; right: auto; top: auto; bottom: -20px; left: 50%; transform: translateX(-50%); border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 20px solid #004a66; border-bottom: 0; } footer .grid.fourth { padding: 40px 15px; }} @media(max-width:900px) { header .grid { grid-template-columns: 1fr; } .hero { height: 660px; } .hero h1 { font-size: 28px; text-align: center; } .hero p { font-size: 18px; text-align: center; } .hero .wrap:after { width: unset !important; } nav ul { text-align: center; } nav li { margin-left: 10px; } .subfoot .grid { grid-template-columns: 1fr; } .subfoot p, footer .subfoot .grid > div:last-of-type { text-align: center; } .subfoot img { margin: 0 auto; } .hero .wrap:after { display: none; }} @media(max-width:800px) {} @media(max-width:767px) { .grid.fourth { grid-template-columns: 1fr 1fr; } .grid.half { grid-template-columns: 1fr; } .grid.third { grid-template-columns: repeat(2, 1fr); } .newsblog.homepage .posts { grid-template-columns: 1fr; } form .grid.half, .contact .grid.mid { grid-template-columns: 1fr; } .contactmain ul { max-width: 100%; padding: 20px 10px; margin: 30px auto; } .contact .grid.mid :is(ul,li) { text-align: center; } .contact .grid.mid ul { padding: 10px 0; } .contact svg { margin: 0 auto; } .contact li:first-of-type { position: relative; top: unset; left: unset; } .partnersmain img { margin: 20px 15px; } .about .grid { padding: 40px 0; margin: 30px 0; } .aboutmain img { max-width: 50%; height: auto; } .imgRight, .imgLeft { float: none; margin: 0 auto; max-width: 100%; } .flow { flex-direction: column; } .countup p { margin: 0 auto; }} @media(max-width:700px) { body { font-size: 16px; } h1 { font-size: 28px; } h2 { font-size: 22px; } h3 { font-size: 18px; } .hero p { font-size: 16px; } header .grid, .values .grid.half, .bg-light .grid.half { grid-template-columns: 1fr; } .subfoot p { text-align: center; margin: 1em 0; } .about .values ul { margin-bottom: 1em; } .about .bg-primary { margin-top: 1em; min-height: unset; } .countup p { padding: 30px 0; font-size: 18px; } .countup strong { font-size: 32px; } .ctamain { height: 300px; } .contactmain { height: 400px; } .contactmain h2 { font-size: 28px; } .grid.fourth, .grid.third { grid-template-columns: 1fr; } .product-logos img { padding: 0 25px; } footer :is(h3,ul,li) { text-align: center; } footer li { margin: 15px 0; }} @media(max-width:600px) { nav ul { text-align: center; } nav li { text-align: center; margin: 15px auto; display: block; } .hero { margin-top: -450px; height: 780px; } .grid.fourth { grid-template-columns: 1fr; } .downloadbtns p { padding: 0 10px; margin: 10px 0; } .downloadbtns .btn { display: block; width: 100%; max-width: 300px; margin: 10px auto; box-sizing: border-box; padding: 10px 15px; }} @media(max-width:500px) { .hero > .wrap { padding: 50px 10px 30px; z-index: 10; position: relative; } .hero h1 { font-size: 18px; } .hero p { font-size: 12px; } .countup p { padding: 20px 0; font-size: 16px; } .countup strong { font-size: 28px; } .ctamain { height: 250px; } .contactmain { height: 350px; } .contactmain h2 { font-size: 22px; } main, .about, .solutions, .contact { padding: 20px 10px; } form input[type=submit] { padding: 12px 20px; } .printers { padding: 15px; } .printers h2 { font-size: 24px; } footer .wrap { padding: 15px 10px; } .wrap { padding: 0 10px; } .product-logos img { padding: 0; }} @media(max-width:400px) { body { font-size: 13px; line-height: 1.4; } h1 { font-size: 18px; } h2 { font-size: 16px; } h3 { font-size: 14px; } .hero > .wrap { padding: 40px 8px 20px; z-index: 10; position: relative; } .hero h1 { font-size: 16px; } .hero p { font-size: 11px; } .contactmain h2 { font-size: 20px; } .contactmain ul { padding: 10px 0; } .step { max-width: 250px; font-size: 12px; } form input[type=text], form input[type=email], form input[type=tel], form select, form textarea, form input[type=password] { font-size: 14px; padding: 10px 8px; } form input[type=submit], .btn { padding: 10px 20px; font-size: 14px; } .wrap { padding: 0 8px; }}