CINXE.COM

<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> <title>Home - Gray Digital Media</title> <meta name="robots" content="noindex, nofollow"> <meta name="googlebot" content="noindex, nofollow"> <link rel="stylesheet" href="https://localbox.graydigitalmedia.com/assets/css/main.css"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"> <link rel="icon" href="https://localbox.graydigitalmedia.com/assets/img/template/favicon.png">  <style> :root { --g-blue: #009cdb; --g-dark-blue-1: #1055a0; --g-dark-blue-2: #1b2845; --g-red: #e21636; --g-yellow: #fbbf16; } .g-text-blue { color: var(--g-blue)!important; } .g-text-dark-blue-1 { color: #0499d6!important; } .g-text-dark-blue-2 { color: var(--g-dark-blue-2)!important; } .g-text-red { color: var(--g-red)!important; } .g-text-yellow { color: var(--g-yellow)!important; } .g-fz-17 { font-size: 17px!important; } .g-fz-36 { font-size: 36px!important; } </style>  <style> body { background-color: #141526; color: #62646a; font: 400 16px/24px 'Barlow', 'Macan', 'Helvetica Neue', Helvetica, Arial, sans-serif; width: 100%; } a { text-decoration: none; } #scrollToTopBtn { display: none; position: fixed; bottom: 40px; right: 15px; border: none; border-radius: 4px; padding: 5px 13px 7px 13px; opacity: .95; color: #141526; } #scrollToTopBtn:hover { background-color: #fbfbfb; } .z-999 { z-index: 999999; } .pb-64px { padding-bottom: 64px!important; } .is-hvr:hover { opacity: .75; cursor: pointer; } .cf-max-w { max-width: 1300px; } .cf-max-w2 { max-width: 1300px; } .top-s { margin-top: 117px; display: block; } .page-bg-gray { background-color: #fafafb; } .page-bg-dark-blue { background-color: #1b2845; } .page-section { padding: 64px 0; } .ps_title { margin: 0; padding-bottom: 18px; color: #222325; font-size: 58px; font-weight: 600; } .ps_description { color: #404145; letter-spacing: -0.01em; padding-right: 10px; font-size: 32px; line-height: 45px; color: #d7d8df !important; } .ps_container_text_1 { text-align: center; padding: 43px 200px; border-radius: 2px; background-color: #f0f4ff; color: #222325; line-height: 28px; border: 1px solid #d4defb; font-size: 20px; } .page-img-responsive { max-width: 100%; height: auto; border-radius: 2px; } .page-img-responsive-2 { max-width: 85%; max-height: 85%; border-radius: 2px; height: 85%; width: 85%; } .page-img-responsive-3 { max-height: 150px; margin: 0 auto; } .page-img-responsive-4 { max-width: 45%; max-height: 45%; border-radius: 2px; height: 45%; width: 45%; display: block; } .mw-800 { max-width: 800px; } .mw-1000 { max-width: 1000px; } .page-intro { background-repeat: no-repeat; background-size: cover; position: relative; color: #fff; background-image: url('/assets/img/pages/other/top-intro.webp'); } .page-intro:before { content: ""; background: rgb(27 40 69 / 75%); position: absolute; bottom: 0; top: 0; left: 0; right: 0; z-index: 1; } .page-intro h1 { position: relative; z-index: 2; font-size: 36px; margin-bottom: 12px; font-weight: 400; } .pi_row { min-height: 140px; padding: 30px 0; } .pi_desc { z-index: 2; position: relative; font-size: 21px; display: block; } .pi_desc_2 { max-width: 600px; } .pi_desc_3 { max-width: 700px; } .pi_height { min-height: 250px; } .pi_img { max-height: 120px; z-index: 1; position: relative; } .pi_cta { background-color: transparent; padding: 6px 14px; border-radius: 2px; margin-right: 15px; color: #fff; border: 1px solid #fff; font-weight: 400; font-size: 26px!important; } .pi_cta:hover { color: #fff; background-color: #0499d6 !important; border: 1px solid #0499d6; cursor: pointer; } .pi_cta_white { font-weight: 600; font-size: 18px !important; background-color: transparent; padding: 6px 14px; border-radius: 2px; color: #fff; border: 1px solid #fff; margin-right: 15px; } .pi_cta_white:hover { background-color: #fff; color: #1055a0; cursor: pointer; } .pi_cta_outline { border: none; background-color: #fff; color: #222325; padding: 8px 13px; border-radius: 2px; border: 1px solid #222325; } </style>  <style> .header-bar { transition: all 0.7s; padding: 38px 0; z-index: 999; position: fixed; width: 100%; border-bottom: 1px solid #0f1014; background-color: #0f1014!important; height: 117px; } .header-transparent { background-color: transparent !important; transition: all 0.7s; border-bottom: 1px solid transparent!important; } .header_logo { position: absolute; max-height: 90px; min-height: 90px; top: -24px; transition: all 1.1s; } .header_logo:hover { opacity: .75; } .header-transparent:not(.header-slider-full) .header_logo { max-height: 120px; top: 25px; } .header-transparent.header-slider-full .header_logo { max-height: 130px; min-height: 130px; top: -24px; filter: brightness(0) invert(1); } .nav-link { color: #fff!important; font-weight: 500; font-size: 17px; padding: 0rem 0.6rem; white-space: nowrap; } .header-transparent .nav-link { color: #fff !important; } .mnu_cta { font-weight: 500; font-size: 17px !important; background-color: transparent; padding: 6px 8px; border-radius: 2px; color: #fff; border: none; } .mnu_cta:hover { opacity: .85; } .last_mnu_cta { margin-right: 12px; } .header-transparent .mnu_cta { background-color: transparent; filter: drop-shadow(5px 2px 4px #000); text-shadow: 0px 0 30px rgba(0, 0, 0, 1); color: #fff!important; } .header-transparent .mnu_cta:hover { color: #fff!important; } .mnu_cta_2 { font-size: 17px !important; padding: 10px 30px; border-radius: 2px; background-color: transparent; color: #fff; border: 1px solid #fff; font-weight: 500; } .mnu_cta_2:hover { opacity: .85; } .header-transparent .mnu_cta_2 { background-color: #fff; color: #141526!important; border: 1px solid #fff!important; } .header-transparent .mnu_cta_2:hover { opacity: .75; cursor: pointer; } .header-transparent .menu-overlay-strip { padding: 6px 10px; border-radius: 3px; background-image: ; transition: all 1.1s; } .top-no-transition { transition: none!important; } .navbar-toggler { border-color: #fbfbfb; opacity: .75; } .navbar-toggler:focus { box-shadow: none; } .navbar-toggler-icon { background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23fbfbfb' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } #navbar .active { color: #222325 !important; background-color: transparent; } #navbar .active span::before { position: absolute; bottom: 0; left: 0; right: 0; margin: auto; background-color: #fbbf16; width: 0%; content: ""; height: 3px; transition: all 0.5s; width: 100%; top: 27px; } #navbar .nav-link:not(.active) span::after { position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; content: ""; background-color: #fbbf16; width: 0%; height: 3px; transition: all 0.5s; top: 30px; } #navbar .nav-link-red:not(.active) span::after { background-color: #e21636 !important; } #navbar .nav-link-blue:not(.active) span::after { background-color: #009cdb !important; } #navbar .nav-link:not(.active) span:hover::after { width: 100%; } .hover .mnu_btn span::after { width: 100% !important; } .header-transparent .mnu_btn span { color: #fff !important; font-weight: 300; } .mnu_btn { font-weight: 400; font-size: 1.3rem !important; color: #fff; !important; } .mnu_btn span { position: relative; } .nav__links { display: flex; list-style: none; color: #fff; font-weight: 700; } .header-transparent .nav__links { filter: drop-shadow(5px 2px 4px #000); text-shadow: 0px 0 30px rgba(0, 0, 0, 1); } .nav--link { transition: opacity 100ms linear; cursor: pointer; } .menu_backdrop { opacity: 0; visibility: hidden; position: fixed; top: 0; left: 0; z-index: 99999; width: 100vw; height: 100vh; background-color: #000000; } .menu_backdrop_active { opacity: 0.75; visibility: visible; transition: opacity 0.75s linear, visibility 0s linear; } .header-transparent .progress-container { display: none; } .progress-container { width: 100%; height: 3px; background: #1c2844; position: absolute; bottom: -2px; transition: all 0.7s; } .progress-bar { height: 3px; background: #009cdb; width: 0%; } </style>  <style> .subheader_menu { background-color: #fafafa; position: fixed; width: 100%; z-index: 999; text-align: center; padding: 0px 15px; color: #62646a; font-weight: 400; font-size: 14px; top: 127px; transition: all 0.7s; opacity: 0; border-top: 1px solid #e4e5e7; border-bottom: 1px solid #e4e5e7; } .subheader_menu a { color: #404145; font-weight: 400; font-size: 15px; text-decoration: none; padding: 10px 10px; display: block; float: left; } .subheader_menu a:hover { text-decoration: none; background-color: var(--g-dark-blue-2)!important; color: #fff; } .video_cta_container { display: none; } .video_cta { font-weight: 600; font-size: 20px !important; background-color: transparent; color: #fff; border-radius: 2px; border: none; padding: 0; margin: 0; opacity: .75; } .h1_1 { font-size: 4.5rem; font-weight: 900; } .h1_2 { font-size: 2.9rem; font-weight: 400; padding-top: 8px; } .an_container { position: relative; bottom: 45px; z-index: 99; } .an_num_container { background-color: #1b2845; border-radius: 4px; border: 2px solid #1b2845; padding: 13px; } .video-container .an_num_container { opacity: .9; } .an_num_2 { color: #d7d8df; font-size: 40px; font-weight: 500; padding: 13px 0; display: block; padding-bottom: 20px; } .an_text_2 { color: #d7d8df; font-size: 26px; display: block; padding-bottom: 13px; font-weight: 300; } .an_sep { border-bottom: 1px solid #fff; display: block; margin-top: 13px; margin-bottom: 13px; opacity: .4; } .an_num_4 { display: block; padding-top: 3px; } </style>  <style> .video-section { position: relative; width: 100%; height: 522px; overflow: hidden; background-image: url('https://localbox.graydigitalmedia.com/assets/img/pages/home/home-video-thumb.webp'); background-position: center center; background-repeat: no-repeat; background-size: cover; } .video-container { position: relative; width: 100%; height: 100%; overflow: hidden; } .video-iframe { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -45%) scale(1.7); transform-origin: center; } .video-dark-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 1; } .video-title-overlay { position: absolute; top: 57%; left: 50%; transform: translate(-50%, -50%); color: white; text-align: center; font-size: 2.5rem; font-weight: bold; z-index: 2; overflow: hidden; width: 100%; } .video-title-overlay h1 { text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); margin-bottom: 35px; } .darkModeToggle { background-color: transparent; border-radius: 2px; color: #1055a0; border: 1px solid #1055a0; } .darkModeToggle:hover { background-color: #1055a0; border: 1px solid #1055a0; color: #fff; } .header-transparent .darkModeToggle { filter: drop-shadow(5px 2px 4px #000); text-shadow: 0px 0 30px rgba(0, 0, 0, 1); color: #fff!important; border: 1px solid #fff!important; } .header-transparent .darkModeToggle:hover { color: #1055a0!important; border: 1px solid #fff!important; background-color: #fff!important; } .vm-modal { display: block; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0, 0, 0, 0.8); opacity: 0; pointer-events: none; transition: opacity 0.5s ease; z-index: 9999999999; } .vm-modal.show { opacity: 1; pointer-events: auto; } .vm-modal-content { position: relative; margin: 5% auto; padding: 0; width: 80%; height: 80%; } .vm-modal-content iframe { width: 100%; height: 100%; } .vm-close { position: fixed; top: 30px; right: 25px; color: #fff; font-size: 60px; font-weight: 400; cursor: pointer; z-index: 1001; } </style>  <style> .an_col { margin: 15px 0; } .an_num { color: #222325; font-size: 38px; font-weight: 600; } .an_text { color: #404145; font-size: 38px; } </style>  <style> #who-we-serve { margin: auto; height: 600px; overflow: hidden; background-color: #0499d6; position: absolute; border-top: 1px solid #6f718c!important; } .wws-350 { width: 600px; z-index: 9; background-color: #141525; max-width: 650px; margin: 0 auto; padding: 30px 0; border-radius: 4px; opacity: .9; z-index: 1; height: 325px; } .wws { height: 1000px; position: absolute; right: 50px; top: 0; } .wwsBoxes { width: 100%; height: 100%; max-height: 1000px; position: absolute; overflow: hidden; translate: none; rotate: none; scale: none; transform: translate(-95%, -18%) rotate(3deg) rotateY(2deg) rotateX(14deg); left: 0; width: 3500px; } .photoBox span { color: #fff; background-color: rgb(4, 153, 214); width: 70%; display: block; text-align: center; position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); padding: 20px 0; border-radius: 4px; font-size: 32px; } #wws_home .ps_title { font-size: 45px; } #wws_home .ps_description { font-size: 28px; } #wws_home .pi_cta_white { font-weight: 400; } #who-we-serve .pi_cta { padding: 8px 24px 13px 24px; } </style>  <style> .wg_line { display:none; } .wg_container { position: relative; height: 0px; padding: 0; border-radius: 2px; margin: 0 0px; transform: translateY(30px); display: inline-table; background-color: transparent; border: 2px solid transparent; opacity: .75; } .wg_title { color: #fff; font-weight: 600; font-size: 25px; margin-bottom: 0px; } .wg_container img { display: block; width: 100%; margin: 0 auto; margin-bottom: 15px; } .wg_container::after { border-color: transparent transparent transparent transparent!important; } .wg_desc { color: #fff; } #wgdm_home { color: #0499d6 !important; padding-top: 0px; } #why-gdm { background-color: #141526; margin-top: 48px; padding-bottom: 78px; } #why-gdm .ps_description { font-size: 35px; line-height: 45px; color: #d7d8df !important; font-weight: 600!important; } .px-8rem { padding-left: 8rem; padding-right: 8rem; } </style>  <style> #rnc_home { padding-top: 100px; padding-bottom: 100px; background-color: #1b2845; } #rnc_home .pi_cta { font-size: 26px!important; margin-top: 30px!important; } #rnc_col_home { background: #141526; padding: 40px; border-radius: 6px; } .rnc_home_image { background-image:url('https://localbox.graydigitalmedia.com/assets/img/pages/home/gdmhome1c.webp?v=1'); width:100%; height:600px; display: block; background-size: cover; } </style>  <style> .wws_container { margin: 11px 0; } </style>  <style> .op_img { width: 240px; } .op_desc { color: #404145; padding: 15px 15px 0 15px; max-width: 80%; margin: 0 auto; } .op_container { opacity: 0; transform: translateY(30px); } </style>  <style> .aw_title { color: #404145; font-weight: 300; font-size: 18px; margin-bottom: 15px; } .aw_desc { color: #404145; padding: 15px 15px 0 15px; } .aw_img { padding: 15px; border: 1px solid #e4e5e7; margin: 9px 0; } .aw_container { opacity: 0; transform: translateY(30px); } </style>  <style> .co_title { color: #404145; font-weight: 300; font-size: 18px; margin-bottom: 15px; } .co_desc { color: #404145; padding: 15px 15px 0 15px; } .co_container { opacity: 0; transform: translateY(30px); } </style>  <style> #insights { padding-top: 100px; padding-bottom: 100px; background-color: #1b2845; } #insights .ps_title { font-size: 50px; } #insights .ps_description { font-size: 30px; line-height: 42px; padding-top: 15px; } #insights .pi_cta { font-size: 26px!important; margin-top: 30px!important; } #insights_col { background: #141526; padding: 40px; border-radius: 6px; } .insights_image { background-image: url(https://localbox.graydigitalmedia.com/assets/img/pages/insights/dashboard.webp); width: 100%; height: 500px; display: block; background-size: cover; background-position: top; background-repeat: no-repeat; border-top-left-radius: 8px; border-bottom-left-radius: 8px; } .i_logo_center { max-width: 400px; filter: brightness(0) invert(1); } </style>  <style> .ic_title { color: #404145; font-weight: 300; font-size: 18px; margin-bottom: 15px; } .ic_desc { color: #404145; padding: 15px 15px 0 15px; } .ic_container { opacity: 0; transform: translateY(30px); } </style>  <style> .gsap-box-container { max-width: 100%; margin: 0 auto; } .gsap-box-grid { display: grid; grid-template-columns: repeat(4, minmax(200px, 1fr)); grid-gap: 1.875rem; } .gsap-box { position: relative; height: clamp(400px, 50vh, 550px); border-radius: 2px; overflow: hidden; display: flex; flex-direction: column; cursor: pointer; } .gsap-box .gsap-box-image { width: 100%; height: 100%; overflow: hidden; position: absolute; top: 0; left: 0; } .gsap-box .gsap-box-image:after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(0 156 219 / 10%); mix-blend-mode: color; } .gsap-box .gsap-box-image img { width: 100%; height: 100%; object-fit: cover; } .gsap-box .gsap-box-info-wrapper { transform: translateY(80%); position: relative; background: rgb(27 40 69 / 92%); z-index: 1; height: 100%; padding: 1rem; color: #fff; text-align: center; overflow-y: hidden; } .gsap-box .gsap-box-info { position: absolute; width: 100%; left: 0; padding: 0 5px; } .gsap-box svg { width: 60px; margin-top: -120px; opacity: 0; transition: opacity 0.3s ease-in-out; } .gsap-box .gsap-box-title { font-weight: 500; font-size: 20px; padding: 0; position: relative; bottom: 9px; } .gsap-box .gsap-box-desc { font-size: 1rem; line-height: 1.3; margin-top: 0px; opacity: 0; transition: opacity 0.3s ease-in-out; } .gsap-box:hover .gsap-box-desc { opacity: 1; } .gsap-box .gsap-box-action { margin-top: 1rem; opacity: 0; transition: opacity 0.3s ease-in-out; } .gsap-box:hover .gsap-box-action { opacity: 1; } .gsap-box .gsap-box-action a { text-decoration: none; color: #fff; display: inline-block; border: 1px solid #fff; border-radius: 2px; padding: 5px 15px; margin-top: 15px; } #digital-solutions .ps_title { font-size: 4.5rem; font-weight: 900; } </style>  <style> .gsap-box-2-container { max-width: 100%; margin: 0 auto; } .gsap-box-2-grid { display: grid; grid-template-columns: repeat(4, minmax(200px, 1fr)); grid-gap: 1.875rem; } .gsap-box-2 { position: relative; height: 300px; border-radius: 2px; overflow: hidden; display: flex; flex-direction: column; cursor: pointer; } .gsap-box-2 .gsap-box-2-image { width: 100%; height: 100%; overflow: hidden; position: absolute; top: 0; left: 0; } .gsap-box-2 .gsap-box-2-image:after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(0 156 219 / 10%); mix-blend-mode: color; } .gsap-box-2 .gsap-box-2-image img { width: 100%; height: 100%; object-fit: cover; } .gsap-box-2 .gsap-box-2-info-wrapper { transform: translateY(80%); position: relative; background: rgb(0 156 219 / 92%); z-index: 1; height: 100%; padding: 1rem; color: #fff; text-align: center; overflow-y: hidden; } .gsap-box-2 .gsap-box-2-info { position: absolute; width: 100%; left: 0; padding: 0 25px; } .gsap-box-2-info img { width: 85px; opacity: 0; transition: opacity 0.3s ease-in-out; position: absolute; left: 50%; transform: translateX(-50%); top: -55px; margin: 0 auto; } .gsap-box-2 .gsap-box-2-title { font-weight: 600; font-size: 20px; padding: 0; position: relative; } .gsap-box-2 .gsap-box-2-desc { font-size: 1rem; line-height: 1.3; margin-top: 0px; opacity: 0; transition: opacity 0.3s ease-in-out; } .gsap-box-2:hover .gsap-box-2-desc { opacity: 1; } .gsap-box-2 .gsap-box-2-action { margin-top: 1rem; opacity: 0; transition: opacity 0.3s ease-in-out; } .gsap-box-2:hover .gsap-box-2-action { opacity: 1; } .gsap-box-2 .gsap-box-2-action a { text-decoration: none; color: #fff; display: inline-block; border: 1px solid #fff; border-radius: 2px; padding: 5px 15px; margin-top: 15px; } #who-we-serve-extended .ps_title { font-size: 4.5rem; font-weight: 900; } #other-industries { background-color: #1b2845; } .oi_items { text-align: left; } .oi_items span { color: #999; display: block; background-color: transparent; margin: 15px 0px; border: 1px solid #999; font-weight: 500; padding: 14px 0px; text-align: center; font-size: 14px; background-color: transparent; border-radius: 2px; } #other-industries .ps_title { color: #d7d8df !important } </style>  <style> .background-layer { background-color: rgba(255, 255, 255, 0.5); background-blend-mode: overlay; background-repeat: no-repeat; background-size: cover; background-position: center; } #graymap { background-color: rgba(255, 255, 255, 0.8); background-blend-mode: overlay; background-repeat: no-repeat; background-size: cover; background-position: center; } #graymap svg:not(.icon_svg) { width: 95%; margin: 0 auto; display: block; } #graymap path { fill-opacity: 0.8 !important; } #graymap .container-xxl { max-width: 1520px; } .tooltip-inner { background-color: #000; border-radius: 4px; width: 220px; max-width: 220px; padding: 0; margin: 0; } .tooltip.show { opacity: 1; } .mapT_contact_us { margin-top: 5px; margin-bottom: 10px; color: #ddd; border: 1px solid #ddd; display: inline-block; padding: 3px 15px; font-weight: 500; } .mapT_contact_us:hover { cursor: pointer; background-color: #fbfbfb; color: #222; } .mapT_left { background-color: #ffc326; color: #404145; border-radius: 2px 0 0 2px; } .mapT_right { background-color: #173d64; color: #828282; border-radius: 0 2px 2px 0; color: #fff; } .mapT_nosocial { border-left: 10px solid #ffc326; border-radius: 2px; width: 100% !important; } .mapT_background { background-color: rgba(0, 0, 0, 0.1); background-blend-mode: overlay; background-repeat: no-repeat; background-size: cover; background-position: center; min-height: 130px; transition: all 0.7s; padding: 15px 20px; border-top-right-radius: 2px; } .mapT_city { color: #fff; font-weight: 500; font-size: 23px; line-height: 30px; } .mapT_dma { color: #fff; font-weight: 500; } .mapT_container { min-height: 100px; padding: 15px 20px; border-bottom-right-radius: 2px; } .mapT_station { color: #fff; font-weight: 500; margin-bottom: 2px; font-size: 16px; } .mapT_website { font-weight: 400; margin-top: 11px; margin-bottom: 15px; border-radius: 2px; color: #0088f8; font-size: 16px; } .mapT_website:hover { cursor: pointer; opacity: .75; } .station_active { fill: #fff !important; transition: all 0.7s; stroke: #005daa !important; } .station_active_hovered { fill: #fff !important; cursor: pointer; transition: all 0.7s; stroke: #005daa !important; } .st0 { fill: #002060 !important; } .state_active { fill: rgb(0, 93, 170) !important; transition: all 0.7s; } .st1, .st2 { fill: #fbbf16 !important; } .st1, .st2 { stroke: #002060; z-index: 999999; } .popover { width: 430px; background-color: transparent; border: none; } .popover-body { padding-left: 9px !important; } .popover-body { padding: 0 0 0 12px; position: relative !important; left: 3px !important; } #graymap { width: 100%; position: relative; overflow: hidden; background-size: cover; background-position: center; } .background-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; z-index: 0; opacity: 0; transition: opacity 1s ease; } .background-layer.current { opacity: 1; } .current_bg_city_name { color: #fff; position: absolute; z-index: 1; right: 25px; bottom: 50px; font-weight: 500; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); font-size: 55px; } .mapT_left .bi { color: #173d64; display: block; margin: 0 auto; text-align: center; font-size: 22px; margin: 11px 0; } .mapT_left a:hover { cursor: pointer; opacity: .75; } #path69-5-9-7-8-2, #path69-5-9-7-8-2-4, #path69-5-9-7-8-2-5-2-2-7-1-6-6_00000145042888094193548040000012326178005637606276_, #path69-5-9-7-8-2-4-7-4-4-3-9-2-5-5-1-8-3-5-7-5-9-2-9-0-0-8, #path69-5-9-7-8-2-4-7-4-4-3-9-2-5-5-1-8-3-5-7-5-9-2-9-0-0-8-3-8-3-7-3-9-3-1-3_00000060008617824818319740000016093312271677858183_, #path69-5-9-7-8-2-4-7-4-4-3-9-2-5-5-1-8-3-5-7-5-9-2-9-0-0-8-3-8-3-7-3-9-3-1-3_00000090268668085618222350000001888426826191439531_, #path69-5-9-7-8-2-4-7-4-4-3-9-2-5-5-1-8-3-5-7-5-9-2-9-0-0-8-3-8-3-7-3-9-3-1-3-6-2-3-2-6-0-5-2-5-7-3-1-0-8-5-3-4-0-4-5 { display: none !important } #get-started .pi_cta { padding: 8px 14px 10px 14px; font-size: 22px !important; } </style>  <style> #submit_form { border: none; float: right; background-color: #222325; color: #fff; padding: 9px 0; border-radius: 2px; } .fields_info { position: relative; top: 8px; font-size: 13px; color: #828282; } #contactUsModal { z-index: 999999999; } .cu-header-lg { display: block; } .cu-header-sm { display: none; } #contactUsModal .modal-dialog { width: 100%; max-width: 600px; margin: 0 auto; padding: 0: } #contactForm .modal-header { background-image: url('https://localbox.graydigitalmedia.com/assets/img/pages/other/gray-bg.jpg'); border-top-left-radius: 2px; border-top-right-radius: 2px; color: #fff; background-position: center center; background-size: cover; background-repeat: no-repeat; padding: 30px 25px; } #contactForm .modal-header h5 { font-size: 28px; margin-bottom: 15px; } #contactForm .modal-header p { font-size: 25px; margin-bottom: 0; border-top: 1px solid rgb(255 255 255 / 50%); padding-top: 20px; margin-top: 20px; display: block; line-height: 30px; } #contactForm .modal-body { padding: 15px 25px; margin: 0 auto; background-color: #fafafa; } #contactForm .modal-footer { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; padding: 20px 25px; } #contactForm .modal-footer button { border: none; float: right; background-color: #1055a0; color: #fff; padding: 8px 40px; border-radius: 2px; margin: 0; } #contactForm .modal-footer button:hover { background-color: #0f4a8a; color: #fff; cursor: pointer; } #contactForm .form-control { padding: 8px 15px; border: 1px solid #c5c6c9; } #contactForm .form-select { padding: 8px 15px; border: 1px solid #c5c6c9; } #contactForm .tclogo { display:block; margin:0 auto; padding-top:30px; max-height: 90px; margin-bottom:40px; position: absolute; right: 25px; top: -11px; filter: brightness(0) invert(1); } .close_contact_mobile { display: none; } </style>  <style> #test_your_site_modal .btn-close { position: absolute !important; right: 15px !important; top: 15px !important; color: #222325; } #test_your_site_modal .modal-content { border-radius: 2px; border: none; -webkit-box-shadow: 0 .14px 2.29266px rgba(0, 0, 0, .032), 0 .37px 4.42626px rgba(0, 0, 0, .048), 0 3px 7px rgba(0, 0, 0, .09); box-shadow: 0 .14px 2.29266px rgba(0, 0, 0, .032), 0 .37px 4.42626px rgba(0, 0, 0, .048), 0 3px 7px rgba(0, 0, 0, .09); } #test_your_site_section { padding: 35px 30px; } #test_your_site_modal .form-control { padding: 11px 15px; border: 1px solid #c5c6c9; } #test_your_site_modal .form-select { padding: 11px 15px; border: 1px solid #c5c6c9; } .loading_iframe_container img { height: 200px; z-index: 9; margin: 0 auto; } .contact .gdm_contact_form { width: 100%; background-color: transparent; max-width: 1000px; margin: 0 auto; padding: 30px 35px; border-radius: 10px; border: 1px solid rgb(229 232 235 / 75%); } .test_your_site_form { border: none !important; padding: 0 !important; } .contact .gdm_contact_form input, .contact .gdm_contact_form textarea { cursor: text; display: flex; background-color: rgb(255, 255, 255); border-radius: 10px; border: 1px solid rgb(229, 232, 235); width: 100%; padding: 12px; font-size: 15px; } .input_mandatory::after { content: " *"; color: #e32; position: absolute; margin: 0px 0px 0px -20px; font-size: 20px; padding: 0 5px 0 0; } .tts_2 { height: 35px; position: relative; top: 20px; opacity: .7; } .tts_3 { text-align: right; } .tts_4 { height: 100px; margin: 150px 0 50px 0; } .test_top_separator { border-top: 1px solid #e5e9ec; width: 100%; height: 1px; display: inline-block; opacity: .8; } .loading_iframe_container { z-index: 999; width: 100%; display: flex; position: absolute; } </style>  <style> .bf-social { text-decoration: none !important; font-size: 22px; margin: 0px 16px; position: relative; top: 4px; } .bf-social:hover { opacity: .75; } .fi-ts { position: relative; top: 3px; padding: 0 30px 0 22px !important; } .fi-tt { position: relative; top: 2px; } #contact { border-top: 1px solid #e4e5e7; } #footer-container { border-top: 1px solid #8d8e99; padding: 32px 0; font-size: 17px; } footer { padding-bottom: 16px; } footer h5 { color: #0070b4; font-weight: 600; padding-bottom: 20px; margin: 0; font-size: 17px; } footer ul { list-style: none; padding: 0; margin: 0; } footer ul li a { color: #74767e; } footer ul li a:hover { text-decoration: underline; } .footer-copy { color: #d7d8df !important; font-size: .9rem; font-weight: 300; } .f_social { width: 20px; height: 20px; margin-left: 26px; color: rgb(116, 118, 126); } footer img { height: 70px; } .f_social:hover { color: #404145; } .fs_yt { width: 25px; height: 25px; position: relative; top: 1px; } footer a { color: #d7d8df !important; font-weight: 500; font-size: 15px; } footer a:hover { text-decoration: underline; } .footer-span { font-weight: 100; color: #d7d8df !important; padding: 0 30px; opacity: .5; } </style>  <style> #sticky-widget { position: fixed; bottom: 20px; right: 20px; display: flex; align-items: center; visibility: hidden; z-index: 999; } #sticky-widget-mb { position: fixed; bottom: 20px; left: 10px; display: flex; align-items: center; z-index: 999; } #notification-badge { position: absolute; top: -5px; right: -5px; background-color: #e21636; color: white; border-radius: 50%; width: 20px; height: 20px; text-align: center; font-size: 12px; line-height: 20px; visibility: hidden; z-index: 99; } #notification-badge span { font-size: 12px; color: white; } #notification-badge-mb { position: absolute; top: -5px; right: -5px; background-color: #e21636; color: white; border-radius: 50%; width: 20px; height: 20px; text-align: center; font-size: 12px; line-height: 20px; z-index: 99; } #notification-badge-mb span { font-size: 12px; color: white; } #yellow-box { background-color: #fbbf16; padding: 10px; margin-right: 30px; display: flex; align-items: center; border-radius: 5px; position: relative; visibility: hidden; -webkit-box-shadow: 0 .14px 2.29266px rgba(0, 0, 0, .032), 0 .37px 4.42626px rgba(0, 0, 0, .048), 0 3px 7px rgba(0, 0, 0, .09); box-shadow: 0 .14px 2.29266px rgba(0, 0, 0, .032), 0 .37px 4.42626px rgba(0, 0, 0, .048), 0 3px 7px rgba(0, 0, 0, .09); } #yellow-box::after { content: ""; position: absolute; right: -20px; top: 50%; transform: translateY(-50%); border-width: 10px 0 10px 20px; border-style: solid; border-color: transparent transparent transparent #fbbf16; } #yellow-box p { color: #1b2845; font-size: 14px; margin: 0; line-height: 20px; } #close-btn { background-color: #1b2845; color: white; border-radius: 50%; width: 17px; height: 17px; display: flex; justify-content: center; align-items: center; cursor: pointer; margin-right: 10px; visibility: hidden; top: 7px; position: absolute; left: -24px; -webkit-box-shadow: 0 2px 10px 0 rgba(53, 63, 69, .15), 0 1px 2px 0 rgba(0, 0, 0, .2); -moz-box-shadow: 0 2px 10px 0 rgba(53, 63, 69, .15), 0 1px 2px 0 rgba(0, 0, 0, .2); box-shadow: 0 2px 10px 0 rgba(53, 63, 69, .15), 0 1px 2px 0 rgba(0, 0, 0, .2); border: 1px solid #fff; font-size: 9px; } </style>  <style> @media (max-width: 1400px) { .header-transparent.header-slider-full .header_logo { max-height: 90px; min-height: 90px; } .mnu_btn { font-size: 17px!important; } .header-transparent .mnu_btn span { font-weight: 600!important; } } @media (max-width: 1199px) { .navbar-toggler { bottom: 9px; } .last_mnu_cta { margin-right: 0; } .header-bar-opened { padding-bottom: 30px; -webkit-box-shadow: 0 .14px 2.29266px rgba(0, 0, 0, .032), 0 .37px 4.42626px rgba(0, 0, 0, .048), 0 3px 7px rgba(0, 0, 0, .09); box-shadow: 0 .14px 2.29266px rgba(0, 0, 0, .032), 0 .37px 4.42626px rgba(0, 0, 0, .048), 0 3px 7px rgba(0, 0, 0, .09); transition: none; z-index: 999999999; } .navbar-collapse { background-color: #141526; border-top: none; margin-top: 32px; padding-top: 20px; padding-bottom: 92px; } .navbar-collapse .show { transition: none; } .navbar-collapsin { transition: none; } .navbar-nav { flex-direction: column; } .navbar-nav .nav-item { margin-bottom: 10px; } .navbar-nav .nav-link { padding: 10px 15px; text-align: left; background-color: #1b2845; border-radius: 5px; transition: background-color 0.3s ease, color 0.3s ease; border-bottom: none; color: #d7d8df; } .navbar-nav .nav-link:hover { background-color: #1b2845; color: #d7d8df!important; } } @media (max-width: 767px) { .header-bar { height: 90px; } .header_logo { max-height: 64px; min-height: 64px; top: -23px; } .navbar-toggler { bottom: 21px; } .navbar-collapse { margin-top: 5px; } } </style>  <style> @media (max-width: 1199px) { .video_cta_container { display: block; } .video_cta svg { width: 80px; height: 80px; } } @media (max-width: 768px) { .video-section { height: 100vh; } .an_container { bottom: 245px!important; } .video-title-overlay { top: 37%; } .an_container_video { position: absolute!important; bottom: 215px!important; } .hr_rnc { font-size: 30px!important; } .an_num_container { opacity: .85 !important; padding: 0; border: 1px solid #ffffff; } .an_num_2 { font-size: 24px; padding-bottom: 8px; font-weight: 800; color: white; } .an_text_2 { font-size: 20px; line-height: 20px; font-weight: 600; } #why-gdm .ps_description { font-size: 24px; line-height: 36px; } #why-gdm { margin-top: 0px; padding-bottom: 48px; } .rnc_home_image { height: 300px; } #rnc_home { padding-top: 72px; padding-bottom: 72px; } #rnc_desc { font-size: 24px; line-height: 36px; } #rnc_home .pi_cta { font-size: 22px !important; margin-bottom: 40px; } #who-we-serve .ps_title { font-size: 34px; } #who-we-serve .ps_description { font-size: 22px; line-height: 32px; padding: 0 10px; } .fm-c { text-align: center; width: 100%; } } @media (min-width: 992px) and (max-width: 1250px) { .video-iframe { transform: translate(-50%, -50%) scale(2); } } @media (max-width: 991px) { .vi-1 { transform: translate(-50%, -50%) scale(2.5); } .vi-2 { transform: translate(-50%, -28%) scale(2.5); } .hr_rnc { font-size: 38px; } } @media (max-width: 550px) { .video-title-overlay { top: 28%; } .h1_1 { font-size: 2.2rem!important; } .h1_2 { font-size: 1.9rem!important; padding-top: 4px; } .video-title-overlay h1 { margin-bottom: 28px; } } @media (max-width: 1500px) { #wws_home { display: none; } } </style>  <style> @media (max-width: 991px) { .op_desc { padding: 10px 10px 25px 10px; } } @media (max-width: 700px) { .gsap-box-grid { grid-template-columns: repeat(1, minmax(200px, 1fr)); } } @media (min-width: 700px) and (max-width: 1080px) { .gsap-box-grid { grid-template-columns: repeat(2, minmax(200px, 1fr)); } } @media (min-width: 1080px) and (max-width: 1300px) { .gsap-box-grid { grid-template-columns: repeat(3, minmax(200px, 1fr)); } } </style>  <style> @media (max-width: 700px) { .gsap-box-2-grid { grid-template-columns: repeat(1, minmax(200px, 1fr)); } } @media (min-width: 700px) and (max-width: 1080px) { .gsap-box-2-grid { grid-template-columns: repeat(2, minmax(200px, 1fr)); } } @media (min-width: 1080px) and (max-width: 1300px) { .gsap-box-2-grid { grid-template-columns: repeat(3, minmax(200px, 1fr)); } } </style>  <style> @media (max-width: 768px) { .ir_rnc { font-size: 30px!important; } } @media (max-width: 991px) { .ir_rnc { font-size: 38px; } #ul_ins { text-align: left; } .ps_container_text_1 { padding: 43px 50px; } } </style>  <style> @media (max-width: 991px) { .igs_rnc { font-size: 38px; } #graymap { padding: 0; } } @media (max-width: 768px) { .igs_rnc { font-size: 30px!important; } .current_bg_city_name { display: none; } #graymap svg:not(.icon_svg) { max-height: 550px; } } @media (max-width: 600px) { .igs_search_title { font-size: 32px!important; } } @media (max-width: 550px) { .igs_search_title { font-size: 28px!important; } #graymap svg:not(.icon_svg) { max-height: 400px; } } @media (max-width: 500px) { .igs_search_title { font-size: 24px!important; } #graymap svg:not(.icon_svg) { max-height: 350px; } } @media (max-width: 400px) { .igs_search_title { font-size: 20px!important; } } </style>  <style> @media (max-width: 650px) { #contact .g-recaptcha { position: unset!important; } #contact .g-recaptcha div { margin: 0 auto!important; } #contactForm .modal-header { padding: 40px 25px; padding-bottom: 25px; } #contactForm .modal-header h5 { font-size: 16px; } #contactForm .tclogo { max-height: 65px; top: -17px; left: 26px; right: unset; } #contactForm .modal-header p { font-size: 18px; font-weight: 300; line-height: 24px; } #contactForm .g-recaptcha { width: 100%; margin: 0; } #contactForm .modal-footer button { margin-top: 30px; } #contactForm .modal-footer { padding-top: 40px; } .close_contact_mobile { display: block; border-top: 1px solid #ddd; text-align: center; padding: 30px; width: 100%; margin-top: 40px; padding-bottom: 0; text-transform: uppercase; font-weight: 500; font-size: 14px; color: #999; cursor: pointer; } .cu-header-lg { display: none; } .cu-header-sm { display: block; } #contactUsModal .btn-close { position: absolute; top: 25px; right: 25px; filter: brightness(0) invert(1); z-index: 9999; opacity: 1; } } @media (max-width: 768px) { .ic_top_t { font-size: 28px!important; } } @media (max-width: 991px) { .ic_top_t { font-size: 32px; } } </style> <style> @media (min-width: 1750px) { .header-transparent.header-slider-full .header_logo { max-height: 160px; min-height: 160px; } .header_logo { position: absolute; max-height: 110px; min-height: 110px; top: -32px; } .cf-max-w { max-width: 1600px; } .cf-max-w2 { max-width: 1800px; } .header-bar { padding: 50px 0; height: 144px; } .mnu_btn { font-size: 1.6rem !important; } #navbar .nav-link:not(.active) span::after { top: 35px; } .mnu_cta { font-size: 24px!important; } .mnu_cta_2 { font-size: 24px !important; padding: 15px 35px; } .video-section { height: 700px; } .h1_1 { font-size: 5.5rem; } .h1_2 { font-size: 3.5rem; } .an_num_2 { font-size: 55px; } .an_text_2 { font-size: 35px; line-height: 38px; margin-top: 5px; } .an_num_container { padding: 25px 0; padding-top: 35px; } .ps_title { font-size: 75px; } .mw-1000 { max-width: 1300px; } #why-gdm .ps_description { font-size: 42px; line-height: 55px; padding-top: 15px; } #wgdm_home { padding-top: 30px; } #why-gdm { padding-bottom: 128px; } #rnc_home { padding-top: 128px; padding-bottom: 128px; } #rnc_home .pi_cta { padding: 15px 20px; } .wws-350 { padding: 53px 30px; } #who-we-serve .ps_title { font-size: 60px; } #who-we-serve .ps_description { font-size: 32px; line-height: 45px; } #who-we-serve .pi_cta { padding: 15px 20px; } #who-we-serve { height: 750px; } footer a { font-size: 18px; } .footer-copy { font-size: 18px; } #gdm-chat { width: 130%; } #sticky-widget { right: 50px; } #notification-badge { top: -3px; right: -27px; width: 25px; height: 25px; font-size: 17px; line-height: 19px; } #yellow-box p { font-size: 20px; line-height: 26px; } #close-btn { width: 24px; height: 24px; top: 0px; left: -32px; } .gsap-box-grid { grid-gap: 2.2rem; } .gsap-box .gsap-box-title { font-size: 26px; } .gsap-box .gsap-box-desc { font-size: 1.4rem; padding-top: 15px; } .gsap-box svg { width: 75px; } #digital-solutions .ps_title { font-size: 5.5rem; font-weight: 900; } #who-we-serve-extended .ps_title { font-size: 5.5rem; font-weight: 900; } .gsap-box-2 .gsap-box-2-title { font-size: 26px; } .gsap-box-2-info img { width: 105px; top: -70px; } .oi_items span { font-size: 18px; padding: 18px 0; } #get-started .pi_cta { font-size: 26px !important; } } </style> <link rel="preload" href="https://localbox.graydigitalmedia.com/assets/img/pages/home/video-intro-preview/default-intro.webp" as="image"> <link rel="stylesheet" href="https://localbox.graydigitalmedia.com/assets/css/aos.css"> <script src="https://www.google.com/recaptcha/api.js" async defer></script> <link rel="canonical" href="https://graydigitalmedia.com/">  <script async src="https://www.googletagmanager.com/gtag/js?id=G-97CM82ZT6E"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-97CM82ZT6E'); </script> </head> <body class="body-slider-full"> <div class="menu_backdrop"></div> <header class="sticky-top header-bar bg-white header-transparent header-slider-full" data-page="home"> <nav class="navbar navbar-expand-xl d-flex flex-wrap justify-content-center container-fluid px-0" id="navbar"> <a href="/" class="d-flex align-items-center mb-md-0 me-auto z-999 ms-3 ms-xl-5"> <img src="https://localbox.graydigitalmedia.com/assets/img/logos/kait-logo-transparent.svg" class="header_logo" id="header_logo" alt="Logo"> </a> <button class="navbar-toggler me-3 position-relative" type="button" data-bs-toggle="collapse" data-bs-target="#navbarMenu" aria-controls="navbarMenu" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse w-100 px-3 px-xl-0" id="navbarMenu"> <div class="d-block d-xl-flex align-items-center w-100 position-relative"> <ul class="navbar-nav mb-2 mb-lg-0 nav__links d-flex justify-content-center flex-grow-1"> <li class="nav-item px-0 px-xl-2"> <a class="nav-link nav-link-blue mnu_btn" href="/"><span>HOME</span></a> </li> <li class="nav-item px-0 px-xl-2"> <a class="nav-link nav-link-red mnu_btn" href="https://graydigitalmedia.com/solutions/"><span>SOLUTIONS</span></a> </li> <li class="nav-item px-0 px-xl-2"> <a class="nav-link nav-link-red mnu_btn" href="https://graydigitalmedia.com/insights/"><span>INSIGHTS</span></a> </li> <li class="nav-item px-0 px-xl-2"> <a class="nav-link nav-link-yellow mnu_btn" href="https://graydigitalmedia.com/get-started/"><span>GET STARTED</span></a> </li> </ul> <div class="d-flex align-items-center position-absolute end-0 me-0 me-xl-5 mt-3 mt-xl-0"> <a class="mnu_cta last_mnu_cta ms-5 me-4" href="https://insights.gray.tv/login" target="_blank">CLIENT LOGIN</a> <a href="javascript:;" class="mnu_cta_2" data-bs-toggle="modal" data-bs-target="#contactUsModal">CONTACT US</a> </div> </div> </div> </nav> <div class="progress-container"> <div class="progress-bar" id="myBar"></div> </div> </header>  <section id="home" class="video-section"> <div class="video-container"> <iframe src="https://player.vimeo.com/video/1019608332?autoplay=1&muted=1&loop=1&background=1" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen class="video-iframe d-none d-md-block vi-1"></iframe> <iframe src="https://player.vimeo.com/video/1019608410?autoplay=1&muted=1&loop=1&background=1" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen class="video-iframe d-block d-md-none vi-2"></iframe> <div class="video-dark-overlay"></div> <div class="video-title-overlay"> <h1> <span class="d-block h1_1 vd-title">We Know Local</span> </h1> <div class="cta-wrapper"> <a class="video_cta d-inline-block video_modal" href="javascript:;" data-video="1019608447"> <svg xmlns="http://www.w3.org/2000/svg" width="110" height="110" fill="currentColor" viewBox="0 0 16 16"> <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M6.79 5.093A.5.5 0 0 0 6 5.5v5a.5.5 0 0 0 .79.407l3.5-2.5a.5.5 0 0 0 0-.814z"/> </svg> </a> </div> </div> <div class="container-xxl an_container an_container_video d-md-none"> <div class="row"> <div class="col-6 mb-3 pe-2"> <div class="an_num_container text-center"> <div class="d-block"><span class="an_num_2" data-start="122">152</span><span class="an_text_2">Industries <span class="an_num_4">Served</span></span></div> </div> </div> <div class="col-6 mb-3 ps-2"> <div class="an_num_container text-center"> <div class="d-block"><span class="an_num_2">16K+</span> <span class="an_text_2">Trusted <span class="an_num_4">Clients</span></span></div> </div> </div> <div class="col-6 pe-2"> <div class="an_num_container text-center"> <div class="d-block"><span class="an_num_2">17B+</span><span class="an_text_2">Impressions <span class="an_num_4">Delivered</span></span></div> </div> </div> <div class="col-6 ps-2"> <div class="an_num_container text-center"> <div class="d-block"><span class="an_num_2" data-start="359">389</span> <span class="an_text_2">Reporting <span class="an_num_4">Metrics</span></span></div> </div> </div> </div> </div> </div> </section>  <div class="page-section p-0 d-none d-md-block"> <div class="container-fluid px-5 an_container cf-max-w"> <div class="row"> <div class="col-3"> <div class="an_num_container text-center"> <div class="d-block"><span class="an_num_2" data-start="122">152</span><span class="an_text_2">Industries <span class="an_num_4">Served</span></span></div> </div> </div> <div class="col-3"> <div class="an_num_container text-center"> <div class="d-block"><span class="an_num_2">16K+</span> <span class="an_text_2">Trusted <span class="an_num_4">Clients</span></span></div> </div> </div> <div class="col-3"> <div class="an_num_container text-center"> <div class="d-block"><span class="an_num_2">17B+</span><span class="an_text_2">Impressions <span class="an_num_4">Delivered</span></span></div> </div> </div> <div class="col-3"> <div class="an_num_container text-center"> <div class="d-block"><span class="an_num_2" data-start="359">389</span> <span class="an_text_2">Reporting <span class="an_num_4">Metrics</span></span></div> </div> </div> </div> </div> </div>  <div class="page-section pt-md-3 position-relative" id="why-gdm"> <div class="container-fluid px-3 px-xl-5 cf-max-w"> <div class="row text-center"> <div class="col-12 mb-0 mb-md-5 pb-5"> <img class="w-100 px-4 pb-4 d-inline d-md-none" src="https://localbox.graydigitalmedia.com/assets/img/pages/home/why_gdm_phone.svg?v=01" alt="Why GDM"> <img class="w-100 px-8rem d-none d-md-inline" src="https://localbox.graydigitalmedia.com/assets/img/pages/home/why_gdm_desktop.svg?v=01" alt="Why GDM"> </div> <div class="col-6 col-md-3"> <div class="wg_container" data-index="1" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1500"> <img src="https://localbox.graydigitalmedia.com/assets/img/pages/home/innovative1.svg?v=01" alt="Innovative Strategies"> </div> </div> <div class="col-6 col-md-3"> <div class="wg_container" data-index="1" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1500" data-aos-delay="300"> <img src="https://localbox.graydigitalmedia.com/assets/img/pages/home/inhouse2.svg?v=01" alt="In-House Team"> </div> </div> <div class="col-6 col-md-3"> <div class="wg_container" data-index="2" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1500" data-aos-delay="600"> <img src="https://localbox.graydigitalmedia.com/assets/img/pages/home/transparent3.svg?v=01" alt="Transparent Reporting"> </div> </div> <div class="col-6 col-md-3"> <div class="wg_container" data-index="4" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="1500" data-aos-delay="900"> <img src="https://localbox.graydigitalmedia.com/assets/img/pages/home/proven4.svg?v=01" alt="Proven Results"> </div> </div> </div> </div> </div>  <div class="page-section position-relative" id="rnc_home"> <div class="container-fluid px-3 px-xl-5 cf-max-w"> <div class="row d-flex align-items-center mx-1 p-0" id="rnc_col_home"> <div class="col-lg-5 col-12 p-0"> <span class="rnc_home_image"></span> </div> <div class="col-lg-7 col-12 text-center px-3 px-lg-5"> <h2 class="ps_title g-text-dark-blue-1 mt-4 mt-lg-0 hr_rnc pt-3 pt-lg-0" id="rnc_title">Reach New Customers</h2> <p class="ps_description" id="rnc_desc">Whether your aim is to heighten brand awareness, foster audience engagement, or cultivate leads, we'll tailor the perfect blend to align with your objectives.</p> <a class="pi_cta btn btn-primary mt-3" id="rnc_button" href="https://graydigitalmedia.com/solutions/">View Our Digital Solutions</a> </div> </div> </div> </div>  <div class="page-section p-0 position-relative" id="who-we-serve"> <div class="container-xxl h-100 d-flex justify-content-center align-items-center px-5 px-lg-0"> <div class="row w-100"> <div class="col wws-350 d-flex flex-column align-items-center justify-content-center text-center" id="wwx_box"> <h2 class="ps_title text-white" id="wws_title">Who We Serve</h2> <p class="ps_description text-white" id="wws_desc">We serve clients in over 150 different industries, each with unique needs.</p> <a class="pi_cta mt-3 mb-2" id="wws_btn" href="https://graydigitalmedia.com/industries/">Learn more</a> </div> </div> </div> <div class="wws"> <div class="wwsBoxes"></div> </div> </div> <script> window.addEventListener('load', initGallery); function initGallery() { var column = -1, mouse = { x: 0, y: 0 }, wwsBoxes = document.querySelector('.wwsBoxes'); var images = [ { url: 'education-gdm.webp', name: 'Education' }, { url: 'furniture-gdm.webp', name: 'Furniture' }, { url: 'legal-gdm.webp', name: 'Legal' }, { url: 'auto-gdm.webp', name: 'Automotive' }, { url: 'recruitment-gdm.webp', name: 'Recruitment' }, { url: 'healthcare-gdm.webp', name: 'Healthcare' }, { url: 'banking-gdm.webp', name: 'Banking' }, { url: 'retail-gdm.webp', name: 'Retail' }, { url: 'hvac-gdm.webp', name: 'HVAC' }, { url: 'home-services-gdm.webp', name: 'Home Services' }, { url: 'entertainment-gdm.webp', name: 'Entertainment' }, { url: 'insurance-gdm.webp', name: 'Insurance' }, { url: 'food-beverage-gdm.webp', name: 'Food & Beverage' }, { url: 'electrical-gdm.webp', name: 'Electrical' }, { url: 'qsr-gdm.webp', name: 'Franchises' }, { url: 'rv-gdm.webp', name: 'RVs' }, { url: 'government-gdm.webp', name: 'Government' }, { url: 'agriculture-gdm.webp', name: 'Agriculture' }, { url: 'casino-gdm.webp', name: 'Casinos' }, { url: 'real-estate-gdm.webp', name: 'Real Estate' } ]; var originalImages = [...images]; for (var i = 0; i < 68; i++) { column = Math.floor(i / 4); var b = document.createElement('div'); var randomIndex = Math.floor(Math.random() * images.length); var selectedImage = images[randomIndex]; if (images.length === 0) { images = [...originalImages]; randomIndex = Math.floor(Math.random() * images.length); selectedImage = images[randomIndex]; } images.splice(randomIndex, 1); var loadingText = document.createElement('span'); loadingText.textContent = selectedImage.name; b.appendChild(loadingText); wwsBoxes.append(b); gsap.set(b, { attr: { id: 'b' + i, class: 'photoBox pb-col' + column }, backgroundImage: 'url(https://localbox.graydigitalmedia.com/assets/img/pages/home/gsap-gallery/' + selectedImage.url + ')', backgroundSize: 'cover', backgroundPosition: 'center', overflow: 'hidden', x: [60, 280, 500, 720, 940, 1160, 1380, 1600, 1820, 2040, 2260, 2480, 2700, 2920, 3140, 3360, 3580][column], width: 400, height: 740, borderRadius: 2, scale: 0.5, zIndex: 1, position: 'absolute', cursor: 'pointer' }); b.tl = gsap.timeline({ repeat: -1, defaults: { duration: 1, ease: 'power1.inOut' } }) .fromTo(b, { y: Array(17).fill(999)[column], rotation: -0.05 }, { duration: [40, 35, 40, 30, 36, 38, 42, 39, 34, 37, 41, 33, 38, 35, 40, 36, 39][column] * 1.5, y: Array(17).fill(-575)[column], rotation: 0.05, ease: 'none' }) .to(b, { opacity: 0 }, '-=1') .fromTo(b, { opacity: 0 }, { opacity: 1 }, 0) .progress(i % 4 / 4); } gsap.timeline() .set('.wws', { perspective: 2000 }) .add(() => window.enable_slide_3_animation = true) .fromTo('.wws', { autoAlpha: 0 }, { duration: 0.6, ease: 'power2.inOut', autoAlpha: 1 }, 0.2); } document.addEventListener("DOMContentLoaded",function(){ if (document.querySelector('.video-title-overlay')) { let tl = gsap.timeline(); tl.from(".vd-title", { duration: 1, y: 150, autoAlpha: 0, ease: Power3.out }).from(".cta-wrapper", { duration: 1, autoAlpha: 0, ease: Power3.out }, "+=.3"); } }); document.addEventListener("DOMContentLoaded",function(){ AOS.init(); }); </script> <script> document.addEventListener("DOMContentLoaded", function() { const rnc_desc = document.querySelector("#rnc_desc"); const rnc_title = new SplitText("#rnc_title", {type: "lines"}); const rnc_button = document.querySelector("#rnc_button"); gsap.timeline({ scrollTrigger: { trigger: '#rnc_home', start: '100px 80%', end: '100% 0', toggleActions: 'play none none none', onEnter: self => self.animation.play(), onEnterBack: self => self.animation.play() }, defaults: { ease: 'power1.inOut', duration: 1 } }) .from(rnc_title.lines, { opacity: 0, yPercent: 100, stagger: 0.2 }, 0) .from(rnc_desc, { opacity: 0, yPercent: 50, scale: 0.95, duration: 1.2, ease: 'power2.inOut' }, 0) .from(rnc_button, { opacity: 0, yPercent: 100 }, 0); gsap.set("#wws_title, #wws_desc, #wws_btn", { opacity: 0, display: "none" }); gsap.set("#wwx_box", { maxWidth: 0 }); gsap.timeline({ scrollTrigger: { trigger: '#who-we-serve', start: 'top 80%', end: 'bottom 20%', toggleActions: 'play none none none' } }) .to("#wwx_box", { maxWidth: "600px", duration: 0.5 }) .call(() => { gsap.set("#wws_title, #wws_desc, #wws_btn", { display: "block" }); }) .to("#wwx_box", { borderTop: "10px solid #fbbf16", duration: 0.5 }, "<") .to(["#wws_title", "#wws_desc", "#wws_btn"], { opacity: 1, duration: 0.5 }, "<"); }); </script> <div id="footer-container"> <div class="container-fluid px-0"> <footer class="row m-0 p-0"> <div class="col-12 d-flex justify-content-between align-items-center ps-3 ps-xl-5" id="footer_col_info"> <div class="d-flex align-items-center fm-c"> <a href="https://gray.tv" target="_blank" rel='noopener' class="d-none d-xl-block"> <img src="https://localbox.graydigitalmedia.com/assets/img/logos/logo_footer.svg" alt="Logo"> </a> <div class="ps-0 ps-xl-5 fm-c"> <a href="https://gray.tv/termsofuse" target="_blank" rel="noopener" class="me-4">Terms of Service</a> <a href="https://gray.tv/privacypolicy" target="_blank" rel="noopener" class="me-4">Privacy Policy</a> <div class="d-block pt-4 pb-2 d-md-inline py-md-0"> <a href="https://www.linkedin.com/company/gray-digital-media/" target="_blank" rel="noopener" class="bf-social"> <i class="bi bi-linkedin"></i> </a> <a href="https://www.facebook.com/GrayDigitalMedia/" target="_blank" rel="noopener" class="bf-social"> <i class="bi bi-facebook"></i> </a> </div> <span class="footer-span d-none d-md-inline fi-ts">|</span> <span class="footer-copy d-block d-md-inline mt-3 pt-md-0 fi-tt">Copyright 2024 Gray Media, Inc. All Rights Reserved</span> </div> </div> </div> </footer> </div> </div>  <div class="modal fade" id="contactUsModal" tabindex="-1" aria-labelledby="contactUsModalLabel" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered"> <form class="modal-content" id="contactForm"> <div class="modal-header cu-header-lg"> <div> <h5 class="modal-title" id="contactUsModalLabel">Schedule a Consultation</h5> <p class="modal-description">Fill out the form below, and we will get back to you as soon as possible to arrange your consultation.</p> </div> <img src="https://localbox.graydigitalmedia.com/assets/img/logos/kait-logo-white.svg" class="tclogo" alt="Logo"> </div> <div class="modal-header cu-header-sm"> <div> <p class="modal-description">Schedule a Consultation</p> </div> <img src="https://localbox.graydigitalmedia.com/assets/img/logos/kait-logo-white.svg" class="tclogo" alt="Logo"> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <div class="row d-flex"> <div class="col-12 mb-3"> <div id="alertPlaceholder"></div> </div> <div class="col-12 col-md-6 my-3"> <input type="text" class="form-control" name="c_name" id="c_name" placeholder="Name" required> </div> <div class="col-12 col-md-6 my-3"> <input type="text" class="form-control" name="c_company" id="c_company" placeholder="Company" required> </div> <div class="col-12 col-md-6 my-3"> <input type="text" class="form-control" name="c_city" id="c_city" placeholder="City" required> </div> <div class="col-12 col-md-6 my-3"> <select class="form-select" name="c_state" id="c_state" placeholder="State" required> <option value="AL">Alabama</option> <option value="AK">Alaska</option> <option value="AZ">Arizona</option> <option value="AR">Arkansas</option> <option value="CA">California</option> <option value="CO">Colorado</option> <option value="CT">Connecticut</option> <option value="DE">Delaware</option> <option value="DC">District Of Columbia</option> <option value="FL">Florida</option> <option value="GA">Georgia</option> <option value="HI">Hawaii</option> <option value="ID">Idaho</option> <option value="IL">Illinois</option> <option value="IN">Indiana</option> <option value="IA">Iowa</option> <option value="KS">Kansas</option> <option value="KY">Kentucky</option> <option value="LA">Louisiana</option> <option value="ME">Maine</option> <option value="MD">Maryland</option> <option value="MA">Massachusetts</option> <option value="MI">Michigan</option> <option value="MN">Minnesota</option> <option value="MS">Mississippi</option> <option value="MO">Missouri</option> <option value="MT">Montana</option> <option value="NE">Nebraska</option> <option value="NV">Nevada</option> <option value="NH">New Hampshire</option> <option value="NJ">New Jersey</option> <option value="NM">New Mexico</option> <option value="NY">New York</option> <option value="NC">North Carolina</option> <option value="ND">North Dakota</option> <option value="OH">Ohio</option> <option value="OK">Oklahoma</option> <option value="OR">Oregon</option> <option value="PA">Pennsylvania</option> <option value="RI">Rhode Island</option> <option value="SC">South Carolina</option> <option value="SD">South Dakota</option> <option value="TN">Tennessee</option> <option value="TX">Texas</option> <option value="UT">Utah</option> <option value="VT">Vermont</option> <option value="VA">Virginia</option> <option value="WA">Washington</option> <option value="WV">West Virginia</option> <option value="WI">Wisconsin</option> <option value="WY">Wyoming</option> </select> </div> <div class="col-12 col-md-6 my-3"> <input type="text" class="form-control" name="c_email" id="c_email" placeholder="Email Address" required> </div> <div class="col-12 col-md-6 col-lg-6 my-3"> <input type="text" class="form-control" name="c_phone" id="c_phone" pattern="\(?\d{3}\)?[- ]?\d{3}[- ]?\d{4}" placeholder="Phone" required> </div> <div class="col-12 my-3"> <textarea class="form-control" name="message" id="c_message" rows="4" placeholder="Message"></textarea> </div> </div> </div> <div class="modal-footer d-flex justify-content-between"> <div class="g-recaptcha" data-sitekey="6LfzEWYqAAAAAC9yZ7j935-DaoXafXIXz6GXCQFM" ></div> <button type="submit">Submit</button> <span class="close_contact_mobile" data-bs-dismiss="modal" aria-label="Close">Close contact & back to site</span> </div> </form> </div> </div> <div class="modal fade" id="test_your_site_modal" tabindex="-1" aria-hidden="true"> <div class="modal-dialog modal-dialog-centered modal-lg"> <div class="modal-content"> <div class="modal-body p-0"> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <section id="test_your_site_section" class="contact"> <div class="container text-center container_iframe" data-aos="fade-up"> <div class="iframe_1 d-none" style="width: 100%;display: flex;"></div> <div class="iframe_0 d-none" style="width: 100%;position:absolute;"> <img class="tts_4" src="https://localbox.graydigitalmedia.com/assets/img/logos/logo.svg" alt="Logo"> <h2 class="ps_title g-text-dark-blue-1 text-center" style="font-size:30px;">Thank you for submitting your information!</h2> <span class="ps_description m-auto d-block g-fz-17 mb-5">The Site Analysis Tool is currently generating your profile. You will receive your report via email soon.</span> <a href="javascript:;" data-bs-dismiss="modal" class="pi_cta_outline is-hvr text-center px-10">Continue</a> </div> <div class="loading_iframe_container d-none"><img src="https://localbox.graydigitalmedia.com/assets/img/template/loading_test.gif" alt="Loading"></div> <div class="iframe_2"> <h2 class="ps_title g-text-dark-blue-1 text-center">Test Your Site</h2> <span class="ps_description m-auto d-block g-fz-17">Test your website’s digital footprint with GDM’s FREE Digital Analysis Tool. We will analyze over 20 aspects of your website to get a full understanding of your digital strengths and opportunities!</span> <div class="row mt-4 pt-3"> <div class="col-lg-12 mt-0"> <form class="gdm_contact_form test_your_site_form" id="test_your_site_form"> <div class="row"> <div class="col-md-12 form-group"> <input type="text" name="tyw_website" class="form-control input_mandatory" id="tyw_website" placeholder="Website URL" required></div> </div> <div class="row mt-3 mt-md-4"> <div class="col-md-6 form-group"> <input type="email" name="tyw_email" class="form-control" id="tyw_email" placeholder="Email Address" required></div> <div class="col-md-6 form-group mt-3 mt-md-0"> <input type="text" class="form-control" name="tyw_name" id="tyw_name" placeholder="Name" required></div> </div> <div class="row mt-3 mt-md-4"> <div class="col-md-6 form-group"> <input type="text" class="form-control" name="tyw_business_name" id="tyw_business_name" placeholder="Business Name" required></div> <div class="col-md-6 form-group mt-3 mt-md-0"> <input type="text" name="tyw_business_phone" class="form-control" id="tyw_business_phone" placeholder="Business Phone" pattern="(?:\(\d{3}\)|\d{3})[- ]?\d{3}[- ]?\d{4}" required></div> </div> <div class="row mt-3 mt-md-4"> <div class="col-md-6 form-group"> <input type="text" name="tyw_city" class="form-control" id="tyw_city" placeholder="City" required></div> <div class="col-md-6 form-group mt-3 mt-md-0"> <input type="text" class="form-control" name="tyw_state" id="tyw_state" placeholder="State" required></div> </div> <div class="row mt-3 mt-md-4"> <div class="col-md-6 form-group"> <input type="text" name="tyw_street_address" class="form-control" id="tyw_street_address" placeholder="Street Address" required></div> <div class="col-md-6 form-group mt-3 mt-md-0"> <input type="text" class="form-control" name="tyw_zip_code" id="tyw_zip_code" placeholder="Postal / ZIP Code" required></div> </div> <div class="row mt-3 mt-md-4"> <div class="col-12 w-100 mb-4"><span class="test_top_separator"></span></div> <div class="col-5 form-group tts_1 text-start"> <img class="tts_2" src="https://localbox.graydigitalmedia.com/assets/img/logos/logo.svg" alt="Logo"> </div> <div class="col-7 form-group tts_3 text-end"> <button class="pi_cta is-hvr mt-3" type="submit">Analyze Now</button> </div> </div> </form> </div> </div> </div> </div> </section> </div> </div> </div> </div> <div id="sticky-widget" class="hidden d-none d-md-flex"> <div id="notification-badge"> <span>1</span> </div> <div id="close-btn">✕</div> <a data-bs-toggle="modal" data-bs-target="#contactUsModal" class="is-hvr yb"> <div id="yellow-box"> <p>Welcome to GDM!<br>Are you ready to get started?</p> </div> </a> <a data-bs-toggle="modal" data-bs-target="#contactUsModal" class="is-hvr"> <img id="gdm-chat" src="https://localbox.graydigitalmedia.com/assets/img/template/gdm-chat.svg" alt="Chat Widget" /> </a> </div> <div id="sticky-widget-mb" class="d-md-none" data-aos="fade-right" data-aos-anchor-placement="top-bottom" data-aos-duration="1500" data-aos-delay="3000"> <div id="notification-badge-mb"> <span>1</span> </div> <a data-bs-toggle="modal" data-bs-target="#contactUsModal" class="is-hvr"> <img id="gdm-chat" src="https://localbox.graydigitalmedia.com/assets/img/template/gdm-chat.svg" alt="Chat Widget" /> </a> </div> <button type="button" class="d-md-none" id="scrollToTopBtn">↑</button> <script> document.addEventListener("DOMContentLoaded", function() { const header = document.querySelector("header"); const navbarCollapse = document.querySelector(".navbar-collapse"); const body = document.body; const navbarToggler = document.querySelector(".navbar-toggler"); const menu_backdrop = document.querySelector(".menu_backdrop"); navbarCollapse.addEventListener('show.bs.collapse', function () { header.classList.remove("header-transparent"); header.classList.add("header-bar-opened"); body.style.overflow = 'hidden'; menu_backdrop.classList.add("menu_backdrop_active"); setTimeout(() => navbarCollapse.classList.add("top-no-transition"), 500); setTimeout(() => header.classList.add("top-no-transition"), 500); }); navbarCollapse.addEventListener('hide.bs.collapse', function () { if (typeof handleScroll === 'function') { handleScroll(); } body.style.overflow = 'auto'; header.classList.remove("header-bar-opened"); menu_backdrop.classList.remove("menu_backdrop_active"); setTimeout(() => header.classList.remove("top-no-transition"), 500); setTimeout(() => navbarCollapse.classList.remove("top-no-transition"), 500); }); document.addEventListener('click', function(event) { if (navbarCollapse.classList.contains('show') && !navbarToggler.contains(event.target) && !navbarCollapse.contains(event.target)) { const bsCollapse = new bootstrap.Collapse(navbarCollapse, { toggle: false }); bsCollapse.hide(); } }); }); document.querySelector('.mnu_cta_2').addEventListener('click', function() { if (document.querySelector('.menu_backdrop_active')) { document.querySelector('.navbar-toggler').click(); } }); window.addEventListener('scroll', function() { var winScroll = document.body.scrollTop || document.documentElement.scrollTop; var height = document.documentElement.scrollHeight - document.documentElement.clientHeight; var scrolled = (winScroll / height) * 100; document.getElementById("myBar").style.width = scrolled + "%"; }); window.addEventListener('scroll', function() { const scrollToTopBtn = document.getElementById('scrollToTopBtn'); if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 300) { scrollToTopBtn.style.display = 'block'; } else { scrollToTopBtn.style.display = 'none'; } }); document.getElementById('scrollToTopBtn').onclick = function() { window.scrollTo({ top: 0, behavior: 'smooth' }); }; </script> <script src="https://localbox.graydigitalmedia.com/assets/js/bootstrap.bundle.min.js"></script> <script src="https://localbox.graydigitalmedia.com/assets/js/main.js?v=02"></script> <script src="https://localbox.graydigitalmedia.com/assets/js/combined-gsap.min.js?v=01"></script> <script src="https://player.vimeo.com/api/player.js" defer></script><script src="https://localbox.graydigitalmedia.com/assets/js/aos.js" defer></script> </body> </html>