img, iframe {max-width: 100%; height: auto} html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%} @font-face { font-family: 'charter'; src: url('/fonts/charter/charter_bold-webfont.eot'); src: url('/fonts/charter/charter_bold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/charter/charter_bold-webfont.woff') format('woff'), url('/fonts/charter/charter_bold-webfont.ttf') format('truetype'); font-display: swap } *{scroll-behavior:smooth} body { font-family: 'Montserrat', Verdana, sans-serif; font-size: 16px; color: #212322; line-height: 1.6; text-align: center; min-width: 320px } h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; } h2, h3, h4, h5, h6 { text-transform: uppercase; } h1, h2, h3, h4, h5, h6, .fakeh1, .banner p { font-family: 'charter', serif; font-weight: normal } body, .top ul, nav ul { padding: 0; margin: 0; } img, iframe { max-width: 100%; height: auto; display: block } a img, iframe { border: none; } iframe { aspect-ratio: 16/9 auto; } a, .row2 a:hover, .solutions h2 a:hover, #news #contents a:hover { color: #5E7461; text-decoration: none; transition: all .3s linear .01s; } .top a:hover, nav a:hover, footer a:hover, .subfoot a:hover { transition: all .3s linear .01s } a:hover { text-decoration: underline; transition: all .3s linear .01s; } .banner a:hover, .row1 a:hover, .solutions a:hover { text-decoration: none; } hr { border-width: 1px; border-color: #D1E0D7; border-style: none none solid; margin: 30px 0; } .imgLeft, .imgRight { max-width: 45%; } .imgLeft { float: left; margin: 5px 4% 1% 1%; } .imgCenter { display: block; margin: 0 auto; } .imgRight { float: right; margin: 5px 1% 1% 4%; } .imgShadow { margin: 20px 0 10px; box-shadow: 5px 5px 10px rgba(0,0,0,.1); } .clear { clear: both; } .center { text-align: center; } .inline img { max-height: 20px; display: inline; } .wrap { max-width: 1080px; display: block; margin: 0 auto; position: relative; } .minibanner { background-color: #2e3e80; color: #fff } .minibanner p { text-align: center; padding: 5px 10px; margin: 0; } .table { display: table; width: 100%; } .table.nofix { table-layout: auto } .table > div, .logo, nav { display: table-cell; vertical-align: top; } .table.mid > div { vertical-align: middle } .table.half > div { width: 50%; } .table.half > div:first-of-type { padding-right: 2%; } .table.half > div:last-of-type { padding-left: 2%; } .table.third > div { width: 33%; } .table.third > div:nth-of-type(1) { padding-right: 4%; } .table.third > div:nth-of-type(2) { padding: 0 2%; } .table.third > div:nth-of-type(3) { padding-left: 4%; } .grid.mid{align-items:center} .grid { display: grid; grid-gap: 10px } .grid.quad { grid-template-columns: repeat(4,1fr) } .grid.third { grid-template-columns: repeat(3,1fr) } .grid.half, .grid.stayhalf { grid-template-columns: repeat(2,1fr) } main .grid li { margin-right: 20px } .grid ul { margin: 0 } .flex { display: flex; flex-wrap: wrap; } ul.flex { padding: 0; list-style: none } .nowrap, a[href^=tel] { white-space: nowrap } .top li, nav li { display: inline-block; vertical-align: top; } .top .table.half > div, .top li, .logo, nav, .subfoot .table.half > div { vertical-align: middle; } .fa-2x { vertical-align: middle; padding-right: 3%; } .fa-fw.fa-4x { width: 82px; height: 64px; display: block; margin: 0 auto } .nolist { padding: 0; list-style: none } .indent, .indent ul { list-style: none } .bgimg { position: relative } .bgimg > img:first-of-type { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center; top: 0; bottom: 0; left: 0; right: 0; z-index: -1 } header { box-shadow: 0 0 15px rgba(0,0,0,.2); position: relative; z-index: 999; } header a{display:block;} .top a, .logo a, nav a { color: rgba(33,35,34,.8); } .top { padding: 10px; border-bottom: 1px solid #D1E0D7; } .top ul { display: inline-block } .top .social { margin: 0 30px 0 0 } .social a { display: block; width: 20px; height: 20px; text-align: center; padding: 0 6px; margin: 6px } .social i { color: #a3a3a3; font-size: 20px } .top .wrap { text-align: right } .top .button { font-size: 13px; color: #2e3e80; margin:5px 10px; padding: 5px 20px; border-radius: 8px; } header .grid { grid-template-columns: 265px 1fr; align-items: center; grid-gap: 0 5px } .logo { width: calc(100% - 20px); padding: 20px 10px; } .logo img { width: 245px; height: 83px } nav { text-align: right; } nav a { padding: 5px; margin: 5px; display: block; } nav li:first-of-type { display: none } .video { display: block; width: 100%; aspect-ratio: auto 16 / 9; border: 0; } .banner, .row3 { background-size: cover; background-attachment: fixed; background-position: center; } .banner .overlay { height: 30vw; min-height: 400px; max-height: 600px; background-image: linear-gradient( transparent, rgba(0,0,0,.5), transparent ); padding: 0 10px } .banner .wrap { top: 50%; transform: translateY(-50%); } .banner strong { display: block; font-size: 46px; } .banner svg { display: block; padding: .25em 0 0; margin: 0 auto .25em } .banner i { display: block; font-size: 90px; line-height: 1; height: 90px; padding: 0.25em 0 0; margin: 0 0 .25em } .banner i:before { height: 90px } .banner p, .banner h1 { max-width: 650px; font-size: 32px; font-weight: 600; line-height: 1.2; text-align: center; color: #fff; margin: 0 auto; text-shadow: 2px 2px 5px rgba(0,0,0,.8); } .banner h1 span { line-height: 1.4 } .banner a { display: inline-block; width: 250px; font-size: 18px; font-weight: 600; padding: 10px 0; border: 2px solid #2e3e80; border-radius: 10px; } .banner a:first-of-type { background-color: rgba(255,255,255,.8); color: #2e3e80; margin: 50px 10px 0 0; } .banner a:last-of-type { background-color: rgba(46,62,128,.9); color: #fff; margin: 50px 0 0 10px; } .banner.main .overlay { height: 600px; } .banner.main p { font-size: 24px; font-weight: 500; } .banner.about { background-image: url(/images-design/banners/meeting.jpg); } .banner.products { background-image: url(/images-design/banners/devices.jpg); } .banner.telephone { background-image: url(/images-design/banners/phone.jpg); } .banner.managed { background-image: url(/images-content/high-definition-ip-surveillance.jpg); } .banner.managedsecurity { background-image: url(/images-design/banners/eye-on-data.jpg); } .banner.ctap { background-image: url(/images-design/banners/save.jpg); } .banner.backup { background-image: url(/images-design/banners/server.jpg); } .banner.conference { background-image: url(/images-design/banners/conference.jpg); } .banner.testimonials { background-image: url(/images-design/banners/applause.jpg); } .banner.continuity { background-image: url(/images-content/blog/data-backup-vs-disaster-recovery.jpg); } .banner.news { background-image: url(/images-design/banners/analytics.jpg); } .banner.partners { background-image: url(/images-design/banners/handshake.jpg); } .banner.contact { background-image: url(/images-design/banners/mobile.jpg); } .banner.time { background-image: url(/images-design/banners/clock.jpg); } .banner.guides { background-image: url(/images-design/banners/binders.jpg); } .banner.training { background-image: url(/images-design/banners/video.jpg); } .banner.scam { background-image: url(/images-design/banners/report.jpg); } .banner.rates { background-image: url(/images-design/banners/call.jpg); } .banner.network { background-image: url(/images-design/banners/network.jpg); } .banner.security { background-image: url(/images-design/banners/managed-network-cyber-security-maximum-resiliency.jpg); background-position: 40% -90px } .banner.cyberattacksfacts { background-image: url(/images-design/banners/hacker-in-dark-hoodie-overlaid-with-orange-words-danger-attack-locked-data-breach.jpg); background-position: 50% -120px } .banner.business-phones { background-image: url(/images-design/banners/business-phone-systems.jpg); } .banner.scan { background-image: url(/images-design/banners/eye.jpg); } .banner.justice { background-image: url(/images-design/banners/justice.jpg); } .banner.surveillance { background-image: url(/images-design/banners/camera.jpg); } .banner.kids { background-image: url(/images-design/banners/virtual-remote-classroom.jpg); } .banner.thankskids { background-image: url(/images-design/banners/thanks-kids.jpg); } .banner.blog { background-image: url(/images-design/banners/blog.jpg); background-position-y: -20vw } .banner.pay { background-image: url(/images-design/banners/pay.jpg); } .banner.best { background-image: url(/images-design/banners/best.jpg); background-position-x: 35%; } .banner.reserve-it { background-image: url(/images-design/banners/reserve-it-lower-costs-backup-help-desk.jpg) } .banner.totalvoice-teams { background-image: url(/images-design/banners/totalvoice-teams.jpg); background-position: 50% } .banner.essentials-care { background-image: url(/images-design/banners/essentials-care-data-backup-cyber-security.jpg); background-position: 25% -100px } .banner.zultys { background-image: url(/images-design/banners/zultys-family-of-products.jpg); background-attachment: unset } .row1 h2, .row2 h2, .row3 h2 { font-size: 24px; } .row1 { background-color: #2e3e80; padding: 50px 0 60px; } .row1 h2, .row1 h3, .row3 h2 { text-align: center; color: #fff; } .row1 h2 { margin: 0 0 40px; } .row1 h3 { font-family: 'Montserrat', Verdana, sans-serif; font-size: 18px; font-weight: 400; text-transform: none; margin: 5px 0 0; } .row1 .table.third > div:nth-of-type(1), .row1 .table.third > div:nth-of-type(2), .row1 .table.third > div:nth-of-type(3) { padding: 5px; } .row1 a { display: block; padding: 25px 0; border: 2px solid #fff; } .row1 img { height: 100px; width: 100px; margin: 0 auto } .row2 { padding: 30px 0 0 0; } .row2 .table.half > div:first-of-type, .table.half.solutions > div:first-of-type { padding-right: 1%; } .row2 .table.half > div:last-of-type, .table.half.solutions > div:last-of-type { padding-left: 1%; } .row2 .table.half > div:last-of-type li { font-style: italic; } .row2 .table.half > div:last-of-type li strong { font-style: normal; } .row2 h2 a, .solutions h2 a { color: #2e3e80; } .row2 ul { list-style: none; padding-left: 0; } .row2 li { margin-bottom: 20px; } .row2 .blogs h3 { text-transform: none; } .row2 .blogs a { color: #2e3e80 } .row2 .blogs a:hover { text-decoration: underline; } .row2 .blogs h3 a:hover { color: #2e3e80; text-decoration: none; } .row2 .post:first-of-type { padding-bottom: 10px; margin-bottom: 10px; } .row3 .overlay { padding: 40px 0 40px; background-color: rgba(0,0,0,.3); } .row3 h2 { margin-bottom: 30px; } .row3 input[type=text], .row3 input[type=email], .row3 input[type=tel], .row3 textarea { background-color: rgba(255,255,255,.9); } .row3 span a { font-size: 125%; color: #fff } .row3 p { color: #fff; font-size: 20px; font-weight: bold; text-shadow: 2px 2px 4px #000 } .selectors { padding: 20px 10px; background-color: #EFDBB2 } .selectors .grid { grid-template-columns: 1fr 1fr 1fr } .selectors .wrap { max-width: 1800px } .selectors h3 { text-transform: none; text-align: center; color: #000; max-width: 350px; margin: 1em auto } .selectors h3 span { display: block } .selectors p.button:before { content: ""; width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-top: 20px solid #2e3e80; display: block; position: relative; top: -50px; left: 50%; transform: translateX(-50%) } .highlight { margin: 2% 0; padding: 2em 0; background: #2e3e80; } .highlight a { display:block; font-size: 46px; margin: 0 auto; color:#fff; font-weight: bold; text-align: center; text-decoration: none;} .highlight i {color:#fff;} .highlight:hover { cursor: pointer; background-color:#212322; transition: all .3s linear .01s; } .selectors a { text-decoration: none; padding: 10px 10px 170px; position: relative } .selectors a:hover { text-decoration: none } .selectors p.button { text-align: center; display: block; padding: 0 10px 10px; position: absolute; bottom: 10px; width: calc(100% - 44px); max-width: 300px; left: 50%; transform: translateX(-50%) } .selectors p span { display: block; text-transform: none; font-size: 22px } main { padding: 30px 10px; } h1, .fakeh1 { font-size: 30px; margin-top: 0; padding-top: 0.83em } .fakeh1 { display: block; font-weight: bold; text-align: left; } h2 { font-size: 24px; } h3 { font-size: 22px; } h4 { font-size: 20px; } h5 { font-size: 18px } h6 { font-size: 16px } main ul, main ol { padding-left: 25px; } main li, .subfoot li { margin: 5px 0 } main p a { font-weight: bold; color: #5E7461; } main p a, main li a { text-decoration: underline } .invis, .hide, .jQexpiring { display: none; } .error { font-weight: bold; color: #ff0000; } .button { display: inline-block; font-weight: 700; text-transform: uppercase; color: #2e3e80; padding: 10px 40px; margin: 15px 0; border: 2px solid #2e3e80; border-radius: 10px; text-shadow: none; text-decoration: none } a.button:hover, a:hover .button { text-decoration: none; background-color: #2e3e80; color: #fff; } .button, a.button:hover, input[type=submit], input[type=submit]:hover { transition: all .3s linear .01s; } .button.invert { background-color: #2e3e80; color: #fff } .button.invert:hover, a:hover .button.invert { background-color: #fff; color: #2e3e80 } .gmap { width: 100%; height: 340px; margin: 20px 0; } .address { width: 250px } .address h2 { font-size: 24px; margin-bottom: 0; } .address ul { list-style: none; padding-left: 0; } .address .button { width: 200px; text-align: center; margin: 4px 0; padding: 10px 0; } .logos a { display: inline-block; vertical-align: middle; max-width: 200px; margin: 20px 40px; } .logos img { margin: auto; padding-top: 15px !important; } .table.half.solutions > div { position: relative; } .solutions:first-of-type { margin-top: 40px; } .solutions.grid { grid-gap: 20px } .solutions a { padding: 10px 8% 100px; background-size: cover; background-position: center; border: 2px solid #2e3e80; position: relative } .solutions h2 { color: #2e3e80; } .solutions p { color: #4d4d4d; } .solutions a p:last-of-type { position: absolute; bottom: 20px } .solutions .button { margin: 0 } .solutions a:nth-of-type(1) { background-image: url(/images-design/solutions-cyber.jpg); } .solutions a:nth-of-type(2) { background-image: url(/images-design/solutions-essentials.jpg); } .solutions a:nth-of-type(3) { background-image: url(/images-design/solutions-cloud.jpg); } .solutions a:nth-of-type(4) { background-image: url(/images-design/solutions-voip.jpg); } .solutions a:nth-of-type(5) { background-image: url(/images-design/solutions-managed.jpg); } .solutions a:nth-of-type(8) { background-image: url(/images-design/solutions-reserve.jpg); } .solutions a:nth-of-type(6) { background-image: url(/images-design/solutions-data.jpg); } .solutions a:nth-of-type(7) { background-image: url(/images-design/solutions-cctv.jpg); } .phones { margin: 40px 0; clear: both; } .rates { width: 100%; border-collapse: collapse; } .rates th { background-color: #fafafa; } .rates th, .rates td { padding: 10px 20px; border: 1px solid #D1E0D7; } .rates th:last-of-type, .rates td:last-of-type { text-align: center; } .news ul { list-style: none; padding-left: 0; } .blogs .post { padding-bottom: 10px; margin-bottom: 10px; border-top: 1px solid #D1E0D7; } .blogs .post h1 a, .law i { color: #2e3e80; } .blogs .post h1 a:hover { color: #2e3e80; text-decoration: none; } .law ul { list-style: none; padding-left: 0; } .law li { font-size: 16px; margin-bottom: 15px; } .payment { font-size: 24px; margin-bottom: 40px; } .countup { padding-top: 10px } .countup p { font-size: 24px; text-align: center; color: #4d4d4d; } .countup strong { display: block; font-family: 'Prompt',sans-serif; font-weight: 800; font-size: 46px; line-height: 1.2; color: #2e3e80; } .countup .table > div { background-position: top center; background-repeat: no-repeat; } .countup .table > div:nth-of-type(2) { background-image: url(/images-content/handshake-icon.png); } .team h2 { font-family: 'Montserrat', Verdana, sans-serif; font-size: 18px; background-color: #5E7461; left: 0; bottom: 34px; } .team span { font-size: 14px; text-transform: none; background-color: #212322; left: 0; bottom: 20px; } .team p { font-size: 15px; } .team h2, .team span { display: inline-block; line-height: 1.4; padding: 5px 10px; position: absolute; } .team h2, .team span, .team .grid > div:hover > div { color: #fff; } .team .grid { padding-bottom: 60px; } .team .grid > div { min-height: 350px; background-size: cover; background-position: center; position: relative; } .team .grid > div > div { height: calc(100% - 40px); color: transparent; padding: 20px; transition: ease-out .3s; } .team .grid > div:hover > div { cursor: pointer; background-color: rgba(46,62,128,.8); transition: ease-in .3s; } .team .deavin { background-image: url(/images-content/team/deavin-p.jpg); } .team .jamey { background-image: url(/images-content/team/jamey-w.jpg); } .team .jason { background-image: url(/images-content/team/jason-t.jpg); } .team .chuckm { background-image: url(/images-content/team/chuck-m.jpg); } .team .chrisc { background-image: url(/images-content/team/cris-c.jpg); } .team .brett { background-image: url(/images-content/team/brett-w.jpg); } .team .kim { background-image: url(/images-content/team/kim-r.jpg); } .team .david { background-image: url(/images-content/team/david-d.jpg); } .team .mattd { background-image: url(/images-content/team/matt-d.jpg); } .team .amber { background-image: url(/images-content/team/amber-c.jpg); } .team .russm { background-image: url(/images-content/team/russ-m.jpg); } .team .randya { background-image: url(/images-content/team/randy-a.jpg); } .team .shawn { background-image: url(/images-content/team/shawn-j.jpg); } .team .brian { background-image: url(/images-content/team/brian-w.jpg); } .team .roger { background-image: url(/images-content/team/roger-w.jpg); } .team .terry { background-image: url(/images-content/team/terry-m.jpg); } .team .william { background-image: url(/images-content/team/william-w.jpg); } .values ol { counter-reset: item; padding-left: 0; } .values ol > li { display: block; } .values ol > li:before { content: counter(item) "."; counter-increment: item; font-weight: bold; } .best img { object-fit: cover; width: 100%; } #news #contents { float: right; width: 35%; padding: 10px 20px 15px; margin: 5px 0 2% 4%; background-color: #fafafa; } #news #contents a { color: #2e3e80; } #news #contents ul { list-style: none; padding-left: 20px; } #news #contents ul ul { list-style: disc; margin-bottom: 20px; } #news #contents ul ul a { color: #4d4d4d; } #news span { display: block; border-width: 1px; border-color: #D1E0D7; border-style: none none dotted; margin-bottom: 40px; } form { margin: 20px 0; } form label { text-align: left; display: block } form .table.half > div:first-of-type { padding-right: 1%; } form .table.half > div:last-of-type { padding-left: 1%; } form input[type=text], form input[type=email], form input[type=tel], form input[type=submit], form select, form textarea { font-family: Montserrat, sans-serif; font-size: 15px; } form input[type=text], form input[type=email], form input[type=tel], form select, form textarea { background-color: #fafafa; padding: 10px 20px; border: none; height: 20px } form input[type=text], form input[type=email], form input[type=tel], form select { margin-bottom: 15px; } form input[type=text], form input[type=email], form input[type=tel], form textarea { width: calc(100% - 40px); } form select, form .grid { width: 100%; } form .grid { grid-gap: 20px } form .grid input { margin: 0 } form textarea { height: 150px; padding: 20px; margin-bottom: 20px } form input[type=submit], #scan input[type=submit]:hover { font-size: 16px; font-weight: 600; padding: 16px 80px; margin-top: 20px; border: none; border-radius: 10px; border: 2px solid #2e3e80; background-color: #2e3e80; color: #fff } form input[type=submit]:hover, #scan input[type=submit] { cursor: pointer; background-color: rgba(255,255,255,.9); color: #2e3e80 } footer { background-color: rgba(239,219,178,.2); ; line-height: 1.3; } footer .wrap { padding: 40px 10px 0 } footer .grid { grid-gap: 20px } footer a[href^=tel], footer a[href^=mailto] { font-weight: bold } footer a, .subfoot a { display: block } footer h3, footer h3 a { color: #2e3e80; } footer p { line-height: 1.7; margin: 30px 20px 30px 0; } footer ul { list-style: none; margin: 30px 0; padding: 0 } footer li { margin: 10px 0 } .a8bmark { text-align: right; min-width: 150px } .a8bmark a { display: inline-block; } .a8bmark img { margin: 0 auto } .subfoot { padding: 20px 0; background-color: #fff; margin-top: 40px } .subfoot p { padding: 0 10px; margin: 0.5em 0 } .subfoot img { opacity: .7; } .subfoot .center p { text-align: center } .subfoot li { text-align: center } .subfoot .table.half > div:first-of-type a { display: inline-block; line-height: 1; padding-left: 20px; margin-left: 20px; border-left: 1px solid #666; } ol.firstbold { font-weight: bold } ol.firstbold p + * { font-weight: normal } .border, .bord { border-width: 2px; border-color: #2e3e80; border-style: solid; } .table.border { width: calc(100% - 4px) } .table.border > div { padding: 0; width: 50%; } .table.border > div:nth-of-type(2) { border-style: none; width: 20px } .border div div { padding: 20px 5%; } .bord { margin: 1em 0; padding: 20px 2.5% } .timechange { text-align: left; padding: 0 } .timechange li { display: inline-block; width: calc(25% - 15px); vertical-align: top; margin-right: 10px } .timechange li:before { content: "\2022"; font-size: 30px; line-height: 22px; position: absolute } .timechange a, .timechange li:before { display: inline-block; vertical-align: middle } .timechange a { padding-left: 15px } .back { margin-top: 0; text-align: center; display: none } .privacy { padding: 0; list-style-type: none } .privacy li { text-align: center } .underline { text-decoration: underline; } .column { text-align: left; padding-left: 0; } .column li { width: calc((100% / 2) - 24px); display: inline-block; vertical-align: middle; margin: 0 20px 10px 0; left: 15px; } .column li:before { display: inline-block; margin: 0 10px 0; position: absolute; left: -15px; top: 50%; transform: translateY(-50%) } blockquote { border-left: 10px solid #2e3e80; font-size: 125%; margin: 1em 4%; padding: 15px 3% } blockquote h2, blockquote h3 { margin-top: 0 } cite { display: block; margin: 1em 0 } .ita { margin-bottom: 20px; } .ita > div { width: calc(180px - 10px); background-color: #2e3e80; color: #fff; padding: 80px 0; border: 5px solid #fff; border-radius: 20px; position: relative; } .ita > div:hover i, .ita > div:hover h2 { color: transparent; } .ita > div:hover p { color: #fff; } .ita i, .ita h2, .ita p { text-align: center; position: absolute; transition: ease-in-out 1s; } .ita i, .ita p { line-height: 1.4; margin: 0; } .ita h2 { font-size: 16px; top: 60px; left: 50%; transform: translateX(-50%); width: calc(100% - 30px); padding: 0 15px } .ita p { font-size: 14px; padding: 0 15px; top: 50%; transform: translateY(-50%); } .ita i { display: block; font-size: 50px; line-height: 1; top: 15px; left: 50%; transform: translateX(-50%); } .ita p { color: transparent; } .listhalf ul { list-style: none; padding: 0 } .listhalf li { padding-left: 35px; position: relative } .listhalf i { font-size: 20px; color: #2e3e80; position: absolute; left: 0 } .listhalf .not-bts i { color: red } .tos-table { padding: 20px 30px; } .tos-table table, tr, td { border: 1px solid #000; border-collapse: collapse; border-spacing: 0; text-align: center; } .tos-table tr, .tos-table td { padding: 5px clamp(10px, 4vw, 40px) 5px; } .tos-table tr:first-of-type { color: #fff; background-color: #404040; } #accordion h3 { font-size: 1em; font-weight: normal; } .ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; padding: 10px 20px; background: #eee; outline: none; } .ui-accordion .ui-accordion-header:hover { background: #ccc; } .ui-accordion .ui-accordion-li-fix { display: inline; } .ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; outline: none; } .ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } .ui-accordion a { zoom: 1; } .ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; } .ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } .ui-accordion .ui-accordion-content { padding: 10px 20px; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; } .ui-accordion .ui-accordion-content-active { display: block; } .calendly-plugin { background: rgba(239,219,178,.2); padding: 40px 0 50px; } .ccpaNotice { background-color: #D1E0D7 !important } .ccpaNotice, .ccpaNotice a { color: #606060 !important } .businessneeds {padding:3% 3% 6%; border:1px solid #D1E0D7; border-radius:8px; } .businessneeds p {text-align: center;} .callouts { justify-content: center; margin:3% 0; } .callouts li { color: #2e3e80; margin:5px; padding: 10px 20px; border-radius: 8px; border:1px solid #2e3e80;} .quote { margin: 1em 8% 2em } .iso {max-width: 760px; margin: 0 auto;} .iso h2 {text-transform: none; text-align: center; font-size: 36px;} .iso h3 {color:#B04D52; text-align: center; font-size:18px;} #landing { max-width: 300px; margin: 0 0 20px 20px; padding: 20px 15px 30px; float: right; background-color: #D1E0D7; border-radius: 5px } #landing.cyberattackfacts { float: none; margin: 0 } #landing h2, #landing h3 { text-align: center; } #landing h2 { margin: 0 0 15px } #landing h3 { margin: 0 0 10px; text-transform: none } #landing input { height: auto } #landing h3 span { font-weight: normal; font-size: 14px; display: block; text-transform: none } #landing label { display: grid; grid-template-columns: 15px 1fr; grid-gap: 10px } #landing label input { margin-top: 5px } #landing ul { list-style: none; padding-left: 15px } #landing li { margin: 8px 0 } .areas #landing { grid-area: form } .areas .sa-intro { grid-area: intro } .areas .sa-message { grid-area: content } #landing > p input { margin: 0 } #landing .flex > div { flex: 1 0 200px } #landing .flex > div:last-of-type { min-width: 240px } #landing input[type=submit] { margin-top: 0 } #downtime { text-align: left; } #downtime label { display: block; } #downtime input[type=number] { padding: 10px; width: 200px; display: block; margin-bottom: 20px; } @media(prefers-reduced-motion) { * { scroll-behavior: unset;transition: all 0s !important } } @media(max-width:999px) { footer .grid.quad { grid-template-columns: 1fr 1fr } footer p { margin: 30px 0 } nav li:first-of-type { display: inline-block } main .blogs .postThumbnail { margin-top: 0; } .selectors .grid { grid-template-columns: 1fr 1fr } } @media(max-width:767px) { .team .grid { grid-template-columns: repeat(3,1fr) } .selectors .grid { grid-template-columns: 1fr !important } .selectors h3 { max-width: unset } .selectors h3 span { display: inline } .top ul{display:block;} .top ul{text-align:center} .top .social{margin:0 auto} } @media(max-width:700px) { .back { display: block; } .border > div { display: block; width: auto; border-style: none } .border div div { padding: 20px 10px } .border > div:nth-of-type(2) { display: none } .border > div:first-of-type { border-style: none none solid } .timechange li { width: calc((100% / 3) - 15px) } main .table.half.quad > div { display: block; width: auto; padding: 0 !important } main .table.half.quad { display: inline } .row2 .table.border { border: none; width: auto } .row2 .table.border > div { width: auto !important; margin: 2em auto !important; border: 2px solid #2e3e80; } .ita > div { width: calc((100% / 3) - 10px); } header .grid { grid-template-columns: 1fr } .logo { margin: 20px auto 0; width: 310px } .logo img { width: 310px; height: 105px } .logo, nav { text-align: center } nav ul { margin: 10px 0 } .banner { background-attachment: unset; background-position-y: 0 !important } .areas { display: grid; grid-template-columns: 1fr; grid-template-areas: "intro" "form" "content" } #landing { max-width: none; margin: 1em -10px; float: none; border-radius: 0; } #landing h2 { margin-top: 0 } .team .grid { grid-template-columns: repeat(2,1fr) } .team .grid > div { min-height: 450px; } blockquote { padding: 15px 0 15px 6% } .subfoot .table.third > div { display: block; width: auto; padding: 0 !important } .subfoot p { text-align: center; margin: 1em 0 } .callouts li { width:100%; text-align: center;} } @media(max-width:600px) { .table.half.solutions > div, footer .quad > div { display: block; width: auto; padding: 0 !important } .solutions a { padding: 10px 20px 100px } .table.third, footer .quad { display: inline } .table.third > div { display: block; width: auto; padding: 0 !important } .footnav li { display: inline-block; margin: 0 } .footnav a { display: block; margin: 6px 4px; padding: 5px 15px; border-radius: 5px; border: 1px solid #2e3e80; background-color: #fbfbfb } .table.quad > div.btsfoot { display: inline-block; } footer h3, footer .wrap, footer li, footer p { text-align: center } .banner .overlay { height: 50vw !important; min-height: 250px } .banner.main .overlay { height: auto !important; padding: 40px 10px } .banner.main .overlay .wrap { top: unset; transform: none } .banner.main h1, .banner.main i { padding-top: 0 } .logos a { margin: 20px } .banner a { display: block; margin: 1em auto !important; } .banner a:nth-of-type(2) { border-color: #fff } .grid.third { grid-template-columns: 1fr 1fr } #accordion h3 { font-size: 0.8em; } .ita > div { width: calc((100% / 2) - 10px); } .listhalf li { width: calc(100% - 40px); } .table.half { display: inline } .table.half > div, .table.contact > div { display: block; width: auto; padding: 0 !important } .timechange li { width: calc(50% - 15px) } main .imgRight { float: none; margin: 0 auto; max-width: 100%; } body main .postThumbnail { width: auto; height: 250px; margin: 1em -10px; float: none; max-width: calc(100% + 20px) } .grid.caf { grid-template-columns: 1fr } #landing.cyberattackfacts { margin: 1em -10px } .subfoot .grid.third{grid-template-columns:1fr} .top .headbuttons li:first-of-type{display:block;text-align:center} .top .headbuttons li:first-of-type{margin:5px;padding:5px} } @media(max-width:500px) { .top ul, .logo, nav { display: block; width: auto; } nav, .top ul, .logo, .address li, .address p { text-align: center } .logo img { max-width: 300px; margin-top: 10px } .banner.main h1 span { white-space: normal } nav ul { display: flex; flex-wrap: wrap; justify-content: space-between } nav li { flex: 1 0 130px } nav a { text-align: center } nav { margin-bottom: 20px } .countup .table.third > div { display: inline-block; width: 50% } .grid.half { grid-template-columns: 1fr } .grid.list { grid-gap: 0 } .grid.solutions .odd { grid-column: unset } } @media(max-width:400px) { .timechange li { display: block; width: auto } .subfoot .table > div { display: block; width: auto; } .subfoot p { text-align: center !important } .banner.main .overlay { height: auto; padding: 30px 10px } .banner.main .wrap { top: initial; transform: none } form .grid.third { grid-template-columns: 1fr } .countup strong { font-size: 36px } .countup p { font-size: 18px } .countup div { background-size: contain } .ita > div { width: calc(100% - 10px); } .team .grid { grid-template-columns: 1fr } } 