*{ padding: 0; margin: 0; list-style: none; text-decoration: none; } body { font-family: 'PT Sans Narrow', sans-serif; } #content ul li { padding-left: 15px; margin-bottom: 10px; background: url("/images/bullet-point.jpg") 0 12px no-repeat; } ul#content-body { float: left; width: 58%; margin-top: 12px; font-size: 24px; color: black; line-height: 45px; } @media screen and (max-width: 968px) { ul#content-body { float: left; width: 100%; margin-top: 12px; font-size: 24px; color: black; line-height: 45px; } } .index-banner-image { display: inline-block; float: right; padding-left: 20px; } .index-banner-text { width: 40%; line-height: 2; font-size: 21px; } @media screen and (max-width: 968px) { .index-banner-image { display: inline-block; float: inherit; } .index-banner-text { width: 100%; line-height: 2; font-size: 21px; } } div#indexaboutwrapper { max-width: 1200px; margin: 0 auto; } nav.fixed-header { position: fixed; top: -65px; left: 0; width: 100%; z-index: 1000; } mobilenav.fixed-header { top: 0; position: fixed; overflow-y: scroll; overflow-x: hidden; } mobilenav a { color: white !important; } nav#nav { top: 0px; } .headnav-fixed-header{ background-color: rgb(0 0 0 / 85%) !important; height: 110px !important; margin-top: 0px !important; } .sidebar { z-index: 102; position: fixed; left: -275px; width: 275px; top:0; height: 100%; background: #042331; transition: all .5s ease; } .contactitems { text-align: right; font-size: 20px; color: white; margin-left: 30px; margin-top: 0px; z-index: 98; opacity: 1; height: 50px; position: relative; display: list-item; } .sidebar header { z-index: 20; font-size: 22px; color: white; line-height: 118px; text-align: center; background: #063146; user-select: none; } .sidebar ul a{ z-index: 20; display: block; height: 100%; width: 100%; line-height: 85px; font-size: 20px; color: white; padding-left: 40px; box-sizing: border-box; border-bottom: 1px solid black; border-top: 1px solid rgba(255,255,255,.1); transition: .4s; } div#headnavcontact { position: absolute; top: 0; left: 0; height: 58px; width: 100%; z-index: 101; background-color: rgb(31 59 142); text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; } div#headnavcontact1 { position: absolute; top: 0; left: 0; height: 67px; width: 100%; z-index: 101; background-color: rgb(0, 0, 0); border-bottom: 2px solid white; } .banner-image img { width: 100%; margin-top: 20px; } .locations-map-hero { box-sizing: border-box; width: 100%; height: clamp(220px, 31vw, 465px); margin: 0; overflow: hidden; background: #ffffff; border-bottom: 1px solid #dbe3ec; } .locations-map-hero img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; } div#video1 { width: 100%; height: 100%; max-height: 98%; position: absolute; top: 65px; left: 0; z-index: 5; object-fit: cover; font-family: 'object-fit: cover'; } ul.navitemscontact { text-align: right; font-size: 20px; color: white; margin-right: 30px; margin-top: 45px; z-index: 98; opacity: 1; height: 50px; position: relative; display: list-item; } div#headnav { position: absolute; top: 65px; left: 0; height: 108px; width: 100%; margin-top: -25px; text-align: center; z-index: 100; background-color: #000000b8; } .fixed { position: fixed; top: 10px; } div#headlogo { position: relative; display: inline-block; float: left; height: 148px; background-color: #1f3b8e; border-radius: 0px 0px 50px 0px; z-index: 999; border-radius: 50px 0px; } div#navsecs { text-align: right; font-size: 20px; color: white; margin-right: 30px; margin-top: 45px; z-index: 98; opacity: 1; height: 50px; position: relative; display: list-item; } li.navitem { display: inline-block; padding: 0px 30px 10px 0px; font-size:17px; color: white; } li.navitem1 { display: inline-block; float: right; padding: 3px 0px 10px; margin-top: 16px; } li.navitem.header-search { display: block; float: right; width: clamp(220px, 20vw, 300px); height: 46px; margin: -8px 0 0 18px; padding: 0; } .site-search-form { display: flex; align-items: stretch; width: 100%; height: 46px; margin: 0; overflow: hidden; background: #ffffff; border: 1px solid #d5dbe8; border-radius: 3px; box-sizing: border-box; text-shadow: none; } .site-search-form:focus-within { border-color: #ffffff; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.35); } .site-search-form input[type="search"] { flex: 1 1 auto; min-width: 0; width: auto; height: 44px; margin: 0; padding: 0 12px; color: #222222; background: #ffffff; border: 0; border-radius: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; font: 400 16px/44px "PT Sans", sans-serif; text-align: left; outline: 0; -webkit-appearance: none; appearance: none; } .site-search-form input[type="search"]::placeholder { color: #6b7280; opacity: 1; } .site-search-form button { display: flex; flex: 0 0 44px; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0; padding: 0; color: #1f3b8e; background: #f4f6fa; border: 0; border-left: 1px solid #d5dbe8; border-radius: 0; box-sizing: border-box; cursor: pointer; -webkit-appearance: none; appearance: none; } .site-search-form button:hover, .site-search-form button:focus { color: #ffffff; background: #1f3b8e; outline: 0; } .site-search-form button svg { display: block; width: 19px; height: 19px; fill: currentColor; } .site-search-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .sidebar ul a i{ margin-right: 16px; } #check{ z-index: 99; display: none; } label #btn,label #cancel{ z-index: 9999; position:fixed; position: absolute; background: #042331; border-radius: 3px; cursor: pointer; } label #btn { z-index: 100; left: 25px; position: absolute; top: 10px; font-size: 35px; color: white; padding: 6px 12px; transition: all .5s; } label #cancel{ z-index: 99; z-index: 1111; left: -195px; position:fixed; top: 17px; font-size: 30px; color: #0a5275; padding: 4px 9px; transition: all .5s ease; } #check:checked ~ .sidebar{ left: 0; } #check:checked ~ label #btn{ left: 250px; opacity: 0; pointer-events: none; } #check:checked ~ label #cancel{ left: 224px; } #check:checked ~ section{ margin-left: 250px; } section{ background-position: center; background-size: cover; height: 100vh; transition: all .5s; margin-top: -37px; } #hero { height:85%; width:100%; background:white; display:flex; align-items:center; justify-content: center; } #hero::after { width:100%; height:85%; content: ''; position:absolute; z-index:10; top:0; left:0; background:rgba(0,0,0,0.5); border-bottom-left-radius: 238% 80px; border-bottom-right-radius: 220% 120px; } #hero1::after { width:100%; height:91%; content: ''; position:absolute; z-index:10; top:0; left:0; background:rgba(0,0,0,0.5) } #hero video { width:100%; height:100%; max-height: 85%; position:absolute; top:0; left:0; z-index:5; object-fit:cover; font-family:'object-fit: cover'; border-bottom-left-radius: 238% 80px; border-bottom-right-radius: 220% 120px; } #hero video1 { width:100%; height:100%; max-height: 85%; position:absolute; top:65px; left:0; z-index:5; object-fit:cover; font-family:'object-fit: cover'; } #hero .texture { width:100%; height:85%; position:absolute; top:0; left:0; z-index:15; background:url("/assets/performance/texture.db5f562ecd676efb.png"); border-bottom-left-radius: 238% 80px; border-bottom-right-radius: 220% 120px; border-bottom: 8px solid #1c3e9a; } #hero .texture1 { width:100%; height:83%; position:absolute; top:65px; left:0; z-index:15; background:url("/assets/performance/texture.db5f562ecd676efb.png"); border-bottom-left-radius: 238% 80px; border-bottom-right-radius: 220% 120px; } #hero .caption { position:relative; z-index:20; top: 55px; text-align:center; color:#ffffff; } @media screen and (max-width: 650px) { #hero .caption { position:relative; z-index:20; top: 95px; text-align:center; color:#ffffff; } } #hero .caption h1 { font-size:2em; font-family: 'Oswald', sans-serif; margin-bottom:0.5rem; } #hero .caption h2 { font-weight:400; font-size:1.5rem; margin:0; font-family: 'PT Sans', sans-serif; } #content { width: 100%; height: auto; max-width: 1200px; top: 0px; padding: 50px 20px; background-color: white; z-index: 99; overflow: hidden; margin: 0 auto; padding-top: 75px; position: relative; } #aboutcontent { overflow: hidden; margin: 0 auto; padding: 50px; position: relative; text-align: center; color: white; margin: 100px 0; background-color: #25396c; } #aboutcontent.home-about, #aboutcontent.home-about * { box-sizing: border-box; } #aboutcontent.home-about { isolation: isolate; height: auto; min-height: 0; margin: 0; padding: clamp(80px, 8vw, 112px) 20px; text-align: left; background: linear-gradient(135deg, #172a57 0%, #253f7b 100%); transition: none; } #aboutcontent.home-about::before { position: absolute; z-index: -1; top: -260px; right: -180px; width: 580px; height: 580px; border-radius: 50%; background: radial-gradient(circle, rgba(116, 146, 228, 0.24) 0%, rgba(116, 146, 228, 0) 70%); content: ""; pointer-events: none; } .home-about__inner { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr); align-items: center; gap: clamp(50px, 7vw, 92px); width: 100%; max-width: 1280px; margin: 0 auto; } .home-about__copy { min-width: 0; max-width: 620px; } .home-about__copy > .home-about__eyebrow { margin: 0 0 12px; color: #d2dcff; font-family: 'PT Sans', Arial, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.16em; line-height: 1.3; text-transform: uppercase; } .home-about__copy h2 { margin: 0; color: #ffffff; font-family: 'DM Serif Text', Georgia, serif; font-size: clamp(38px, 3.5vw, 52px); font-weight: 400; line-height: 1.1; } .home-about__copy > p:not(.home-about__eyebrow) { margin: 20px 0 0; color: rgba(255, 255, 255, 0.84); font-family: 'PT Sans', Arial, sans-serif; font-size: 18px; font-weight: 400; line-height: 1.65; } .home-about__proof { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 32px 0 0; padding: 0; list-style: none; } .home-about__proof li { min-width: 0; padding: 16px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 12px; background-color: rgba(255, 255, 255, 0.08); } .home-about__proof strong, .home-about__proof span { display: block; font-family: 'PT Sans', Arial, sans-serif; } .home-about__proof strong { color: #ffffff; font-size: 17px; font-weight: 700; line-height: 1.25; } .home-about__proof span { margin-top: 5px; color: rgba(255, 255, 255, 0.72); font-size: 13px; font-weight: 400; line-height: 1.35; } .home-about__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; } .home-about__primary-action, .home-about__primary-action:visited, .home-about__secondary-action, .home-about__secondary-action:visited { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 13px 20px; border-radius: 10px; font-family: 'PT Sans', Arial, sans-serif; font-size: 15px; font-weight: 700; line-height: 1.3; text-decoration: none; } .home-about__primary-action, .home-about__primary-action:visited { gap: 9px; border: 1px solid #ffffff; background-color: #ffffff; color: #193894; } .home-about__primary-action span { display: inline-block; font-size: 20px; line-height: 1; } .home-about__secondary-action, .home-about__secondary-action:visited { border: 1px solid rgba(255, 255, 255, 0.42); background-color: rgba(255, 255, 255, 0.04); color: #ffffff; } .home-about__primary-action:focus, .home-about__primary-action:focus-visible, .home-about__secondary-action:focus, .home-about__secondary-action:focus-visible { outline: 3px solid #ffffff; outline-offset: 4px; } @supports selector(:focus-visible) { .home-about__primary-action:focus:not(:focus-visible), .home-about__secondary-action:focus:not(:focus-visible) { outline: none; } } .home-about__media { position: relative; min-width: 0; aspect-ratio: 3 / 2; overflow: hidden; margin: 0; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 18px; background-color: #102044; box-shadow: 0 24px 60px rgba(6, 18, 47, 0.34); } .home-about__media::after { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(9, 23, 54, 0) 48%, rgba(9, 23, 54, 0.28) 100%); content: ""; pointer-events: none; } .home-about__media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; } .home-about__badge { position: absolute; z-index: 1; bottom: 18px; left: 18px; padding: 10px 14px; border-radius: 10px; background-color: #ffffff; box-shadow: 0 8px 24px rgba(6, 18, 47, 0.22); color: #193894; font-family: 'PT Sans', Arial, sans-serif; font-size: 14px; font-weight: 700; letter-spacing: 0.08em; line-height: 1; text-transform: uppercase; } @media (prefers-reduced-motion: no-preference) { .home-about__primary-action, .home-about__secondary-action, .home-about__primary-action span { transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; } } @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { .home-about__primary-action:hover { box-shadow: 0 10px 26px rgba(6, 18, 47, 0.22); transform: translateY(-2px); } .home-about__primary-action:hover span { transform: translateX(3px); } .home-about__secondary-action:hover { border-color: rgba(255, 255, 255, 0.7); background-color: rgba(255, 255, 255, 0.1); transform: translateY(-2px); } } @media all and (max-width: 960px) { #aboutcontent.home-about { padding: 72px 20px; } .home-about__inner { grid-template-columns: minmax(0, 1fr); gap: 48px; max-width: 760px; } .home-about__copy { max-width: none; } .home-about__media { aspect-ratio: 16 / 9; } } @media all and (max-width: 650px) { #aboutcontent.home-about { padding: 56px 16px; } .home-about__copy h2 { font-size: 36px; } .home-about__copy > p:not(.home-about__eyebrow) { font-size: 17px; line-height: 1.6; } .home-about__proof { gap: 8px; margin-top: 28px; } .home-about__proof li { padding: 12px 10px; } .home-about__proof strong { font-size: 15px; } .home-about__proof span { font-size: 12px; } .home-about__actions { flex-direction: column; } .home-about__primary-action, .home-about__secondary-action { width: 100%; } .home-about__badge { bottom: 14px; left: 14px; } } a.learn-more { background: #fff; border: 2px solid #fff !important; color: #001f84; font-weight: bold; padding: .5em 1em; border-radius: 0; text-transform: uppercase; font-size: 1.125rem; line-height: 6.75rem; } .benefits ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-flow: row wrap; justify-content: space-around; text-align: center; padding: 0; } .benefits li { list-style: none; margin: 0 2em; } .blognews ul { display: inline-block; padding: 0; margin: 0 auto; width: 100%; text-align: center; } .blognews li { display: inline-block; position: relative; background-color: #e6e6e6; margin: 5px; border: 6px #dadada solid; } .blognews a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 1em; width: 100px; line-height: 1.125; border: none; text-decoration: none; text-align: center; } .blognews { width: 90%; height: auto; padding: 50px 0px; overflow: hidden; margin: 0 auto; position: relative; } .rightcontent { background-color: #002395; padding-top: 100px; color: white; } @media screen and (min-width:768px) { #hero .caption h1 { font-size:2.5rem; } #hero .caption h2 { font-size:1.75rem; } } @media screen and (min-width:992px) { #hero .caption h1 { font-size:3rem; } #hero .caption h2 { font-size:2rem; } } @media screen and (max-width:1190px) { #headnav .container { display: none; } li.navitem1 { display: none; } div#headlogo { width: 100%; border-radius: 0; } .contactitems { text-align: left; padding-left: 70px; } } @media screen and (min-width:1200px) { #hero .caption h1 { font-size:4rem; } #hero .caption h2 { font-size:2.5rem; } } .footer-distributed{ background: #676767; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12); box-sizing: border-box; width: 100%; text-align: left; font: bold 16px sans-serif; padding: 55px 50px; } .footer-distributed .footer-left, .footer-distributed .footer-center, .footer-distributed .footer-right{ display: inline-block; vertical-align: top; }   .footer-distributed .footer-left{ width: 40%; }   .footer-distributed h3{ color: #ffffff; margin: 0; } .footer-distributed h3 span{ color: lightseagreen; }   .footer-distributed .footer-links{ color: #ffffff; margin: 20px 0 12px; padding: 0; } .footer-distributed .footer-links a{ display:inline-block; line-height: 1.8; font-weight:400; text-decoration: none; color: inherit; } .footer-distributed .footer-policy-links { margin: 0; padding: 0 24px 0 0; list-style: none; color: #fff; font-weight: 400; line-height: 1.6; } .footer-distributed .footer-policy-links li + li { margin-top: 4px; } .footer-distributed .footer-policy-links a { display: inline-block; max-width: 100%; padding: 4px 0; overflow-wrap: break-word; } .footer-distributed .footer-policy-links a, .footer-distributed .footer-policy-links a:visited, .footer-distributed .footer-policy-links a:hover, .footer-distributed .footer-policy-links a:focus, .footer-distributed .footer-policy-links a:active { color: #fff; font-weight: 400; } .footer-distributed .footer-policy-links a:hover, .footer-distributed .footer-policy-links a:focus-visible { text-decoration: underline; text-underline-offset: 3px; } .footer-distributed .footer-policy-links a:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }   .footer-distributed .footer-center{ width: 35%; } .footer-distributed .footer-center i{ background-color: #33383b; color: #ffffff; font-size: 25px; width: 38px; height: 38px; border-radius: 50%; text-align: center; line-height: 42px; margin: 10px 15px; vertical-align: middle; } .footer-distributed .footer-center i.fa-envelope{ font-size: 17px; line-height: 38px; } .footer-distributed .footer-center p{ display: inline-block; color: #ffffff; font-weight:400; vertical-align: middle; margin:0; } .footer-distributed .footer-center p span{ display:block; font-weight: normal; font-size:14px; line-height:2; } .footer-distributed .footer-center p a{ color: white; text-decoration: none;; } .footer-distributed .footer-links a:before { content: "|"; font-weight:300; font-size: 20px; left: 0; color: #fff; display: inline-block; padding-right: 5px; } .footer-distributed .footer-links .link-1:before { content: none; }   .footer-distributed .footer-right{ width: 20%; } .footer-distributed .footer-company-about{ line-height: 20px; color: white; font-size: 13px; font-weight: normal; margin: 0; } .footer-distributed .footer-company-about span{ display: block; color: #ffffff; font-size: 14px; font-weight: bold; margin-bottom: 5px; } .footer-distributed .footer-icons{ margin-top: 25px; } .footer-distributed .footer-icons a { display: inline-block; width: 70px; height: 70px; padding-top: 10px; cursor: pointer; background-color: #33383b; border-radius: 2px; font-size: 20px; color: #ffffff; text-align: center; line-height: 35px; margin-right: 3px; margin-bottom: 5px; }   @media (max-width: 880px) { .footer-distributed{ font: bold 14px sans-serif; } .footer-distributed .footer-left, .footer-distributed .footer-center, .footer-distributed .footer-right{ display: block; width: 100%; margin-bottom: 40px; text-align: center; } .footer-distributed .footer-center i{ margin-left: 0; } .footer-distributed .footer-policy-links { padding-right: 0; } } #hero1 { height:91%; width:100%; background:white; display:flex; align-items:center; justify-content: center; } #hero1::after { width:100%; height:85%; content: ''; position:absolute; z-index:10; top:0; left:0; background:rgba(0,0,0,0.5) } #hero1::after { width:100%; height:90%; content: ''; position:absolute; z-index:10; top:0; left:0; background:rgba(0,0,0,0.5) } #hero1 video { width:100%; height:100%; max-height: 85%; position:absolute; top:0; left:0; z-index:5; object-fit:cover; font-family:'object-fit: cover'; } #hero1 video1 { width:100%; height:100%; max-height: 85%; position:absolute; top:65px; left:0; z-index:5; object-fit:cover; font-family:'object-fit: cover'; } #hero1 .texture { width:100%; height:85%; position:absolute; top:0; left:0; z-index:15; background:url("/assets/performance/texture.db5f562ecd676efb.png"); } #hero1 .texture1 { width:100%; height:83%; position:absolute; top:65px; left:0; z-index:15; background:url("/assets/performance/texture.db5f562ecd676efb.png"); } #hero1 .caption { position:relative; z-index:20; text-align:center; color:#ffffff; } .headnav a:visited{ color:white; } a:visited{ color: #04278f; } #hero1 .caption h1 { font-size:4em; font-family: 'Oswald', sans-serif; margin-bottom:0.5rem; } #hero1 .caption h2 { font-weight:400; font-size:2rem; margin:0; font-family: 'PT Sans', sans-serif; } .borderimages { width: auto; display: inline-block; border: 5px solid #1e3f9a; } .benefits { margin: 0 auto; display:block; width:1510px; width: calc(100% - 5px); } div#searchresults { max-width: 1100px; margin: 0 auto; } main#search-page { width: 100%; min-height: 500px; padding: 78px 20px 50px; background-color: #ffffff; box-sizing: border-box; } div#products-header { position: relative; height: 95px; } div#header-loc { background-color: #1f3b8e !important; height: 140px !important; } div#background-header { background-image: url("/images/robotics-header.jpg"); height: 500px; background-position: right; } #container { margin: 0 auto; } #headnav .container { float: right; margin: 50px 5px 15px 18px; padding: 0px; } a { color: inherit; }     #nav, #nav ul, #nav li { margin: 0; padding: 0; border: 0; list-style: none; box-sizing: border-box; } #nav { position: relative; min-height: 60px; max-width: 100%; color: #000; } @media screen and (min-width: 650px) { #nav { display: inline-block; } } @media screen and (max-width: 650px) { #nav { display: block; background-color: #344fa2; } } #nav li { position: relative; } #nav a { text-decoration: none; height: 100%; display: block; padding: 0 12px; } @media screen and (min-width: 650px) { #nav a:focus { outline: none; } } .plusMark { margin-left: 10px; font-size: 20px; font-weight: 700; } .column-set .leftContact { box-sizing: border-box; width: 30%; float: left; display: inline-block; } .column-set .rightContact { box-sizing: border-box; width: 35%; float: right; display: inline-block; } @media screen and (min-width: 650px) { #nav li { text-align: left; width: 230px; height: 45px; font-size: 18px; } } @media screen and (max-width: 650px) { .column-set .rightContact { width: 100% !important; text-align: center; } .column-set .leftContact { width: 100% !important; text-align: center; } } @media screen and (max-width: 650px) { #nav li { text-align: center; width: 100%; } }   li.indusli { width: 230px !important; } @media screen and (min-width: 650px) { a + ul{ position: absolute; } a + ul:not(.js-showElement) { display: none; } } @media screen and (max-width: 650px) { a + ul { position: relative; } a + ul:not(.js-hideElement) { display: block; } }   #nav > ul, .fa { height: 100%; line-height: 60px; } #nav > ul > li { position: relative; text-align: center; } @media screen and (min-width: 650px) { #nav > ul > li { float: left; width: auto; height: 50px; } } @media screen and (max-width: 650px) { #nav > ul > li { float: none; display: block; width: 100%; } } #nav > ul > li > a { color: white; font-size: 21px; border-left: 3px solid #1e3f9a; height: 40px; line-height: 40px; } #nav > ul > li > a:hover, #nav > ul > li > a:focus, #nav > ul > li > a.js-openSubMenu { color: #528cb3; } @media screen and (min-width: 650px) { #nav > ul > li: not(: last-child) { border-right: 1px solid #D9BA31; border-bottom: none; } } @media screen and (max-width: 650px) { #nav > ul > li: not(: last-child) { border-right: none; } #nav > ul > li:not(:last-child):not(:first-child) { border-bottom: 1px solid #D9BA31; } } #nav > ul > li:not(#toggleMenu):not(.js-showElement) {   } @media screen and (max-width: 650px) { #nav > ul > li:not(#toggleMenu):not(.js-showElement) {   display: none; } } @media screen and (min-width: 650px) { #nav > ul > li: not(#toggleMenu): not(.js-showElement) { display: inline-block; } } @media screen and (max-width: 650px) { #nav > ul > li: not(#toggleMenu): not(.js-showElement) { display: none; } } @media screen and (min-width: 650px) { #nav #toggleMenu { display: none; } } @media screen and (max-width: 650px) { #nav #toggleMenu { display: block; width: 100%; } #nav #toggleMenu.js-open { border-bottom: 1px solid #D9BA31; } #nav #toggleMenu.js-open .fa-times { display: block; } #nav #toggleMenu.js-open .fa-bars { display: none; } #nav #toggleMenu.js-open a { background-color: #D9BA31; } #nav #toggleMenu:not(.js-open) .fa-times { display: none; } #nav #toggleMenu:not(.js-open) .fa-bars { display: block; } } span#toggleMenu-text { position: absolute; opacity: 0; }   #nav > ul > li > ul { background-color: #D9BA31; } @media screen and (min-width: 650px) { #nav > ul > li > ul { top: 50px; left: 0; border-bottom: 10px solid #193894; border-top: 10px solid #193894; } } @media screen and (max-width: 650px) { #nav > ul > li > ul { width: 100%; position: relative; } #nav > ul > li > ul:not(.js-showElement) { display: none; } } #nav > ul > li > ul > li > a { background-color: #676767; text-align: left; } #nav > ul > li > ul > li > a:hover, #nav > ul > li > ul > li > a:focus { background-color: #25396c; } #nav > ul > li > ul > li:not(:last-child) a { border-bottom: 1px solid #676767; border: 1px solid black; text-align: left; color: white; line-height: 2.7; } #nav > ul > li > ul > li:not(:last-child) a:after { content:''; position:absolute; top:-15px; bottom:-15px; left:-15px; right:-15px; } #nav > ul > li > ul > li a { color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; text-align: left; line-height: 2.7; } #nav > ul > li > ul > li a:after { content:''; position:absolute; top:-15px; bottom:-15px; left:-15px; right:-15px; } .navitem a:visited { color: white; }   @media screen and (min-width: 650px) { #nav > ul > li > ul > li > ul { top: 0; right: 200px;   } } @media screen and (max-width: 650px) { #nav > ul > li > ul > li > ul { width: 100%; position: relative; } #nav > ul > li > ul > li > ul:not(.js-showElement) { display: none; } } #nav > ul > li > ul > li > ul > li > a { background-color: #676767; } #nav > ul > li > ul > li > ul > li > a:hover, #nav > ul > li > ul > li > ul > li > a:focus { background-color: #25396c; } #nav > ul > li > ul > li > ul > li:not(:last-child) > a { border-bottom: 1px solid rgba(35,35,35,0.9); text-align: left; }   #nav .js-hideElement { display: none; } #nav .js-showElement { display: block; }   html.no-js li:hover > a + ul, html.no-js li:focus > a + ul { display: block; } @media screen and (max-width: 650px) { html.no-js #nav: hover > ul > li: not(#toggleMenu), html.no-js #nav: focus > ul > li: not(#toggleMenu) { display: block; } html.no-js #nav:hover li:hover > a + ul, html.no-js #nav:hover li:focus > a + ul, html.no-js #nav:focus li:hover > a + ul, html.no-js #nav:focus li:focus > a + ul { display: block; } } button.link { display: inline-block; position: relative; background-color: transparent; cursor: pointer; border: 0; padding: 0; color: #00f; text-decoration: underline; font: inherit; } div#center-head { width: 100%; margin: 0 auto; padding-left: 25px; padding-top: 4px; max-width: 1200px; } #center-head h1{ font-family: "DM Serif Text", serif; font-weight: 400; font-style: normal; font-size: 40px; padding: 30px 0px !important; }   @media screen and (max-width: 767px) { div#header-loc { height: auto !important; min-height: 140px; display: flow-root; } div#center-head { padding: 4px 24px 0; } #center-head h1 { font-size: clamp(26px, 5vw, 35px) !important; line-height: 1.2; padding: 25px 0 !important; overflow-wrap: anywhere; } } div#calloutsection { position: relative; width: 100%; height: auto; text-align: center; margin: 30px 5px 30px 5px; } .boxes { width: 30%; max-width: 230px; min-width: 200px; border: 2px solid #676767; background-color: black; height: 175px; margin: 10px; border-radius: 3px; display: inline-block; } .boxes:hover { opacity: 0.8; cursor: pointer; } .boximage { position: relative; height: 135px; width: 100%; } .boxdesc { position: relative; height: 40px; width: 100%; background-color: #00000075; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; color: white; font-weight: 800; } nav { margin: 0; }     .toggle + a, .menu { display: none; }   .toggle { display: block; font-weight: 600; padding:14px 20px; color:#FFF; font-size:17px; text-decoration:none; border:none; text-align: center; } .toggleMenu { display: block; font-weight: 600; padding: 14px 20px; color: white; font-size: 17px; background-color: #06060699; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; text-decoration: none; border: none; text-align: center; cursor: pointer; } a#second { background-color: #494949; } nav a#second:hover { background-color: #000000; }   [id^=drop]:checked + ul { display: block; text-align: center; }   nav ul li { display: block; width: 100%; } nav ul ul .toggle, nav ul ul a { padding: 14px 20px; color: #FFF; background-color: #212121; font-size: 17px; font-weight: 600; } label.toggle:focus { background-color: #003e95; cursor: pointer; } label.toggle:active { background-color: #003e95; cursor: pointer; } @media (max-width: 1190px){ .toggleMobileMenu { display: block; font-weight: 600; padding: 14px 20px; color: white; font-size: 17px; background-color: #333333e0; text-decoration: none; border: none; text-align: center; } .headnav-fixed-header { } } .toggle, [id^=drop] { display: none; } a, img, object, input { outline: none; } [id^=drop]:checked + ul { display: block; text-align: center; } @media (max-width: 1190px){ .toggle { display: block; font-weight: 600; padding: 14px 20px; color: #FFF; font-size: 17px; text-decoration: none; border: none; text-align: center; } div#headnav { display:none; } } mobilenav ul ul { float: none; position: static; color: #ffffff; } mobilenav { position: absolute; width: 100%; top: 147px; z-index: 5; } @media screen and (min-width: 1190px) { mobilenav { display: none; } } .toggle, [id^=drop] { display: none; }   mobilenav { margin:0; padding: 0; } #logo { display: block; padding: 0 30px; float: left; font-size:20px; line-height: 60px; }   mobilenav:after { content:""; display:table; clear:both; }   mobilenav ul { float: right; padding:0; margin:0; list-style: none; position: relative; }   mobilenav ul li { margin: 0px; display:inline-block; float: left; }   mobilenav a { display:block; padding:14px 20px; color:#FFF; font-size:17px; text-decoration:none; } mobilenav ul li ul li:hover { background: #000000; }   mobilenav a:hover { background-color: #000000; }   mobilenav ul ul { display: none; position: absolute;   top: 60px; }   mobilenav ul li:hover > ul { display:inherit; }   mobilenav ul ul li { width:170px; float:none; display:list-item; position: relative; }   mobilenav ul ul ul li { position: relative; top:-60px;   left:170px; }   li > a:after { content: ''; } li > a:only-child:after { content: ''; }   @media all and (max-width : 1190px) { #logo { display: block; padding: 0; width: 100%; text-align: center; float: none; } mobilenav { margin: 0; z-index: 101; }     .toggle + a, .menu { display: none; }   .toggle { display: block; font-weight: 600; padding:14px 20px; color:#FFF; font-size:17px; text-decoration:none; border:none; text-align: center; cursor: pointer; } a#first:visited { color:white; } a#second:visited{ color:white; } .toggleMenu { display: block; font-weight: 600; padding: 14px 20px; color: white; font-size: 17px; background-color: #060606ad; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; text-decoration: none; border: none; text-align: center; cursor: pointer; } ul.menu { background-color: #1f3b8ef2; } a#second { background-color: #494949; } mobilenav a#second:hover { background-color: #000000; }   [id^=drop]:checked + ul { display: block; text-align: center; width: 100%; }   mobilenav ul li { display: block; width: 100%; } mobilenav ul ul .toggle, mobilenav ul ul a { padding: 14px 20px; color: #FFF; background-color: #21212199; font-size: 17px; font-weight: 600; } label.toggle:focus { background-color: #003e95; cursor: pointer; } mobilenav ul ul ul a { padding: 0 80px; } mobilenav a:hover, mobilenav ul ul ul a { background-color: #000000; } mobilenav ul ul ul a { background-color: #002395; } mobilenav ul li ul li .toggle, mobilenav ul ul a, mobilenav ul ul ul a{ padding:14px 20px; color:#FFF; background-color: #545454b3; font-size:17px; font-weight: 600; } mobilenav ul li ul li .toggle, mobilenav ul ul a { background-color: #21212199; }   mobilenav ul ul { float: none; position:static; color: #ffffff;   }   mobilenav ul ul li:hover > ul, mobilenav ul li:hover > ul { display: none; }   mobilenav ul ul li { display: block; width: 100%; } mobilenav ul ul ul li { position: static;   } } dt { color: #002395; font-weight: 600; font-size: 26px; } dl { margin-bottom: 15px; } dd { text-indent: 15px; } .column-set .left { box-sizing: border-box; width: 50%; float: left; } .column-set .right { box-sizing: border-box; width: 45%; float: right; } .home-services, .home-services * { box-sizing: border-box; } .home-services { position: relative; height: auto; min-height: 0; margin-top: 0; padding: clamp(72px, 8vw, 112px) 20px; background-color: #ffffff; transition: none; } .home-services__inner { width: 100%; max-width: 1280px; margin: 0 auto; } .home-services__header { max-width: 880px; margin: 0 auto; text-align: center; } .home-services__eyebrow { margin: 0 0 10px; color: #193894; font-family: 'PT Sans', Arial, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.16em; line-height: 1.3; text-transform: uppercase; } .home-services__header h2 { margin: 0; color: #14213d; font-family: 'DM Serif Text', Georgia, serif; font-size: clamp(36px, 3.4vw, 50px); font-weight: 400; line-height: 1.1; } .home-services__intro { max-width: 840px; margin: 18px auto 0; color: #566176; font-family: 'PT Sans', Arial, sans-serif; font-size: 18px; line-height: 1.65; } .home-services__header::after { display: block; width: 64px; height: 3px; margin: 26px auto 0; border-radius: 999px; background-color: #193894; content: ""; } .home-services__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(22px, 2.2vw, 30px); width: 100%; margin: clamp(42px, 5vw, 60px) 0 0; padding: 0; list-style: none; } .home-service-card, .home-service-card__surface { min-width: 0; height: 100%; } .home-service-card__surface { overflow: visible; border: 1px solid #dbe3ef; border-radius: 16px; background-color: #ffffff; box-shadow: 0 10px 30px rgba(15, 36, 79, 0.08); } .home-service-card__link, .home-service-card__link:visited { display: flex; flex-direction: column; min-width: 0; height: 100%; overflow: hidden; border-radius: 16px; color: #17233d; text-decoration: none; } .home-service-card__link:focus, .home-service-card__link:focus-visible { outline: 3px solid #193894; outline-offset: 4px; } @supports selector(:focus-visible) { .home-service-card__link:focus:not(:focus-visible) { outline: none; } } .home-service-card__surface:focus-within { border-color: #8fa4dd; box-shadow: 0 14px 38px rgba(15, 36, 79, 0.16); } .home-service-card__media { position: relative; flex: 0 0 auto; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-bottom: 1px solid #e5eaf2; background-color: #e8edf4; } .home-service-card__media::after { position: absolute; right: 0; bottom: 0; left: 0; height: 26%; background: linear-gradient(180deg, rgba(15, 30, 63, 0), rgba(15, 30, 63, 0.1)); content: ""; pointer-events: none; } .home-service-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; } .home-service-card__body { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; min-width: 0; min-height: 220px; padding: 26px; text-align: left; } .home-service-card__body h3 { margin: 0; color: #17233d; font-family: 'DM Serif Text', Georgia, serif; font-size: 26px; font-weight: 400; line-height: 1.2; overflow-wrap: anywhere; } .home-service-card__body p { margin: 12px 0 0; color: #566176; font-family: 'PT Sans', Arial, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.55; } .home-service-card__cta { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 24px; color: #193894; font-family: 'PT Sans', Arial, sans-serif; font-size: 15px; font-weight: 700; line-height: 1.3; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; } .home-service-card__cta span { display: inline-block; font-size: 20px; line-height: 1; } @media (prefers-reduced-motion: no-preference) { .home-service-card__surface, .home-service-card__media img, .home-service-card__cta span { transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; } } @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { .home-service-card:hover .home-service-card__surface { border-color: #a9b8df; box-shadow: 0 18px 44px rgba(15, 36, 79, 0.16); transform: translateY(-6px); } .home-service-card:hover .home-service-card__media img { transform: scale(1.035); } .home-service-card:hover .home-service-card__cta span { transform: translateX(4px); } } @media all and (max-width: 960px) { .home-services__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px; margin-right: auto; margin-left: auto; } } @media all and (max-width: 650px) { .home-services { padding: 56px 16px; } .home-services__header h2 { font-size: 36px; } .home-services__intro { font-size: 17px; line-height: 1.55; } .home-services__grid { grid-template-columns: minmax(0, 1fr); gap: 22px; max-width: 520px; } .home-service-card__body { min-height: 200px; padding: 22px; } .home-service-card__body h3 { font-size: 24px; } } .news-section { position: relative; overflow: hidden; height: auto; min-height: 0; margin-top: 0; padding: clamp(64px, 7vw, 96px) 20px; border-top: 1px solid #e1e7f0; background: linear-gradient(180deg, #f8fafc 0%, #eef3f9 100%); } .news-section::before { position: absolute; top: -190px; right: -160px; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(25, 56, 148, 0.12) 0%, rgba(25, 56, 148, 0) 70%); content: ""; pointer-events: none; } .news-section__inner { position: relative; z-index: 1; width: 100%; max-width: 1600px; margin: 0 auto; } .news-section__header { max-width: 680px; margin: 0 auto; text-align: center; } .news-section__eyebrow { margin: 0 0 10px; color: #193894; font-family: 'PT Sans', Arial, sans-serif; font-size: 13px; font-weight: 700; letter-spacing: 0.16em; line-height: 1.3; text-transform: uppercase; } .news-section__header h2 { margin: 0; color: #14213d; font-family: 'DM Serif Text', Georgia, serif; font-size: clamp(36px, 3.2vw, 48px); font-weight: 400; line-height: 1.1; } .news-section__intro { max-width: 620px; margin: 16px auto 0; color: #566176; font-family: 'PT Sans', Arial, sans-serif; font-size: 18px; line-height: 1.6; } .news-section__header::after { display: block; width: 64px; height: 3px; margin: 24px auto 0; border-radius: 999px; background-color: #193894; content: ""; } ul#calloutsection.blog-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(20px, 2vw, 28px); width: 100%; max-width: none; margin: clamp(38px, 5vw, 56px) auto 0; padding: 0; list-style: none; } .blog-card-item, .blog-card__surface { min-width: 0; height: 100%; } .blog-card__surface { overflow: visible; border: 1px solid #dbe3ef; border-radius: 16px; background-color: #ffffff; box-shadow: 0 10px 30px rgba(15, 36, 79, 0.08); } .blog-card, .blog-card:visited { display: flex; flex-direction: column; min-width: 0; height: 100%; overflow: hidden; border-radius: 16px; color: #17233d; text-decoration: none; } .blog-card:focus-visible { outline: 3px solid #193894; outline-offset: 4px; } .blog-card__surface:focus-within { border-color: #8fa4dd; box-shadow: 0 14px 38px rgba(15, 36, 79, 0.16); } .blog-card__media { position: relative; flex: 0 0 auto; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background-color: #e8edf4; background-position: center; background-repeat: no-repeat; background-size: cover; } .blog-card__media::after { position: absolute; right: 0; bottom: 0; left: 0; height: 32%; background: linear-gradient(180deg, rgba(15, 30, 63, 0), rgba(15, 30, 63, 0.16)); content: ""; pointer-events: none; } .blog-card__badge { position: absolute; z-index: 1; top: 14px; right: 14px; padding: 7px 12px; border-radius: 999px; background-color: #193894; box-shadow: 0 4px 12px rgba(15, 36, 79, 0.22); color: #ffffff; font-family: 'PT Sans', Arial, sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; line-height: 1; text-transform: uppercase; } .blog-card__content { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; min-width: 0; min-height: 190px; padding: 24px; text-align: left; } .blog-card__category { margin: 0 0 10px; color: #3453a4; font-family: 'PT Sans', Arial, sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.11em; line-height: 1.3; text-transform: uppercase; } .blog-card__title { margin: 0; color: #17233d; font-family: 'PT Sans', Arial, sans-serif; font-size: clamp(19px, 1.25vw, 21px); font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; } .blog-card__cta { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 24px; color: #193894; font-family: 'PT Sans', Arial, sans-serif; font-size: 15px; font-weight: 700; line-height: 1.3; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; } .blog-card__cta span { display: inline-block; font-size: 20px; line-height: 1; } .productboxes { width: 45%; max-width: 475px; min-width: 200px; border: 2px solid #676767; background-color: black; margin: 10px; border-radius: 3px; display: inline-block; } .productboximage { position: relative; height: 218px; width: 100%; } @media (prefers-reduced-motion: no-preference) { .blog-card__surface, .blog-card__media, .blog-card__cta span { transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; } } @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { .blog-card-item:hover .blog-card__surface { border-color: #a9b8df; box-shadow: 0 18px 44px rgba(15, 36, 79, 0.16); transform: translateY(-6px); } .blog-card-item:hover .blog-card__media { transform: scale(1.025); } .blog-card-item:hover .blog-card__cta span { transform: translateX(4px); } } @media all and (max-width : 1190px) { ul#calloutsection.blog-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 1000px; } .productboxes { width: 90%; max-width: 475px; border: 2px solid #676767; background-color: black; margin: 10px; border-radius: 3px; display: inline-block; } } @media all and (max-width : 650px) { .news-section { padding: 56px 16px; } .news-section__header h2 { font-size: 36px; } .news-section__intro { font-size: 17px; line-height: 1.5; } ul#calloutsection.blog-card-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; max-width: 500px; } .blog-card__content { min-height: 170px; padding: 21px; } } div#blogpostboxes { width: 80%; background-color: #1f3b8e0d; height: 100%; padding: 30px 15px; margin: 0 auto; }   .container1.pacific-contact-form-container { float: right; width: 360px; max-width: 100%; margin: 20px 0 32px; } .pacific-contact-form-panel { width: 100%; padding: 24px; border: 1px solid #d3dce9; border-top: 4px solid #04278f; border-radius: 8px; background: #fff; box-shadow: 0 6px 24px rgba(23, 45, 88, .08); box-sizing: border-box; container-type: inline-size; container-name: pacific-contact; } .pacific-contact-form-panel .pacific-contact-form-title, .equipment-page #MainWrapper .pacific-contact-form-panel .pacific-contact-form-title { margin: 0 0 6px; scroll-margin-top: 110px; color: #04278f; font-family: inherit; font-size: 26px; font-weight: 700; line-height: 1.25; } .pacific-contact-form-panel .pacific-contact-form-intro { margin: 0; color: #454545; font-size: 18px; line-height: 1.5; } .pacific-contact-form-header { margin-bottom: 20px; padding-bottom: 18px; border-bottom: 1px solid #e1e6ee; } .pacific-contact-form .pacific-contact-required-note { margin: 0 0 20px; color: #454545; font-size: 15px; line-height: 1.5; } .pacific-contact-form-panel .pacific-contact-required { color: #bc2026; } .pacific-contact-form .pacific-contact-optional { color: #454545; font-size: 16px; font-weight: normal; } .pacific-contact-form fieldset { border: 0; min-width: 0; margin: 0 0 24px; padding: 0; } .pacific-contact-form legend { display: block; width: 100%; padding: 0; margin-bottom: 14px; color: #243959; font-size: 20px; font-weight: 700; line-height: 1.4; } .pacific-contact-form .pacific-contact-field { min-width: 0; margin: 0 0 16px; } .pacific-contact-form .pacific-contact-group > .pacific-contact-field:last-child { margin-bottom: 0; } .pacific-contact-name-row { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 16px; } @container pacific-contact (min-width: 460px) { .pacific-contact-name-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .pacific-contact-form label { display: block; margin-bottom: 6px; font-size: 18px; font-weight: bold; line-height: 1.4; } .pacific-contact-form input, .pacific-contact-form textarea { display: block; width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #969dad; border-radius: 4px; background: #fff; color: #171717; font-family: inherit; font-size: 18px; line-height: 1.4; box-sizing: border-box; scroll-margin-top: 130px; } .pacific-contact-form input[type="hidden"] { display: none; } .pacific-contact-form textarea { min-height: 150px; max-width: 100%; resize: vertical; } .pacific-contact-form .pacific-contact-hint, .pacific-contact-form .pacific-contact-field-error { display: block; margin-top: 5px; font-size: 15px; line-height: 1.4; } .pacific-contact-form .pacific-contact-hint { color: #454545; } .pacific-contact-form #pacific-message-hint { margin: 0 0 8px; } .pacific-contact-form .pacific-contact-count { text-align: right; } .pacific-contact-form [hidden] { display: none; } .pacific-contact-form .pacific-contact-field-error { color: #a01d23; } .pacific-contact-form .pacific-contact-field-error[hidden] { display: none; } .pacific-contact-form [aria-invalid="true"] { border-color: #a01d23; } .pacific-contact-form input:focus, .pacific-contact-form textarea:focus, .pacific-contact-form #submitBtn:focus-visible, .pacific-contact-form .pacific-contact-feedback:focus { outline: 2px solid #04278f; outline-offset: 3px; } .pacific-contact-form-title:focus-visible, .pacific-contact-form a:focus-visible, .pacific-contact-inquiry a:focus-visible { outline: 2px solid #04278f; outline-offset: 4px; } .pacific-contact-form .pacific-contact-actions { padding-top: 20px; border-top: 1px solid #e1e6ee; } .pacific-contact-form .pacific-contact-actions > .form-error { margin: 0 0 12px; color: #8c2025; font-size: 16px; line-height: 1.5; } .pacific-contact-form .pacific-contact-submit { margin: 20px 0 0; } .pacific-contact-form #submitBtn { display: block; width: 100%; height: auto; min-height: 48px; margin: 0; padding: 12px 16px; box-sizing: border-box; font-family: inherit; font-size: 16px; font-weight: bold; line-height: 1.4; white-space: normal; cursor: pointer; border-radius: 4px; } .pacific-contact-form #submitBtn:hover:not(:disabled) { background: #173d9e; } .pacific-contact-form #submitBtn:disabled { cursor: wait; opacity: .7; } .pacific-contact-form .pacific-contact-feedback { scroll-margin-top: 110px; font-size: 17px; line-height: 1.5; overflow-wrap: anywhere; } .pacific-contact-form .pacific-contact-feedback > div { margin-top: 16px; padding: 12px; border: 1px solid #b6c7d9; border-radius: 2px; background: #f3f6fa; color: #233c58; } .pacific-contact-form .pacific-contact-feedback .success { border-color: #95bca8; background: #f2f8f4; color: #205639; } .pacific-contact-form .pacific-contact-feedback .error { border-color: #d4a4a7; background: #fff6f6; color: #8c2025; } .pacific-contact-form .pacific-contact-alternative, .pacific-contact-form .pacific-contact-privacy { margin: 16px 0 0; color: #454545; font-size: 16px; line-height: 1.6; text-align: center; } .pacific-contact-form .pacific-contact-privacy { margin-top: 4px; font-size: 15px; } .pacific-contact-form a { width: auto; height: auto; color: #04278f; text-decoration: underline; text-underline-offset: 3px; } .pacific-contact-inquiry { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 20px; margin: 18px 0 24px; font-size: 18px; line-height: 1.5; } .pacific-contact-inquiry .pacific-contact-inquiry-link, .pacific-contact-inquiry .pacific-contact-inquiry-phone { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; width: auto; height: auto; max-width: 100%; padding: 8px 14px; border: 1px solid #c5d0e3; border-radius: 4px; background: #f4f7fc; color: #04278f; font-size: 18px; font-weight: 700; line-height: 1.4; text-align: left; text-decoration: underline; text-underline-offset: 3px; box-sizing: border-box; } .pacific-contact-inquiry .pacific-contact-inquiry-phone { background: #04278f; color: #fff; border-color: #04278f; } .pacific-contact-inquiry a:hover { border-color: #04278f; } @media screen and (min-width: 969px) { #content:has(> .pacific-contact-form-container) > #content-body { width: calc(100% - 400px); } }   .equipment-page #LastContain { display: block; height: auto; min-height: 864px; } .equipment-page #LastPart { display: flow-root; padding: 24px 32px; box-sizing: border-box; } .equipment-page #LastImage { position: relative; float: left; width: calc(100% - 400px); padding: 20px 0; box-sizing: border-box; } @media screen and (max-width: 968px) { .container1.pacific-contact-form-container { clear: both; float: none; width: 100%; max-width: 560px; margin: 0 auto 32px; padding-top: 32px; } .pacific-contact-form-panel { width: 100%; padding: 22px; } .equipment-page #LastContain { min-height: 0; } .equipment-page #LastImage { position: relative; float: none; width: auto; min-height: 0; max-width: 700px; margin: 0 auto; padding: 0; } .equipment-page #LastPart { padding: 24px 20px; } } @media screen and (max-width: 380px) { .pacific-contact-form-panel { padding: 18px 16px; } }   .blog-index, .blog-index * { box-sizing: border-box; } main.blog-index { min-height: 0; margin-top: 53px; overflow: hidden; background-color: #f6f8fc; color: #17233d; font-family: 'PT Sans', Arial, sans-serif; } .blog-index section { height: auto; min-height: 0; margin-top: 0; transition: none; } .blog-index-hero { position: relative; isolation: isolate; overflow: hidden; padding: clamp(68px, 8vw, 112px) 24px; background: linear-gradient(135deg, #102451 0%, #193894 58%, #3157ae 100%); } .blog-index-hero::before, .blog-index-hero::after { position: absolute; z-index: -1; border-radius: 50%; content: ""; pointer-events: none; } .blog-index-hero::before { top: -240px; right: -170px; width: 560px; height: 560px; border: 1px solid rgba(255, 255, 255, 0.14); background: radial-gradient(circle, rgba(255, 255, 255, 0.14) 0%, rgba(255, 255, 255, 0) 68%); } .blog-index-hero::after { bottom: -330px; left: -230px; width: 620px; height: 620px; background: radial-gradient(circle, rgba(96, 151, 255, 0.25) 0%, rgba(96, 151, 255, 0) 68%); } .blog-index-hero__inner, .blog-index-library__inner { width: 100%; max-width: 1280px; margin: 0 auto; } .blog-index-hero__inner { display: grid; grid-template-columns: minmax(0, 0.86fr) minmax(480px, 1.14fr); gap: clamp(42px, 6vw, 82px); align-items: center; } .blog-index__eyebrow { margin: 0 0 14px; color: #5570bd; font-size: 13px; font-weight: 700; letter-spacing: 0.16em; line-height: 1.3; text-transform: uppercase; } .blog-index-hero .blog-index__eyebrow { color: #b9c9f5; } .blog-index-hero__copy h1 { margin: 0; color: #ffffff; font-family: 'DM Serif Text', Georgia, serif; font-size: clamp(54px, 6.2vw, 82px); font-weight: 400; letter-spacing: -0.025em; line-height: 0.98; } .blog-index-hero__lead { max-width: 560px; margin: 22px 0 0; color: #ffffff; font-family: 'DM Serif Text', Georgia, serif; font-size: clamp(28px, 2.5vw, 38px); font-weight: 400; line-height: 1.15; } .blog-index-hero__intro { max-width: 570px; margin: 20px 0 0; color: #dbe4fb; font-size: clamp(17px, 1.5vw, 19px); line-height: 1.65; } .blog-index-topics { display: flex; flex-wrap: wrap; gap: 10px; margin: 30px 0 0; padding: 0; list-style: none; } .blog-index-topics li { margin: 0; padding: 9px 14px; border: 1px solid rgba(255, 255, 255, 0.24); border-radius: 999px; background-color: rgba(255, 255, 255, 0.08); color: #ffffff; font-size: 14px; font-weight: 700; line-height: 1; } .blog-index-feature { min-width: 0; overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 22px; background-color: #ffffff; box-shadow: 0 28px 70px rgba(4, 17, 47, 0.32); } .blog-index-feature__link, .blog-index-feature__link:visited { display: flex; height: 100%; flex-direction: column; color: #17233d; text-decoration: none; } .blog-index-feature__link:focus-visible, .blog-index-card__link:focus-visible, .blog-index-contact__button:focus-visible { outline: 3px solid #84a2f4; outline-offset: 4px; } .blog-index-feature__media { position: relative; width: 100%; aspect-ratio: 16 / 8.25; overflow: hidden; background-color: #dce7ed; } .blog-index-feature__media::after, .blog-index-card__media::after { position: absolute; right: 0; bottom: 0; left: 0; height: 34%; background: linear-gradient(180deg, rgba(11, 26, 59, 0), rgba(11, 26, 59, 0.18)); content: ""; pointer-events: none; } .blog-index-feature__media img, .blog-index-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; } .blog-index-feature__badge { position: absolute; z-index: 1; top: 18px; left: 18px; padding: 8px 13px; border-radius: 999px; background-color: #ffffff; box-shadow: 0 5px 18px rgba(15, 36, 79, 0.2); color: #193894; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; line-height: 1; text-transform: uppercase; } .blog-index-feature__body { padding: clamp(24px, 3vw, 34px); text-align: left; } .blog-index-feature__meta { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0 0 12px; color: #5570bd; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; line-height: 1.3; text-transform: uppercase; } .blog-index-feature__meta time { position: relative; color: #697489; } .blog-index-feature__meta time::before { position: absolute; top: 50%; left: -12px; width: 3px; height: 3px; border-radius: 50%; background-color: #9ba6b9; content: ""; transform: translateY(-50%); } .blog-index-feature__body h2 { margin: 0; color: #14213d; font-family: 'DM Serif Text', Georgia, serif; font-size: clamp(26px, 2.2vw, 34px); font-weight: 400; line-height: 1.16; } .blog-index-feature__body > p { margin: 14px 0 0; color: #596579; font-size: 16px; line-height: 1.55; } .blog-index__cta { display: inline-flex; align-items: center; gap: 9px; margin-top: 22px; color: #193894; font-size: 15px; font-weight: 700; line-height: 1.3; } .blog-index__cta span, .blog-index-contact__button span { display: inline-block; font-size: 20px; line-height: 1; } .blog-index-library { position: relative; padding: clamp(72px, 8vw, 112px) 24px; background: linear-gradient(180deg, #f8fafc 0%, #eef3f9 100%); } .blog-index-library__header { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr); gap: 48px; align-items: end; } .blog-index-library__header h2, .blog-index-contact h2 { margin: 0; color: #14213d; font-family: 'DM Serif Text', Georgia, serif; font-size: clamp(36px, 4vw, 52px); font-weight: 400; letter-spacing: -0.015em; line-height: 1.08; } .blog-index-library__header > p { max-width: 520px; margin: 0; color: #596579; font-size: 18px; line-height: 1.6; } .blog-index-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: clamp(40px, 5vw, 60px) 0 0; padding: 0; list-style: none; } .blog-index-grid > li, .blog-index-card { min-width: 0; height: 100%; } .blog-index-card { overflow: hidden; border: 1px solid #dbe3ef; border-radius: 18px; background-color: #ffffff; box-shadow: 0 10px 30px rgba(15, 36, 79, 0.08); } .blog-index-card__link, .blog-index-card__link:visited { display: flex; height: 100%; flex-direction: column; color: #17233d; text-decoration: none; } .blog-index-card__media { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-bottom: 1px solid #e3e9f2; background-color: #e8edf4; } .blog-index-card__body { display: flex; flex: 1 1 auto; flex-direction: column; align-items: flex-start; min-width: 0; min-height: 284px; padding: 26px; text-align: left; } .blog-index-card__category { margin: 0 0 11px; color: #5570bd; font-size: 12px; font-weight: 700; letter-spacing: 0.11em; line-height: 1.3; text-transform: uppercase; } .blog-index-card__body h3 { margin: 0; color: #17233d; font-family: 'DM Serif Text', Georgia, serif; font-size: clamp(23px, 2vw, 27px); font-weight: 400; line-height: 1.18; overflow-wrap: anywhere; } .blog-index-card__body > p:not(.blog-index-card__category) { margin: 14px 0 0; color: #596579; font-size: 16px; line-height: 1.55; } .blog-index-card .blog-index__cta { margin-top: auto; padding-top: 24px; } .blog-index-contact { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 40px; overflow: hidden; margin-top: clamp(64px, 8vw, 96px); padding: clamp(34px, 5vw, 54px); border-radius: 22px; background: linear-gradient(125deg, #142958 0%, #244ba3 100%); box-shadow: 0 20px 50px rgba(15, 36, 79, 0.2); color: #ffffff; } .blog-index-contact::after { position: absolute; top: -180px; right: -120px; width: 360px; height: 360px; border: 1px solid rgba(255, 255, 255, 0.13); border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0) 70%); content: ""; pointer-events: none; } .blog-index-contact__copy { position: relative; z-index: 1; max-width: 720px; } .blog-index-contact .blog-index__eyebrow { color: #b9c9f5; } .blog-index-contact h2 { color: #ffffff; font-size: clamp(32px, 3.5vw, 45px); } .blog-index-contact__copy > p:last-child { margin: 12px 0 0; color: #dbe4fb; font-size: 17px; line-height: 1.55; } .blog-index-contact__button, .blog-index-contact__button:visited { position: relative; z-index: 1; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 14px 20px; border-radius: 10px; background-color: #ffffff; box-shadow: 0 8px 22px rgba(4, 17, 47, 0.2); color: #193894; font-size: 15px; font-weight: 700; line-height: 1.2; text-decoration: none; } @media (prefers-reduced-motion: no-preference) { .blog-index-feature, .blog-index-card, .blog-index-feature__media img, .blog-index-card__media img, .blog-index__cta span, .blog-index-contact__button, .blog-index-contact__button span { transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; } } @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { .blog-index-feature:hover { box-shadow: 0 34px 78px rgba(4, 17, 47, 0.4); transform: translateY(-5px); } .blog-index-feature:hover .blog-index-feature__media img, .blog-index-card:hover .blog-index-card__media img { transform: scale(1.035); } .blog-index-card:hover { border-color: #a9b8df; box-shadow: 0 18px 44px rgba(15, 36, 79, 0.16); transform: translateY(-6px); } .blog-index-feature:hover .blog-index__cta span, .blog-index-card:hover .blog-index__cta span, .blog-index-contact__button:hover span { transform: translateX(4px); } .blog-index-contact__button:hover { box-shadow: 0 12px 28px rgba(4, 17, 47, 0.3); transform: translateY(-2px); } } @media screen and (max-width: 1040px) { .blog-index-hero__inner { grid-template-columns: minmax(0, 1fr); max-width: 900px; } .blog-index-hero__copy { max-width: 720px; } .blog-index-feature__link { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr); } .blog-index-feature__media { height: 100%; min-height: 360px; aspect-ratio: auto; } .blog-index-feature__body { display: flex; flex-direction: column; justify-content: center; } .blog-index-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media screen and (max-width: 800px) { .blog-index-library__header { grid-template-columns: minmax(0, 1fr); gap: 20px; } .blog-index-library__header > p { max-width: 650px; } .blog-index-contact { align-items: flex-start; flex-direction: column; } } @media screen and (max-width: 680px) { main.blog-index { margin-top: 53px; } .blog-index-hero, .blog-index-library { padding-right: 16px; padding-left: 16px; } .blog-index-hero__copy h1 { font-size: 54px; } .blog-index-hero__lead { font-size: 30px; } .blog-index-feature__link { display: flex; } .blog-index-feature__media { min-height: 0; aspect-ratio: 16 / 9; } .blog-index-feature__body h2 { font-size: 27px; } .blog-index-feature__meta time::before { display: none; } .blog-index-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; max-width: 520px; margin-right: auto; margin-left: auto; } .blog-index-card__body { min-height: 260px; padding: 23px; } .blog-index-contact { padding: 30px 24px; } .blog-index-contact__button { width: 100%; } }   .search-page { color: #172235; font-family: "PT Sans", Arial, sans-serif; } main#search-page.search-page { min-height: 620px; padding: clamp(64px, 8vw, 104px) 20px clamp(64px, 8vw, 96px); background: #ffffff; } .search-page__inner { width: 100%; max-width: 1040px; margin: 0 auto; } .search-page__header { max-width: 790px; margin-bottom: 32px; } .search-page__eyebrow, .search-result__section { margin: 0 0 9px; color: #3453ad; font-size: 14px; font-weight: 700; letter-spacing: 0.1em; line-height: 1.35; text-transform: uppercase; } .search-page__header h1 { margin: 0; color: #102a66; font-family: "DM Serif Text", Georgia, serif; font-size: clamp(38px, 5vw, 60px); font-weight: 400; letter-spacing: -0.02em; line-height: 1.08; overflow-wrap: anywhere; } .search-page__header h1 span { color: #3453ad; } .search-page__header > p:last-child { max-width: 720px; margin: 18px 0 0; color: #4d5b70; font-size: 19px; line-height: 1.6; } .search-page__form { margin: 0 0 34px; padding: clamp(20px, 3vw, 30px); background: #f3f6fb; border: 1px solid #dce4f0; border-radius: 10px; } .search-page__form > label { display: block; margin: 0 0 9px; color: #20345f; font-size: 16px; font-weight: 700; } .search-page__field { display: flex; align-items: stretch; width: 100%; } .search-page__field input[type="search"] { flex: 1 1 auto; min-width: 0; height: 56px; margin: 0; padding: 0 17px; color: #172235; background: #ffffff; border: 1px solid #aebbd0; border-right: 0; border-radius: 5px 0 0 5px; box-sizing: border-box; font: 400 18px/56px "PT Sans", Arial, sans-serif; outline: 0; -webkit-appearance: none; appearance: none; } .search-page__field input[type="search"]::placeholder { color: #6d788a; opacity: 1; } .search-page__field button { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; min-width: 138px; height: 56px; margin: 0; padding: 0 24px; gap: 9px; color: #ffffff; background: #24449f; border: 1px solid #24449f; border-radius: 0 5px 5px 0; box-sizing: border-box; font-size: 17px; font-weight: 700; line-height: 1; cursor: pointer; } .search-page__field button:hover { background: #16347f; border-color: #16347f; } .search-page__field button svg { width: 19px; height: 19px; fill: currentColor; } .search-page__field input[type="search"]:focus-visible, .search-page__field button:focus-visible, .search-page a:focus-visible, .site-search-form button:focus-visible { position: relative; z-index: 2; outline: 3px solid #f4b942; outline-offset: 2px; } div#searchresults.search-results { max-width: none; margin: 0; } .search-results__summary { margin: 0; padding: 0 0 17px; color: #526078; border-bottom: 1px solid #dce4f0; font-size: 16px; font-weight: 700; } .search-results__list { margin: 0; padding: 0; list-style: none; } .search-results__list > li { margin: 0; padding: 0; border-bottom: 1px solid #dce4f0; } .search-result { padding: 28px 2px 30px; } .search-result__section { margin-bottom: 7px; font-size: 12px; } .search-result h2 { margin: 0; font-family: "PT Sans", Arial, sans-serif; font-size: clamp(23px, 3vw, 29px); font-weight: 700; line-height: 1.25; } .search-result h2 a { color: #173b91; text-decoration: none; } .search-result h2 a:hover { color: #0b286c; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; } .search-result__snippet { max-width: 850px; margin: 11px 0 13px; color: #3f4c61; font-size: 17px; line-height: 1.62; } .search-result mark { padding: 0 0.08em; color: inherit; background: #ffe89a; border-radius: 2px; } .search-result__link { display: inline-flex; align-items: center; gap: 6px; color: #24449f; font-size: 15px; font-weight: 700; text-decoration: none; } .search-result__link:hover { text-decoration: underline; text-underline-offset: 3px; } .search-state { padding: clamp(28px, 5vw, 48px); background: #f7f9fc; border: 1px solid #dce4f0; border-left: 5px solid #3453ad; border-radius: 6px; } .search-state--warning { border-left-color: #c27a18; } .search-state h2 { margin: 0 0 10px; color: #17336f; font-family: "DM Serif Text", Georgia, serif; font-size: clamp(26px, 3vw, 34px); font-weight: 400; } .search-state p { max-width: 720px; margin: 0; color: #4d5b70; font-size: 17px; line-height: 1.6; overflow-wrap: anywhere; } .search-state p a { color: #173b91; font-weight: 700; } .search-state__suggestions, .search-state__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 22px; } .search-state__suggestions a, .search-state__actions a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; color: #173b91; background: #ffffff; border: 1px solid #aebbd0; border-radius: 999px; box-sizing: border-box; font-weight: 700; text-decoration: none; } .search-state__suggestions a:hover, .search-state__actions a:hover { background: #eaf0fb; border-color: #3453ad; } .search-state__actions a.search-state__primary { color: #ffffff; background: #24449f; border-color: #24449f; } .search-state__actions a.search-state__primary:hover { background: #16347f; } .search-pagination { display: flex; align-items: center; justify-content: center; min-height: 46px; margin-top: 34px; gap: 18px; } .search-pagination__pages { display: flex; align-items: center; gap: 7px; } .search-pagination a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 7px 12px; color: #173b91; border: 1px solid #b7c2d4; border-radius: 4px; box-sizing: border-box; font-weight: 700; text-decoration: none; } .search-pagination a:hover, .search-pagination a[aria-current="page"] { color: #ffffff; background: #24449f; border-color: #24449f; } @media all and (max-width: 1190px) { mobilenav ul li.mobile-search-item { padding: 14px 16px; background: #152f7b; box-sizing: border-box; } .site-search-form--mobile { float: none; max-width: 620px; height: 46px; margin: 0 auto; text-align: left; } .site-search-form--mobile input[type="search"], .site-search-form--mobile button { height: 44px; } } @media screen and (max-width: 640px) { main#search-page.search-page { padding: 48px 16px 64px; } .search-page__header > p:last-child { font-size: 17px; } .search-page__field { display: block; } .search-page__field input[type="search"] { width: 100%; border-right: 1px solid #aebbd0; border-radius: 5px; } .search-page__field button { width: 100%; margin-top: 10px; border-radius: 5px; } .search-pagination { flex-wrap: wrap; gap: 10px; } .search-pagination__direction { flex: 1 1 130px; } .search-pagination__pages { order: -1; flex-basis: 100%; justify-content: center; } }
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}
@font-face { font-weight: normal; font-style: normal; font-family: 'codropsicons'; src:url("/fonts/codropsicons/codropsicons.eot"); src:url("/fonts/codropsicons/codropsicons.eot#iefix") format('embedded-opentype'), url("/fonts/codropsicons/codropsicons.woff") format('woff'), url("/fonts/codropsicons/codropsicons.ttf") format('truetype'), url("/fonts/codropsicons/codropsicons.svg#codropsicons") format('svg'); } *, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; } .clearfix:before, .clearfix:after { display: table; content: ''; } .clearfix:after { clear: both; } .content { margin: 0 auto; max-width: 1000px; } .content > h2 { clear: both; margin: 0; padding: 4em 1% 0; color: #484B54; font-weight: 800; font-size: 1.5em; } .content > h2:first-child { padding-top: 0em; }   .codrops-header { margin: 0 auto; padding: 4em 1em; text-align: center; } .codrops-header h1 { margin: 0; font-weight: 800; font-size: 4em; line-height: 1.3; } .codrops-header h1 span { display: block; padding: 0 0 0.6em 0.1em; color: #74777b; font-weight: 300; font-size: 45%; }   .codrops-demos { clear: both; padding: 1em 0 0; text-align: center; } .content + .codrops-demos { padding-top: 5em; } .codrops-demos a { display: inline-block; margin: 0 5px; padding: 1em 1.5em; text-transform: uppercase; font-weight: bold; } .codrops-demos a:hover, .codrops-demos a:focus, .codrops-demos a.current-demo { background: #3c414a; color: #fff; }   .codrops-top { width: 100%; text-transform: uppercase; font-weight: 800; font-size: 0.69em; line-height: 2.2; } .codrops-top a { display: inline-block; padding: 1em 2em; text-decoration: none; letter-spacing: 1px; } .codrops-top span.right { float: right; } .codrops-top span.right a { display: block; float: left; } .codrops-icon:before { margin: 0 4px; text-transform: none; font-weight: normal; font-style: normal; font-variant: normal; font-family: 'codropsicons'; line-height: 1; speak: none; -webkit-font-smoothing: antialiased; } .codrops-icon-drop:before { content: "\e001"; } .codrops-icon-prev:before { content: "\e004"; }   .related { clear: both; padding: 6em 1em; font-size: 120%; } .related > a { display: inline-block; margin: 20px 10px; padding: 25px; border: 1px solid #4f7f90; text-align: center; } .related a:hover { border-color: #39545e; } .related a img { max-width: 100%; opacity: 0.8; } .related a:hover img, .related a:active img { opacity: 1; } .related a h3 { margin: 0; padding: 0.5em 0 0.3em; max-width: 300px; text-align: left; } @media screen and (max-width: 25em) { .codrops-header { font-size: 75%; } .codrops-icon span { display: none; } }   #homeCallouts{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:32px; padding:50px 0; }   #homeCallouts .card{ background:#fff; border:1px solid #e3e5ea; border-radius:12px; padding:24px; text-align:center; color:#222; text-decoration:none; transition:transform .25s ease,box-shadow .25s ease; } #homeCallouts .card:hover{ transform:translateY(-4px); box-shadow:0 8px 18px rgba(0,0,0,.12); }   #homeCallouts .card>img{ width:100%; height:auto; margin-bottom:16px; border-radius:6px; }   .homeCallout{ font-size:1.125rem; font-weight:600; line-height:1.3; margin:0 0 8px; }   .card .cta{ font-size:1rem; font-weight:600; color:#0050b3; display:inline-flex; align-items:center; gap:6px; } .card .cta img{ width:14px; height:auto; transition:transform .25s ease; filter:brightness(0) saturate(100%) invert(17%) sepia(88%) saturate(3471%) hue-rotate(203deg) brightness(93%) contrast(98%); } .card:hover .cta img{transform:translateX(2px);}   .card p{margin:0;}
@font-face { font-weight: normal; font-style: normal; font-family: 'feathericons'; src:url("/fonts/feathericons/feathericons.eot?-8is7zf"); src:url("/fonts/feathericons/feathericons.eot#iefix-8is7zf") format('embedded-opentype'), url("/fonts/feathericons/feathericons.woff?-8is7zf") format('woff'), url("/fonts/feathericons/feathericons.ttf?-8is7zf") format('truetype'), url("/fonts/feathericons/feathericons.svg?-8is7zf#feathericons") format('svg'); } .grid { position: relative; margin: 0 auto; list-style: none; text-align: center; }   .grid figure { position: relative; float: left; overflow: hidden; min-width: 320px; max-width: 400px; max-height: 360px; background: #3085a3; text-align: center; cursor: pointer; } .grid figure img { position: relative; display: block; min-height: 100%; max-width: 100%; opacity: 0.8; } .grid figure figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .grid figure figcaption::before, .grid figure figcaption::after { pointer-events: none; } .grid figure figcaption, .grid figure figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }     .grid figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; } .grid figure h2 { word-spacing: -0.15em; font-weight: 300; } .grid figure h2 span { margin-left: 10px; } .grid figure h2, .grid figure p { margin: 0; } .grid figure p { letter-spacing: 1px; font-size: 68.5%; }       figure.effect-milo { background: #000000; } figure.effect-milo img { max-width: none; width: -webkit-calc(100% + 60px); width: calc(100% + 60px); opacity: 1; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-10px,0,0) scale(1.07); transform: translate3d(-8px,0,0) scale(1.04); -webkit-backface-visibility: hidden; backface-visibility: hidden; } figure.effect-milo:hover img { opacity: 0.5; -webkit-transform: translate3d(0,0,0) scale(1); transform: translate3d(0,0,0) scale(1); } figure.effect-milo h2 { position: absolute; right: 0; bottom: 0; padding: 0.5em 1.2em; background-color: #00000057; border-radius: 250px 0px 0px 0px; } figure.effect-milo p { padding: 0 10px 0 0; width: 60%; border-right: 1px solid #fff; text-align: right; font-size: 64%; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-40px,0,0); transform: translate3d(-40px,0,0); } figure.effect-milo:hover p { opacity: 1; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
.container1 { max-width: 100%; width: 100%; margin-top: 20px; position: relative; } @media screen and (max-width: 1030px) { .container1 { width: auto; margin-top: 20px; max-width: none; position: relative; width:100% } } @media screen and (min-width: 1030px) { .containerLeft { max-width: 250px; width: 250px; margin-top: 20px; position: absolute; top: 280px; left: 30px; } } @media screen and (max-width: 1030px) { .containerLeft { max-width: 500px; margin: 0 auto; } } label{ color: black; font-size: 23px; } form#form-2 { background:white; } #form input[type="text"], #form input[type="email"], #form input[type="tel"], #form input[type="url"], #form textarea, #form button[type="submit"] { font: 400 12px/16px "Roboto", Helvetica, Arial, sans-serif; } #form { padding: 25px; width: 320px; border: 1px solid black; border-radius: 5px; min-width: 250px; max-width: 300px; -webkit-box-shadow: 3px 3px 5px 6px #ccc; -moz-box-shadow: 3px 3px 5px 6px #ccc; box-shadow: 3px 3px 5px 6px #ccc; margin: 0 auto; } #form h3 { display: block; font-size: 20px; font-weight: 300; margin-bottom: 10px; color: black; } #form h4 { display: block; font-size: 15px; font-weight: 300; margin-bottom: 10px; color: black; } fieldset { border: medium none !important; margin: 0 0 10px; min-width: 100%; padding: 0; width: 100%; border: 4px #ccc solid; } .phone3 { width: 50px !important; } .phone4 { width: 60px !important; } #form input[type="text"], #form input[type="email"], #form input[type="url"], #form textarea { width: 100%; border: 1px solid #ccc; background: #FFF; margin: 0 0 5px; padding: 10px; text-align: left; } #form input[type="text"]:hover, #form input[type="email"]:hover, #form input[type="url"]:hover, #form textarea:hover { -webkit-transition: border-color 0.3s ease-in-out; -moz-transition: border-color 0.3s ease-in-out; transition: border-color 0.3s ease-in-out; border: 1px solid #aaa; } #form textarea { height: 100px; max-width: 100%; resize: none; } #form button[type="submit"] { cursor: pointer; width: 190px; height: 50px; border: none; background: #04278f; color: #FFF; margin: 0 0 5px; padding: 10px; font-size: 15px; border-radius: 5px; border: 1px black solid; } #form button[type="submit"]:hover { background: #4571f3; -webkit-transition: background 0.3s ease-in-out; -moz-transition: background 0.3s ease-in-out; transition: background-color 0.3s ease-in-out; } #form button[type="submit"]:active { box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5); } .copyright { text-align: center; } #form input:focus, #form textarea:focus { outline: 0; border: 1px solid #aaa; } ::-webkit-input-placeholder { color: #888; } :-moz-placeholder { color: #888; } ::-moz-placeholder { color: #888; } :-ms-input-placeholder { color: #888; } .g-recaptcha { transform:scale(0.66); -webkit-transform:scale(0.66); transform-origin:0 0; -webkit-transform-origin:0 0; }
.content { font-family: 'Lato', 'sans-serif'; font-size: 17px; color: #363636; line-height: 24px; } .content ol { list-style: decimal; padding-left: 50px; } .content ol li { padding-left: 5px; } .content ul { padding-left: 0px; } .content ul li { padding-left: 15px; margin-bottom: 10px; background: url("/images/common/bullet.gif") 0 8px no-repeat; } .content ul li ul { margin: 9px; padding-left: 10px; } .content ul li ul li { background: none; list-style: circle; padding-left: 0px; } .content strong { font-weight: bold; }
div#mainPart1 { width: 100%; margin: 0 auto; min-height: 300px; max-width: 800px; padding-bottom: 50px; padding-top: 50px; position: relative; } div#Contain1 { background: linear-gradient(to right, rgb(82, 82, 82) 20%, rgb(0, 0, 0)); width: 100%; height: 67vw; margin-top: -32px; max-height: 525px; } @media screen and (max-width: 850px){ div#Contain1 { background: linear-gradient(to right, rgb(49, 49, 49) 20%, rgb(91, 123, 169)); width: 100%; border-bottom: 1px black solid; height: auto; max-height: none; padding-bottom: 30px; padding-top: 10px; border-top: 1px black solid; } } @media screen and (max-width: 1030px){ div#VideoContain { height:100% !important; } } @media screen and (max-width: 1030px){ div#VideoDiv { width: 100%; height: 100%; text-align: center; margin: 0 auto; } } input#fname { padding: 5px 15px 5px 15px; margin-top: 15px; } div#FirstVideo { padding-bottom: 20px; padding-top: 20px; width: auto; } @media screen and (max-width: 1030px) { div#FirstVideo { padding-top: 20px; padding-left: 0px; width: 100%; height: 100%; } } div#VideomainPart { max-width: 1460px; margin: 0 auto; } @media screen and (max-width: 850px) { div#mainPart1 { max-height: none; height: 100%; } } @media screen and (max-width: 1030px) { div#VideoPlaced { padding-top: 10px; position: relative; float: right; color: white; line-height: 1.5; padding: 0px; max-width: none; width: 100%; padding-bottom: 20px; } } div#Contain2 { background: white; width: 100%; height: 67vw; max-height: 455px; border-bottom: 1px black solid; border-top: 1px black solid; border-top: 1px black solid; } @media screen and (max-width: 850px){ div#Contain2 { background: white; width: 100%; border-bottom: 1px black solid; height: auto; max-height: none; height: 690px; padding-bottom: 30px; padding-top: 10px; border-top: 1px black solid; } } li.Mobilelogo { height: 100%; padding: 0px 4px 10px 4px; width: auto; } div#mainPart2 { width: 100%; min-height: 300px; margin: 0 auto; max-width: 1300px; height: 100%; } @media screen and (max-width: 850px){ div#mainPart2 { display: unset; } } div#mainPartContact { background-color: white; width: 100vw; background-size: cover; min-height: 300px; max-height: 400px; height: 35vw; margin-top: 10px; overflow: hidden; background-image: url("/css/main-pic.png"); border-bottom: 2px black solid; } div#MainText { color: white; text-align: center; padding-top: 50px; color: white; padding-left: 100px; padding-right: 100px; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; } a, img, object { outline: none; font-weight: 600; text-align: center; height: 20px; width: 150px; } button#submitBtn { cursor: pointer; width: 100%; margin-top: 20px; height: 35px; background: #04278f; color: #FFF; font-size: 15px; border-radius: 5px; margin: 20px auto; border: 1px black solid; } div#FirstImage { position: absolute; filter: drop-shadow(5px 5px 5px #222); width: 100vw; max-width: 515px; min-height: 300px; max-height: 400px; float: left; } @media screen and (max-width: 850px){ div#FirstImage { margin: 0 auto; width: 100%; position: relative; padding: 10px; float: none; text-align: center; max-width: none; max-height: none; min-height: unset; } } div#LastImage { width: 55%; padding: 30px 0px 50px 10vw; position: absolute; max-width: 700px; min-height: 300px; } @media screen and (max-width: 850px){ div#LastImage { text-align: center; position: relative; min-height: 100px; width: auto; margin: 0 auto; max-width: 70%; padding: 10px; } } div#LastPart { max-width: 1300px; margin: 0 auto; } div#LastContain { background: white; color: black; height: 864px; } @media screen and (max-width: 850px) { div#LastContain { height: 800px; } } div#LastText { float: right; padding-top: 30px; width: 100%; overflow: hidden; padding-right: 10px; } @media screen and (max-width: 850px) { div#LastText { width: 100%; text-align: center; float: none; overflow: unset; padding-right: 0px; } } div#FirstImageText { padding-left: 50px; padding-right: 50px; padding-top: 40px; position: relative; float: right; width: 45%; line-height: 1.5; color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000; } @media screen and (max-width: 850px) { div#FirstImageText { text-align: center; padding: 0px; margin: 0 auto; position: relative; width: 100%; max-width: 440px; float: none; } } div#contact { margin: 0 auto; line-height: 1.6; width: 35%; float: right; padding-bottom: 50px; text-shadow: none; color: black; } @media screen and (max-width: 980px) { div#contact { margin: 0 auto; text-align: center; line-height: 1.6; width: 100%; padding-bottom: 50px; text-shadow: none; color: black; } } div#SecondImage { position: relative; filter: drop-shadow(5px 5px 5px #222); float: right; padding-top: 30px; padding-left: 50px; padding-right: 3vw; max-width: 50vw; min-width: 500px; } @media screen and (max-width: 850px){ div#SecondImage { position: relative; filter: drop-shadow(5px 5px 5px #222); margin: 0 auto; padding: 10px; float: none; width: 100%; min-width: unset; max-width: 350px; } } a, img, object { height: auto; width: auto; } div#SecondImageText { padding-left: 10vw; padding-right: 10px; padding-top: 60px; max-width: 615px; color: black !important; position: absolute; float: left; line-height: 1.5; width: 45%; } @media screen and (max-width: 850px) { div#SecondImageText { text-align: center; padding: 0px; margin: 0 auto; position: relative; width: 100%; max-width: 440px; float: none; } } @media screen and (max-width: 850px) { div#LastContain { height: auto; display: inline-block; } } div#VideoDiv { overflow: hidden; margin: 0 auto; width: 100%; position: relative; display: inline; } @media screen and (min-width: 1200px) { div#VideoDiv { padding-left:100px; overflow: hidden; margin: 0 auto; width: 100%; position: relative; display: inline; } }
hr { box-sizing: content-box;   height: 0;   overflow: visible;   } pre { font-family: monospace, monospace;   font-size: 1em;   } abbr[title] { border-bottom: none;   text-decoration: underline;   text-decoration: underline dotted;   }   b, strong { font-weight: bolder; }   code, kbd, samp { font-family: monospace, monospace;   font-size: 1em;   }   small { font-size: 80%; }   sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; }     img { border-style: none; }     button, input, optgroup, select, textarea { font-family: inherit;   font-size: 100%;   line-height: 1.15;   margin: 0;   }   button, input {   overflow: visible; }   button, select {   text-transform: none; }   button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; }   button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }   button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }     legend { box-sizing: border-box;   color: inherit;   display: table;   max-width: 100%;   padding: 0;   white-space: normal;   }   progress { vertical-align: baseline; }   textarea { overflow: auto; }   [type="checkbox"], [type="radio"] { box-sizing: border-box;   padding: 0;   }   [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }   [type="search"] { -webkit-appearance: textfield;   outline-offset: -2px;   }   [type="search"]::-webkit-search-decoration { -webkit-appearance: none; }   ::-webkit-file-upload-button { -webkit-appearance: button;   font: inherit;   }     details { display: block; }   summary { display: list-item; }     template { display: none; }   [hidden] { display: none; }   .flickity-enabled { position: relative; } .flickity-enabled:focus { outline: none; } .flickity-viewport { overflow: hidden; position: relative; height: 465px; } .flickity-slider { position: absolute; width: 100%; height: 100%; }   .flickity-enabled.is-draggable { -webkit-tap-highlight-color: transparent; tap-highlight-color: transparent; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .flickity-enabled.is-draggable .flickity-viewport { cursor: move; cursor: -webkit-grab; cursor: grab; } .flickity-enabled.is-draggable .flickity-viewport.is-pointer-down { cursor: -webkit-grabbing; cursor: grabbing; }   .flickity-button { position: absolute; background: hsla(0, 0%, 100%, 0.75); border: none; color: #333; } .flickity-button:hover { background: white; cursor: pointer; } .flickity-button:focus { outline: none; box-shadow: 0 0 0 5px #19F; } .flickity-button:active { opacity: 0.6; } .flickity-button:disabled { opacity: 0.3; cursor: auto;   pointer-events: none; } .flickity-button-icon { fill: currentColor; }   .flickity-prev-next-button { top: 50%; width: 44px; height: 44px; border-radius: 50%;   transform: translateY(-50%); } .flickity-prev-next-button.previous { left: 10px; } .flickity-prev-next-button.next { right: 10px; }   .flickity-rtl .flickity-prev-next-button.previous { left: auto; right: 10px; } .flickity-rtl .flickity-prev-next-button.next { right: auto; left: 10px; } .flickity-prev-next-button .flickity-button-icon { position: absolute; left: 20%; top: 20%; width: 60%; height: 60%; }   .flickity-page-dots { position: absolute; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; line-height: 1; bottom: 8px; z-index: 101; } .flickity-rtl .flickity-page-dots { direction: rtl; } .flickity-page-dots .dot { display: inline-block; width: 10px; height: 10px; margin: 0 8px; background: #333; border-radius: 50%; opacity: 0.25; cursor: pointer; } .flickity-page-dots .dot.is-selected { opacity: 1; }     pre, code, kbd { font-family: Consolas, Menlo, monospace; font-size: 14px; background: #FAFAFA; border: 1px solid #DDD; white-space: pre-wrap; } pre { padding: 10px; border-radius: 6px; overflow: auto; } code, kbd { padding: 2px 3px; line-height: 1.2; border-radius: 3px; } pre code { padding: 0; line-height: 1.5; background: none; border: none; }   th, td { padding: 3px 20px 3px 0; } th { text-align: left; color: #AAA; font-weight: normal; } td { border-top: 1px solid #DDD; } tr:nth-child(2) td { border-top: 3px double #DDD; }   .main { position: relative;   }   .container { max-width: 1000px; padding: 0 10px; }   .page-title { font-size: 2.2rem; margin: 0.4rem 0; }   .main h2 { font-size: 1.6rem; font-weight: normal; border-top: 4px double #DDD; padding-top: 1.1rem; margin-top: 1.4rem; } .main h3 { font-size: 1.3rem; border-top: 1px solid #DDD; padding-top: 0.8rem; margin: 1.4rem 0 0.5rem; }   .logger { padding: 0.25rem; font-size: 1.2rem; background: #FAFAFA; text-align: center; }   *[data-license-property] { color: #09F; }   @media screen and ( max-width: 640px ) { .hidden-small { display: none; } } @media screen and ( min-width: 768px ) { html { font-size: 19px; } html.export { font-size: 16px; } .container { padding: 0 30px; } .page-title { font-size: 4.0rem; } .main h3 { font-size: 1.6rem; padding-top: 30px; } .main h2 { font-size: 2.4rem; } pre, code, kbd { font-size: 15px; } }   .gh-button { display: inline-block; background: none; border: none; color: #333; font-size: 1.1rem; } .gh-button__title, .gh-button__stat { float: left; font-weight: bold; line-height: 20px; padding: 5px 10px; border: 1px solid #d5d5d5; } .gh-button__icon, .gh-button .github-logo { height: 21px; fill: #333; display: inline-block; vertical-align: bottom; } .gh-button__title { background-color: #eee; background-image: linear-gradient(#fcfcfc, #eee); border-radius: 4px 0 0 4px; } .gh-button .github-logo { margin-right: 0.2em; } .gh-button__stat { border-left: 0; border-radius: 0 4px 4px 0; background: white; } .gh-button:hover { color: #333; } .gh-button:hover .gh-button__title { background-color: #ddd; background-image: linear-gradient(#eee, #ddd); } .gh-button:hover .gh-button__stat { color: #4078c0; } .gh-button:hover .gh-button__icon--star { fill: #4078c0; }   .hero-carousel { margin-bottom: -24px; background: #1f3b8e; background-size: cover; background-color: #1f3b8e !important; } .hero-carousel__cell { width: 100%; height: 100%; color: white; background: #ED2; background: #EFCE36;   } .hero-carousel__cell__content { padding: 20px 60px 0; max-width: 1000px; margin: 0 auto; position: relative; } .hero-carousel h1 { font-size: 3.2rem; line-height: 1.0; margin: 0; padding-top: 40px; } .hero-carousel .tagline { font-size: 1.4rem; line-height: 1.0; margin: 0 0 0.5rem; color: #444; } .hero-illustration { display: block; width: 100%; max-width: 200px; margin: 0 auto; } .hero-carousel__cell--2 { background: #8C8; } .slogan { line-height: 1.2; margin: 0; } .slogan--easy, .slogan--fun { font-size: 2.2rem; line-height: 1.1; } .slogan--tagline { margin-top: 10px; font-size: 1.2rem; color: #444; } .feature-list { font-size: 1.8rem; list-style: none; line-height: 1.2; margin: 0; padding: 0; } .feature-list li { margin-bottom: 10px; } .hero-carousel__cell--3 { background: #E90; } .hero-carousel__cell--4 { background: #E5A; } .by-line { line-height: 1.2; margin: 0; font-size: 1.8rem; } .by-line--made { padding-top: 20px; margin-bottom: 10px; color: #444; } @media screen and ( max-width: 500px ) {   .hero-carousel h1, .hero-carousel .tagline, .hero-carousel .gh-button { display: none; } } @media screen and ( min-width: 500px ) { .hero-carousel__cell--1 .hero-carousel__cell__content { padding-right: 260px; } .hero-illustration { position: absolute; right: 60px; top: 20px; } }   @media screen and ( min-width: 768px ) { .hero-carousel__cell { height: 465px; } .hero-carousel__cell__content { padding-top: 40px; } .hero-carousel h1 { font-size: 5.8rem; } .hero-carousel .tagline { font-size: 2.1rem; } .hero-illustration { top: 80px; } .slogan--easy, .slogan--fun { font-size: 4.8rem; } .slogan--tagline { margin-top: 20px; font-size: 2.4rem; } .feature-list { font-size: 3.1rem; } .feature-list li { margin-bottom: 20px; } .by-line { font-size: 3.1rem; } .by-line--made { padding-top: 40px; margin-bottom: 20px; } } @media screen and ( min-width: 960px ) { .hero-carousel__cell--1 .hero-carousel__cell__content { padding-right: 400px; } .hero-carousel h1 { font-size: 7.8rem; } .hero-carousel .tagline { margin-bottom: 1.0rem; } .hero-illustration { max-width: 400px; top: 20px } }   .hero-carousel { position: relative; height: 465px; overflow: hidden; } .hero-carousel:not(.flickity-enabled) > .hero-carousel__cell:first-child { position: relative !important; left: 0 !important; } .hero-carousel:not(.flickity-enabled) > .hero-carousel__cell:not(:first-child) { display: none; } .hero-carousel .flickity-viewport { height: 465px; }
#content div#content-body { float: left; width: 58%; margin-top: 12px; font-size: 24px; color: black; line-height: 45px; } @media screen and (max-width: 968px) { #content div#content-body { width: 100%; } } .equipment-page #MainWrapper a, .equipment-page #MainWrapper a:visited { color: inherit; text-decoration: underline; text-underline-offset: .15em; } .equipment-page #MainWrapper a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; } .equipment-page #MainWrapper h2 { font-size: 2em; margin: .67em 0; } .equipment-page #MainWrapper img { max-width: 100%; height: auto; } @media screen and (max-width: 850px) {   .equipment-page #MainWrapper { overflow-x: clip; } } .original-about-page #hero > a { position: absolute; top: 0; left: 0; width: 100%; height: 85vh; } .original-about-page #hero > a > img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; } .original-about-page .about-history { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2rem; height: auto !important; margin: 0 auto; padding: 3rem 1rem; box-sizing: border-box; } .original-about-page .about-history > img { width: 100%; max-width: 400px; height: auto !important; margin: 0 !important; } .original-about-page .about-history > ul { float: none !important; flex: 1 1 280px; width: auto !important; max-width: 600px; margin: 0 !important; text-align: left; } .original-about-page .about-history > ul:empty { display: none; } .original-about-page .about-history a { display: inline; text-decoration: underline; }
#hero .hero-poster { position: absolute; top: 0; left: 0; z-index: 5; width: 100%; height: 85%; object-fit: cover; border-bottom-left-radius: 238% 80px; border-bottom-right-radius: 220% 120px; pointer-events: none; } #hero video.hero-motion { z-index: 6; opacity: 0; transition: opacity 180ms ease; pointer-events: none; } #hero video.hero-motion.is-playing { opacity: 1; } #hero .hero-poster ~ .caption { box-sizing: border-box; min-width: 0; max-width: 100%; padding-inline: 16px; overflow-wrap: anywhere; } .blog-card__media > img { display: block; width: 100%; height: 100%; object-fit: cover; } @media (max-width: 968px), (prefers-reduced-motion: reduce) { #hero video.hero-motion { display: none; } } @media (max-width: 650px) { #hero .hero-poster ~ .caption h1 { font-size: clamp(30px, 7.2vw, 44px) !important; line-height: 1.3 !important; } #hero .hero-poster ~ .caption h2 { font-size: clamp(18px, 4.5vw, 24px) !important; line-height: 1.4 !important; } }
@font-face { font-family: 'DM Serif Text'; font-style: italic; font-weight: 400; font-display: swap; src: url(/assets/performance/font.fc6e6ec659bf9d0e.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }   @font-face { font-family: 'DM Serif Text'; font-style: italic; font-weight: 400; font-display: swap; src: url(/assets/performance/font.af72af1b26235a61.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }   @font-face { font-family: 'DM Serif Text'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.b037b349135d76c6.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }   @font-face { font-family: 'DM Serif Text'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.48e7fea6f9e3a88c.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }   @font-face { font-family: 'Glegoo'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/performance/font.dd01fa3ced9c717c.woff2) format('woff2'); unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF, U+11B00-11B09; }   @font-face { font-family: 'Glegoo'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/performance/font.1ea3f15a8c4f4e66.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }   @font-face { font-family: 'Glegoo'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/performance/font.67b5f8c784c69014.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }   @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/performance/font.cb6d7f885adb04f3.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }   @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/performance/font.92867238f947d9b2.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }   @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/performance/font.915d954b1525a17b.woff2) format('woff2'); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }   @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/performance/font.ceb8c34b47b9e706.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }   @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/performance/font.aae665c75af89ea7.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }   @font-face { font-family: 'PT Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.a456e541d46212de.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }   @font-face { font-family: 'PT Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.f283e584f001db04.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }   @font-face { font-family: 'PT Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.94dc178a50c462bb.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }   @font-face { font-family: 'PT Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.2dea6190c113af61.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }   @font-face { font-family: 'PT Sans Narrow'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.9ff324bbc631c337.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }   @font-face { font-family: 'PT Sans Narrow'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.ff565657aca50b0d.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }   @font-face { font-family: 'PT Sans Narrow'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.6ee1f5416e595c4c.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }   @font-face { font-family: 'PT Sans Narrow'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/performance/font.4b6275c7977f0cd7.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* Temporary preview logo: preserve supplied artwork proportions. */
img[src="/assets/performance/pacific-logo.1b2f14846a346573.webp"],img[src="/images/pacific-site-header.png"],img[src="/assets/performance/logo.04f1f353faa431d2.png"],img[src="/assets/performance/logo.04f1f353faa431d2.png"]{object-fit:contain}

/* Show only the active header logo, preserving existing layout. */
#headnav:not(.headnav-fixed-header)>a[href="/"]{visibility:hidden}
@media(min-width:1191px){body:has(#headnav.headnav-fixed-header) #headnavcontact>#headlogo{visibility:hidden}}

/* Requested header-logo spacing; retain the existing separate bottom override. */
#headnavcontact>#headlogo>a>img{margin:10px 5px 5px 10px!important;margin-bottom:-5px!important}

/* Reverse the Our Story gradient on the existing blue header surfaces. */
:root {
    --pacific-header-gradient: linear-gradient(315deg, #172a57 0%, #253f7b 100%);
}

div#headnavcontact,
div#headlogo {
    background-color: #253f7b;
    background-image: var(--pacific-header-gradient);
    background-size: 100vw 148px;
    background-repeat: no-repeat;
    background-position: 0 0;
}

/* Keep the legacy logo panel aligned with the top bar. */
div#headnav > #headlogo {
    background-position: 0 -40px;
}

div#headnav.headnav-fixed-header > #headlogo {
    background-size: 100vw 110px;
    background-position: 0 0;
}

/* Keep header links clean in every interaction state. */
#headnavcontact a,
#headnavcontact a:is(:link, :visited, :hover, :focus, :active),
#headnav a,
#headnav a:is(:link, :visited, :hover, :focus, :active),
mobilenav a,
mobilenav a:is(:link, :visited, :hover, :focus, :active) {
    text-decoration: none;
}

/* A clear keyboard indicator without adding underlines. */
#headnavcontact a:focus-visible,
#headnav a:focus-visible,
mobilenav a:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 3px;
}

#headnavcontact a:hover {
    color: #d2dcff;
}

/* Fit the desktop search field comfortably inside the utility bar. */
@media (min-width: 1191px) {
    #headnavcontact li.header-search {
        width: clamp(200px, 18vw, 260px);
        height: 34px;
        margin: -7px 18px 0 12px;
    }

    #headnavcontact .site-search-form {
        height: 34px;
        border-radius: 5px;
    }

    #headnavcontact .site-search-form input[type="search"] {
        height: 32px;
        font-size: 15px;
        line-height: 32px;
    }

    #headnavcontact .site-search-form button {
        flex-basis: 36px;
        width: 36px;
        height: 32px;
    }

    #headnavcontact .site-search-form button svg {
        width: 17px;
        height: 17px;
    }
}

/* White dividers between the desktop utility links. */
@media (min-width: 1191px) {
    #headnavcontact topnav .navitems > .navitem:not(.header-search) {
        position: relative;
    }

    #headnavcontact topnav .navitems > .navitem:not(.header-search) + .navitem:not(.header-search)::before {
        content: "";
        position: absolute;
        left: -17px;
        top: 3px;
        width: 1px;
        height: 18px;
        background-color: #ffffff;
        pointer-events: none;
    }
}

/* Dedicated contact row beneath the shared header logo. */
#headnavcontact > #headlogo > .header-contact {
    position: absolute;
    left: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 315px;
    max-width: 100%;
    height: 28px;
    text-shadow: none;
}

#headnavcontact .header-phone,
#headnavcontact .header-phone:link,
#headnavcontact .header-phone:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 28px;
    padding: 0 8px;
    box-sizing: border-box;
    border-radius: 4px;
    color: #ffffff;
    font: 700 16px/20px "PT Sans", Arial, sans-serif;
    letter-spacing: 0.02em;
    white-space: nowrap;
    text-decoration: none;
    text-shadow: none;
}

#headnavcontact .header-phone svg {
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
}

#headnavcontact .header-phone:hover {
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.1);
}

#headnavcontact .header-phone:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: -2px;
}
