@charset "utf-8";
/* CSS Document */


body { 
	margin:0;
	padding:0;
	border:0;
	background-color:#FFF;
	background-repeat:repeat-x;
}

/* Final homepage readability overrides. Keep these after the archived rules so
   the larger copy has enough room and never overlaps the welcome section. */
#products,
#products .product-box-bg {
  height: 390px;
}
#products .product-box-bg {
  background-repeat: repeat-y;
}

/* Match the original rounded end caps on both ends of the navigation bar. */
#menu > :first-child {
  border-radius: 8px 0 0 8px;
}
#menu > :last-child {
  border-radius: 0 8px 8px 0;
}
/* Restored-site compatibility: preserve the archived design while allowing it
   to use the full browser viewport on modern phones, tablets, and desktops. */
html, body { margin: 0; min-width: 0; }
#wrap { width: min(980px, 100%); max-width: 980px; }
img { max-width: 100%; }
.archive-video-link {
  display: block; margin: 12px auto 22px; padding: 12px 18px; width: fit-content;
  color: #fff !important; background: #c84c22; border-radius: 3px;
  font: bold 14px Arial, Helvetica, sans-serif; text-decoration: none;
}
@media (max-width: 980px) {
  #head, #head2 { width: 100%; background-size: cover; }
  #menu {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    width: calc(100% - 10px);
    height: 40px;
    margin-left: 5px;
  }
  #menu > a,
  #menu > img {
    flex: 1 1 0;
    min-width: 0;
    max-width: 139px;
  }
  #menu img { width: 100%; max-width: none; height: 40px; }
  .body, .left2, .footer { width: auto; max-width: 100%; }
  table { max-width: 100%; }
}
#videogalholder { display: none; }

/* Repair two archived navigation assets that Wayback preserved as HTML error
   pages instead of JPEGs. The replacement buttons stay visible before hover
   and remain fully clickable. */
#menu a[href="services.html"]:has(img[src$="menu_services.jpg"]),
#menu a[href="links.html"]:has(img[src$="menu_links.jpg"]) {
  box-sizing: border-box;
  display: block;
  width: 139px;
  height: 40px;
  float: left;
  background: linear-gradient(#29536d, #16384f);
  border-left: 1px solid rgba(255,255,255,.14);
  border-right: 1px solid rgba(0,0,0,.2);
  color: #fff;
  font: bold 13px/40px Arial, Helvetica, sans-serif;
  letter-spacing: .02em;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px 1px #000;
}
#menu a[href="services.html"]:has(img[src$="menu_services.jpg"])::after { content: "SERVICES"; }
#menu a[href="links.html"]:has(img[src$="menu_links.jpg"])::after { content: "LINKS"; }
#menu a[href="services.html"]:has(img[src$="menu_services.jpg"]):hover,
#menu a[href="links.html"]:has(img[src$="menu_links.jpg"]):hover {
  background: linear-gradient(#40caf9, #0094fe);
}
#menu a[href="services.html"] img[src$="menu_services.jpg"],
#menu a[href="links.html"] img[src$="menu_links.jpg"] { display: none; }
#menu > a {
  display: block;
  width: 139px;
  height: 40px;
  float: left;
}
#menu > a > img { display: block; float: none; }

/* Keep all seven archived navigation buttons, including Contact Us, on one
   horizontal row at every non-mobile viewport width. */
@media (max-width: 980px) {
  #menu > a { width: auto; }
  #menu a[href="services.html"]:has(img[src$="menu_services.jpg"]),
  #menu a[href="links.html"]:has(img[src$="menu_links.jpg"]) {
    width: auto;
    font-size: clamp(8px, 1.3vw, 13px);
  }
}

/* The original fade script left the three homepage products permanently
   washed out when its archived JavaScript was unavailable. */
#products .product-box { opacity: 1; }
#products .product-holder img { opacity: 1 !important; }
#products .desc p {
  color: #111;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  text-shadow: none;
  float: none;
  margin: 0 auto;
}
#products .desc { text-align: center; }

/* Readable, consistently separated testimonials on the Clients page. */
.testimonials-page > .generic-box1:not(:has(#customer-organizations)) {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 26px 30px;
  float: none;
  overflow: visible;
  border-bottom: 0;
}
.testimonials-page > .generic-box1:not(:has(#customer-organizations))::after {
  content: "";
  position: absolute;
  left: 10%;
  bottom: 0;
  width: 80%;
  height: 2px;
  background: #b9d8ea;
}
.testimonials-page > .generic-box1:not(:has(#customer-organizations)) > a {
  float: none;
  color: #222;
  font-size: 21px;
  line-height: 1.4;
}
.testimonials-page > .generic-box1:not(:has(#customer-organizations)) p {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0;
  float: none;
  color: #222;
  font: normal 17px/1.65 Arial, Helvetica, sans-serif;
  text-align: left;
}
.testimonials-page > .generic-box1:not(:has(#customer-organizations)) p b {
  font-size: 18px;
}
@media (max-width: 700px) {
  .testimonials-page > .generic-box1:not(:has(#customer-organizations)) {
    padding: 22px 18px;
  }
}

/* One shared navigation treatment for every archived page.  Several original
   inactive button images were missing from the archive, so all clickable menu
   items are rendered from the same CSS instead of mixing images and fallbacks. */
#menu > a {
  box-sizing: border-box;
  display: block;
  flex: 1 1 0;
  width: 139px;
  min-width: 0;
  max-width: 140px;
  height: 40px;
  float: left;
  overflow: hidden;
  background: linear-gradient(#29536d, #16384f);
  border-left: 1px solid rgba(255,255,255,.14);
  border-right: 1px solid rgba(0,0,0,.2);
  color: #fff;
  font: bold 13px/40px Arial, Helvetica, sans-serif;
  letter-spacing: .02em;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px 1px #000;
  transition: background .15s ease, color .15s ease;
}
#menu > a > img { display: none !important; }
#menu > a[href="index.html"]::after { content: "HOME"; }
#menu > a[href="services.html"]::after { content: "SERVICES"; }
#menu > a[href="products.html"]::after { content: "PRODUCTS"; }
#menu > a[href="clients.html"]::after { content: "CLIENTS"; }
#menu > a[href="links.html"]::after { content: "LINKS"; }
#menu > a[href="about.html"]::after { content: "ABOUT"; }
#menu > a[href="contact.html"]::after { content: "CONTACT"; }
#menu > a:hover,
#menu > a:focus-visible {
  background: linear-gradient(#40caf9, #0094fe);
  color: #fff;
  outline: none;
}
#menu > a.is-current,
#menu > a.is-current:hover,
#menu > a.is-current:focus-visible,
#menu > .menu-active-page,
#menu > .menu-active-videos {
  background: linear-gradient(#40caf9, #0094fe);
}
#menu > img[src*="menu-active_"] {
  display: block;
  flex: 1 1 0;
  width: 139px;
  min-width: 0;
  max-width: 140px;
  height: 40px;
  float: left;
  object-fit: fill;
}
@media (max-width: 980px) {
  #menu > a {
    width: auto;
    font-size: clamp(7px, 1.3vw, 13px);
  }
  #menu > img[src*="menu-active_"] { width: auto; }
}
#products .desc > a {
  display: block;
  float: none;
  margin: 18px auto 8px;
  color: #111;
  text-align: center;
}
#products .desc p a,
#products .desc p a:link,
#products .desc p a:visited {
  display: inline;
  float: none;
  margin: 0;
  color: #0056a6;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-shadow: none;
}
#products,
#products .product-box-bg {
  height: 390px;
}
#products .product-box-bg {
  background-repeat: repeat-y;
}

/* Exactly 28 customer organizations: two balanced columns of 14. */
#customer-organizations {
  width: calc(100% - 40px);
  max-width: 900px;
  margin: 20px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(14, auto);
  grid-auto-flow: column;
  column-gap: 54px;
}
.generic-box1:has(#customer-organizations) table { width: 100%; }
#customer-organizations li {
  width: auto;
  float: none;
  margin: 0 0 0 20px;
  padding: 7px 0;
}
@media (max-width: 620px) {
  #customer-organizations {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-flow: row;
  }
}

#wrap {
	width:auto;
	max-width:980px;
	height:auto;
	margin:auto;
	overflow:hidden;
}
#head {
	width:980px;
	height:282px;
	background-image:url(images/bg-head.jpg);
	float:left;
}
#head2 {
	width:980px;
	height:190px;
	background-image:url(images/bg-head2.jpg);
	float:left;
}
	#logo {
		width:279px;
		height:91px;
		border:0;
		background-image:url(images/logo.png);
		margin:32px 0 0 0;
		float:left;
	}
	#head2 h1 {
		font-family:Arial, Helvetica, sans-serif;
		color:#e9e9e9;
		font-size:20px;
		margin:58px 0 0 0;
		text-align:right;
	}
	#head h1 {
		font-family:Arial, Helvetica, sans-serif;
		color:#e9e9e9;
		font-size:20px;
		margin:58px 0 0 0;
		text-align:right;
	}
	#menu {
		width:974px;
		height:40px;
		margin:0 0 0 5px;
		float:left;
	}
		#menu img {
			margin:0;
			border:0;
			float:left;
		}
	.product-text {
		width:980px;
		height:65px;
		margin-top:38px;
		float:left;
	}
		.product-text a {
			font-family:Arial, Helvetica, sans-serif;
			color:#e9e9e9;
			font-size:32px;
			font-weight:bold;
			text-align:center;
		}
.body {
	width:980px;
	height:auto;
	overflow:hidden;
	padding:12px 0 0 0;
	float:left;
}
	.sitemap {
		width:980px;
		height:auto;
		margin:8px 0 0 0;
		float:left;
		font-family:Arial, Helvetica, sans-serif;
		color:#666;
		font-size:11px;
		text-align:right;
	}
	.sitemap a:link {
		color:#09F;
		text-decoration:none;
	}
	.sitemap a:visited {
		color:#09F;
		text-decoration:none;
	}
	
#products {
	width:980px;
	height:330px;
	background-image:url(images/bg-products.jpg);
	float:left;
}
	.product-box-bg {
		width:312px;
		height:330px;
		background-image:url(images/product-box.png);
		float:left;
		margin-left:10px;
	}
	.product-box {
		width:312px;
		border:0;
		float:left;
		opacity: 0.6;
		border:0;
	}
	
		.product-holder a {
			width:258px;
			height:155px;
			margin:20px 0 0 21px;
			border:#666 solid 6px;
			float:left;
		}
			
		.product-box a {
			margin:22px 0 0 20px;
			float:left;
		}
		.product-box img {
			border:0;
		}
		.desc a {
			font-family:Arial, Helvetica, sans-serif;
			font-size:18px;
			font-weight:bold;
			color:#FFF;
			margin:22px 0 0 20px;
			float:left;
		}
		.desc {
			width:258px;
			height:auto;
			float:left;
		}
		.desc p {
			width:270px;
			font-family:Arial, Helvetica, sans-serif;
			font-size:13px;
			color:#CCC;
			margin:0 0 0 20px;
			text-align:left;
			float:left;
			padding-right:10px;
		}
		.desc a:link {
			font-family:Arial, Helvetica, sans-serif;
			font-size:13px;
			color:#09F;
			margin:0;
			text-decoration:none;
			float:none;
			border:0;
		}
		.desc a:visited {
			color:#09F;
			
		}
		
	.body-intro a {
		width:980px;
		font-family:Arial, Helvetica, sans-serif;
		color:#333;
		font-size:32px;
		font-weight:bold;
		border-bottom:#CCC 12px solid;
		padding-bottom:6px;
		text-align:left;
		float:left;
		margin:22px 0 12px 0;
	}
	.generic-box1 {
		width:980px;
		height:auto;
		overflow:hidden;
		padding:12px 0 12px 0;
		border-bottom:#CCC 1px solid;
		float:left;
	}
		.generic-box1 a {
				font-family:Arial, Helvetica, sans-serif;
				float:left;
				text-align:left;
				font-size:16px;
				font-weight:700;
				color:#333;
			}
			.generic-box1 p {
				font-family:Arial, Helvetica, sans-serif;
				float:left;
				font-size:14px;
				color:#333;
				text-align:left;
			}
			.generic-box1 ul {
				width:700px;
				font-family:Arial, Helvetica, sans-serif;
				font-size:14px;
				float:left;
			}
			.generic-box1 ul li {
				margin-left:20px;
				width:700px;
				font-family:Arial, Helvetica, sans-serif;
				font-size:14px;
				float:left;
				text-align:left;
				list-style:square;
				color:#333;
			}
			.generic-box1 ul li a:link {
				font-family:Arial, Helvetica, sans-serif;
				float:none;
				font-weight:normal;
				font-size:14px;
				color:#09F;
				text-decoration:none;
			}
			.generic-box1 ul li a:visited{
				font-family:Arial, Helvetica, sans-serif;
				float:none;
				font-weight:normal;
				font-size:14px;
				color:#09F;
				text-decoration:none;
			}
			
	.generic-box2 {
		width:490px;
		height:auto;
		overflow:hidden;
		padding:12px 0 32px 0;
		border-bottom:#CCC 1px solid;
		float:left;
	}
	.left {
		width:220px;
		height:auto;
		float:left;
	}
	.left a {
			font-family:Arial, Helvetica, sans-serif;
			text-align:center;
			margin-left:6px;
			font-size:14px;
			font-weight:700;
			color:#333;
			float:left;
		}
		.left h1 {
			font-family:Arial, Helvetica, sans-serif;
			text-align:left;
			line-height:0;
			margin-left:6px;
			font-size:24px;
			font-weight:700;
			color:#333;		
			float:left;
		}
		.left img {
			margin:8px 8px 8px 0px;
			float:left;
			border:0;
			
		}
	.right {
		width:700px;
		height:auto;
		float:left;
		border-left:#CCC 1px solid;
		padding-left:24px;
		margin-left:32px;   /* GDC changed 18px to 32 */
	}
		.right a {
			font-family:Arial, Helvetica, sans-serif;
			float:left;
			text-align:left;
			font-size:16px;
			font-weight:700;
			color:#333;
		}
		.right p {
			font-family:Arial, Helvetica, sans-serif;
			float:left;
			font-size:14px;
			color:#333;
			text-align:left;
		}
		.right img {
			float:left;
			margin-left:4px;
			padding:12px 0 12px 0;
			border:0;
		}
		.right ul {
			width:620px;
			font-family:Arial, Helvetica, sans-serif;
			font-size:14px;
			float:left;
		}
		.right ul li {
			margin-left:20px;
			width:600px;
			font-family:Arial, Helvetica, sans-serif;
			font-size:14px;
			float:left;
			text-align:left;
			list-style:square;
			color:#333;
		}
		.right ul li a:link {
			font-family:Arial, Helvetica, sans-serif;
			float:none;
			font-weight:normal;
			font-size:14px;
			color:#09F;
			text-decoration:none;
		}
		.right ul li a:visited{
			font-family:Arial, Helvetica, sans-serif;
			float:none;
			font-weight:normal;
			font-size:14px;
			color:#09F;
			text-decoration:none;
		}
		
.left2 {
		width:980px;
		height:auto;
		float:left;
		padding-bottom:8px;
		border-bottom:#CCC 1px solid;
	}
.left2 p {
		font-family:Arial, Helvetica, sans-serif;
		text-align:left;
		margin-left:6px;
		font-size:14px;
		color:#333;
		float:left;
		}

		
				
.footer {
	width:980px;
	height:auto;
	padding-top:24px;
	float:left;
}
	.footer a {
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;
		font-weight:700;
		color:#999;
		text-align:center;
	}
	.footer a:link {
		color:#09F;
		text-decoration:none;
		text-align:center;
	}
	.footer a:active {
		color:#09F;
		text-align:center;
	}
	.footer a:visited {
		color:#09F;
		text-align:center;
	}
		
		
	#wrap .body .generic-box1 .right ul li b {

}
#wrap .body .generic-box1 .right ul li em {
	font-weight: bold;


}
/* GDC Additions dubious */
#menupurch {
		width:974px;
		height:40px;
		margin:0 0 0 5px;
		float:left;
	}
		#menupurch img {
			margin:0;
			border:0;
			float:left;
		}

/* Final homepage readability overrides. */
#products,
#products .product-box-bg {
  height: 390px;
}
#products .product-box-bg {
  background-repeat: repeat-y;
}

/* Clean, evenly aligned homepage product columns. */
#products {
  box-sizing: border-box;
  display: flex;
  align-items: stretch;
  width: 100%;
  height: auto;
  padding: 20px 10px 28px;
  background: #fff;
}
#products .product-box-bg {
  box-sizing: border-box;
  flex: 1 1 0;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0 10px;
  background: #fff;
  float: none;
}
#products .product-box {
  width: 100%;
  height: 100%;
  float: none;
  opacity: 1;
}
#products .product-holder,
#products .product-holder > div {
  width: 100%;
  text-align: center;
}
#products .product-holder a {
  display: block;
  width: 258px;
  height: 155px;
  margin: 0 auto;
  border: 6px solid #666;
  float: none;
}
#products .product-holder img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1 !important;
}
#products .desc {
  box-sizing: border-box;
  width: 100%;
  height: auto;
  padding: 0 12px;
  float: none;
  text-align: center;
}
#products .desc > a {
  display: block;
  margin: 18px 0 9px;
  float: none;
  color: #111;
  font: bold 18px Arial, Helvetica, sans-serif;
  text-align: center;
}
#products .desc p {
  width: auto;
  margin: 0;
  padding: 0;
  float: none;
  color: #111;
  font: normal 16px/1.55 Arial, Helvetica, sans-serif;
  text-align: center;
  text-shadow: none;
}
#products .desc p a,
#products .desc p a:link,
#products .desc p a:visited {
  display: block;
  margin: 10px 0 0;
  float: none;
  color: #06c;
  font-weight: normal;
  text-decoration: underline;
  text-shadow: none;
}
@media (max-width: 760px) {
  #products { display: block; }
  #products .product-box-bg { margin-bottom: 28px; }
  #products .product-box-bg:last-child { margin-bottom: 0; }
}

/* Larger supporting copy and a working, self-contained share panel. */
.left2 p {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 8px 12px 18px;
  float: none;
  color: #222;
  font: normal 16px/1.6 Arial, Helvetica, sans-serif;
}
.footer > a {
  font-size: 16px;
  line-height: 1.7;
}
.footer-copyright {
  margin-top: 18px;
  font: normal 16px/1.7 Arial, Helvetica, sans-serif;
}

/* Restored DSP Speedster availability section. */
.speedster-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0 14px;
}
.right .speedster-actions > a {
  display: block;
  margin: 0;
  float: none;
}
.right .speedster-actions img {
  display: block;
  max-width: 100%;
  height: auto;
}
.speedster-availability {
  clear: both;
  margin: 0 0 22px;
  color: #333;
}
.speedster-availability h2 {
  margin: 0 0 10px;
  color: #222;
  font: bold 17px/1.35 Arial, Helvetica, sans-serif;
}
.right .speedster-availability ul {
  margin: 0 0 0 22px;
  padding: 0;
}
.right .speedster-availability li {
  margin: 4px 0;
  color: #444;
  font: normal 14px/1.35 Arial, Helvetica, sans-serif;
}
.right .speedster-availability a,
.right .speedster-availability a:link,
.right .speedster-availability a:visited {
  display: inline;
  margin: 0;
  float: none;
  color: #06c;
  font: inherit;
  text-decoration: none;
}

/* Use the full page width for the readable DSP Speedster article. */
.speedster-page-content {
  box-sizing: border-box;
  width: 100%;
  padding: 18px 0 26px;
}
.speedster-page-content > .left {
  display: none;
}
.speedster-page-content > .right {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0;
  border-left: 0;
  float: none;
}
.speedster-page-content .right > a {
  float: none;
  font-size: 18px;
  line-height: 1.45;
}
.speedster-page-content .right > img {
  display: block;
  clear: both;
  float: none;
  width: min(820px, 88%);
  max-width: 100%;
  height: auto;
  margin: 18px auto 24px;
  padding: 0;
}
.speedster-page-content .right ul {
  box-sizing: border-box;
  width: 100%;
  margin: 14px 0 22px;
  padding-left: 28px;
  float: none;
  font-size: 17px;
  line-height: 1.55;
}
.speedster-page-content .right ul li {
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 12px;
  float: none;
  color: #222;
  font-size: 17px;
  line-height: 1.55;
}
.speedster-page-content .product-interface-image {
  display: block;
  clear: both;
  width: min(820px, 94%);
  max-width: 100%;
  height: auto;
  margin: 20px auto 24px;
}
.speedster-page-content .right ul li a:link,
.speedster-page-content .right ul li a:visited {
  font-size: 17px;
}
.speedster-page-content .speedster-availability h2 {
  font-size: 19px;
}
.speedster-page-content .speedster-availability li {
  font-size: 17px;
}

/* Eight-item shared navigation, including Videos before Links. */
#menu {
  display: flex;
  flex-wrap: nowrap;
  width: calc(100% - 10px);
}
#menu > a,
#menu > img,
#menu > .menu-active-page,
#menu > .menu-active-videos {
  box-sizing: border-box;
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  max-width: none;
}
#menu > a[href="videos.html"]::after { content: ""; }
#menu > .menu-active-page,
#menu > .menu-active-videos {
  display: block;
  height: 40px;
  border-left: 1px solid rgba(255,255,255,.14);
  border-right: 1px solid rgba(0,0,0,.2);
  color: #fff;
  font: bold 13px/40px Arial, Helvetica, sans-serif;
  letter-spacing: .02em;
  text-align: center;
  text-shadow: 0 1px 1px #000;
}

/* Videos page content styled to match the rest of the restored site. */
.video-library {
  box-sizing: border-box;
  padding-bottom: 28px;
}
.video-intro {
  margin: 18px 24px 28px;
  color: #333;
  font: normal 17px/1.55 Arial, Helvetica, sans-serif;
  text-align: center;
}
.video-filter-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin: 20px 18px 26px;
  color: #222;
  font: bold 17px/1.4 Arial, Helvetica, sans-serif;
}
.video-filter-bar select {
  min-width: 220px;
  padding: 10px 38px 10px 12px;
  border: 1px solid #999;
  border-radius: 4px;
  background: #fff;
  color: #222;
  font: normal 17px/1.3 Arial, Helvetica, sans-serif;
}
.video-filter-bar select:focus {
  outline: 3px solid rgba(0, 153, 255, .3);
  outline-offset: 2px;
}
#video-filter-status {
  min-width: 120px;
  color: #555;
  font-weight: normal;
}
.video-filter-empty {
  margin: 28px 18px;
  color: #333;
  font: normal 17px/1.5 Arial, Helvetica, sans-serif;
  text-align: center;
}
.video-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  padding: 0 18px;
}
.video-grid article {
  overflow: hidden;
  border: 1px solid #ccc;
  background: #f7f7f7;
  text-align: left;
}
.video-frame { aspect-ratio: 16 / 9; }
.video-frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
.video-grid article > div:last-child { padding: 15px; }
.video-grid h2 {
  margin: 0 0 7px;
  color: #333;
  font: bold 18px/1.35 Arial, Helvetica, sans-serif;
}
.video-grid p {
  margin: 0;
  color: #666;
  font: normal 16px/1.4 Arial, Helvetica, sans-serif;
}
@media (max-width: 900px) {
  .video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .video-grid { grid-template-columns: 1fr; padding: 0 14px; }
  .video-filter-bar { align-items: stretch; flex-direction: column; }
  .video-filter-bar select { width: 100%; }
  #menu > a,
  #menu > .menu-active-page,
  #menu > .menu-active-videos { font-size: clamp(6px, 1.2vw, 11px); }
}
.share-area {
  box-sizing: border-box;
  width: 100%;
  margin: 0 0 22px;
  padding: 16px;
  border: 1px solid #ddd;
  background: #f7f7f7;
  text-align: left;
}
.share-label {
  display: block;
  margin-bottom: 10px;
  color: #444;
  font: bold 14px Arial, Helvetica, sans-serif;
}
.share-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}
.share-button,
.share-button:link,
.share-button:visited {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: #2867a8;
  color: #fff;
  font: bold 14px Arial, Helvetica, sans-serif;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
}
.share-button:hover,
.share-button:focus-visible {
  background: #174b80;
  color: #fff;
}
.share-button svg {
  display: block;
  width: 21px;
  height: 21px;
  fill: currentColor;
}
.share-native,
.share-facebook,
.share-x,
.share-linkedin,
.share-email {
  background: #2867a8 !important;
  color: #fff !important;
}
.share-native:hover,
.share-facebook:hover,
.share-x:hover,
.share-linkedin:hover,
.share-email:hover,
.share-native:focus-visible,
.share-facebook:focus-visible,
.share-x:focus-visible,
.share-linkedin:focus-visible,
.share-email:focus-visible {
  background: #174b80 !important;
}

/* Site-wide readability pass: replace the archived 12-14px body copy with a
   consistent, comfortable reading size while keeping headings distinct. */
.body {
  color: #222;
  font-size: 17px;
  line-height: 1.6;
}
.sitemap,
.sitemap a,
.sitemap a:link,
.sitemap a:visited {
  font-size: 15px;
  line-height: 1.5;
}
.generic-box1 > a,
.generic-box2 > a,
.right > a,
.left > a {
  font-size: 18px;
  line-height: 1.5;
}
.generic-box1 p,
.generic-box2 p,
.right p,
.left p,
.generic-box1 ul,
.generic-box2 ul,
.right ul,
.generic-box1 ul li,
.generic-box2 ul li,
.right ul li,
.left2 p {
  font-size: 17px;
  line-height: 1.6;
}
.generic-box1 ul li a,
.generic-box1 ul li a:link,
.generic-box1 ul li a:visited,
.generic-box2 ul li a,
.generic-box2 ul li a:link,
.generic-box2 ul li a:visited,
.right ul li a,
.right ul li a:link,
.right ul li a:visited {
  font-size: 17px;
  line-height: inherit;
}
.body a[style*="font-size:12px"],
.body a[style*="font-size: 12px"],
.body a[style*="font-size:14px"],
.body a[style*="font-size: 14px"] {
  font-size: 17px !important;
  line-height: 1.5 !important;
}
.share-label {
  font-size: 16px;
}
.footer,
.footer a,
.footer a:link,
.footer a:visited {
  font-size: 16px;
  line-height: 1.7;
}
@media (max-width: 760px) {
  .generic-box1,
  .generic-box2,
  .right,
  .left,
  .left2 {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
  }
  .right {
    padding: 12px 16px;
    border-left: 0;
  }
  .generic-box1 ul,
  .generic-box2 ul,
  .right ul,
  .generic-box1 ul li,
  .generic-box2 ul li,
  .right ul li {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    float: none;
  }
}

/* Phone-only presentation. Everything above 600px keeps the approved tablet
   and desktop layout unchanged. */
.mobile-menu-toggle { display: none; }
@media (max-width: 600px) {
  html, body {
    width: 100%;
    overflow-x: hidden;
    background-size: auto 190px;
  }
  #wrap {
    width: 100%;
    max-width: 100%;
    overflow: visible;
  }
  #head, #head2 {
    position: relative;
    width: 100%;
    height: 132px;
    min-height: 132px;
    max-height: 132px;
    float: none;
    background-position: center top;
    background-size: auto 132px;
  }
  #logo {
    width: 168px;
    height: 55px;
    margin: 14px 0 0 14px;
    background-size: contain;
    background-repeat: no-repeat;
  }
  #head h1, #head2 h1 {
    box-sizing: border-box;
    position: absolute;
    top: 78px;
    left: 14px;
    right: 14px;
    clear: none;
    margin: 0;
    padding: 0;
    color: #fff;
    font-size: 12px;
    line-height: 1.2;
    white-space: nowrap;
    text-align: center;
  }
  .mobile-menu-toggle {
    position: absolute;
    right: 14px;
    top: 14px;
    z-index: 1002;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
    width: 50px;
    height: 50px;
    padding: 8px;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 6px;
    background: #16384f;
    color: #fff;
    box-shadow: 0 3px 10px rgba(0,0,0,.24);
    cursor: pointer;
  }
  .mobile-menu-toggle span {
    display: block;
    width: 30px;
    height: 3px;
    border-radius: 2px;
    background: #fff;
    transition: transform .18s ease, opacity .18s ease;
  }
  .mobile-menu-toggle.is-open span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
  .mobile-menu-toggle.is-open span:nth-child(2) { opacity: 0; }
  .mobile-menu-toggle.is-open span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }
  #menu {
    position: absolute;
    top: 100%;
    left: 12px;
    right: 12px;
    z-index: 1001;
    display: none;
    width: auto;
    height: auto;
    margin: 0;
    padding: 8px;
    float: none;
    flex-direction: column;
    border-radius: 7px;
    background: #102f44;
    box-shadow: 0 12px 28px rgba(0,0,0,.38);
  }
  #menu.mobile-menu-open { display: flex; }
  #menu > a,
  #menu > img,
  #menu > .menu-active-page,
  #menu > .menu-active-videos {
    flex: none;
    width: 100%;
    max-width: none;
    height: 45px;
    float: none;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.13);
    border-radius: 0;
    font-size: 14px;
    line-height: 45px;
    text-align: left;
    text-indent: 16px;
  }
  #menu > :first-child { border-radius: 5px 5px 0 0; }
  #menu > :last-child { border: 0; border-radius: 0 0 5px 5px; }
  #menu > a[href="services.html"],
  #menu > a[href="links.html"] {
    width: 100% !important;
    max-width: none !important;
    font-size: 14px !important;
    line-height: 45px !important;
    text-align: left !important;
    text-indent: 16px;
  }
  .product-text {
    box-sizing: border-box;
    position: absolute;
    top: 132px;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 54px;
    margin: 0;
    padding: 15px 14px 10px;
    background: #fff;
    text-align: center;
  }
  .product-text a {
    color: #111;
    font-size: 22px;
    line-height: 1.25;
    text-shadow: none;
  }
  .body, .left2, .footer, .sitemap, .body-intro a {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
  }
  .body {
    padding: 12px 16px 0;
    float: none;
  }
  .sitemap { display: none; }
  .body > h1 { font-size: 27px; line-height: 1.25; }
  .body-intro a {
    padding: 0 16px 8px;
    border-bottom-width: 7px;
    font-size: 27px;
    line-height: 1.2;
    text-align: center;
  }
  #products {
    padding: 78px 16px 6px;
  }
  #products .product-box-bg {
    width: 100%;
    padding: 0;
    margin: 0 0 34px;
  }
  #products .product-holder a {
    width: min(258px, calc(100vw - 56px));
    height: auto;
    aspect-ratio: 258 / 155;
  }
  #products .desc { padding: 0 3px; }
  #products .desc > a { margin-top: 16px; }
  #products .desc p { font-size: 17px; line-height: 1.55; }
  .left2 p { padding: 10px 16px 20px; }
  .generic-box1, .generic-box2 {
    padding: 18px 0;
    overflow: visible;
    float: none;
    clear: both;
  }
  .left, .right {
    height: auto;
    float: none;
  }
  .left { padding: 0 0 12px; }
  .left img {
    display: block;
    max-width: min(100%, 340px);
    height: auto;
    margin: 8px auto;
    float: none;
  }
  .right { padding: 8px 0 12px; }
  .right > a:has(img[src*="button-details"]) {
    display: block;
    clear: both;
    width: 100%;
    margin: 18px 0 8px;
    text-align: center;
  }
  .right > a:has(img[src*="button-details"]) img {
    display: inline-block;
    width: auto;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    float: none;
  }
  .right img, .generic-box1 img, .generic-box2 img {
    max-width: 100%;
    height: auto;
  }
  .generic-box1 ul, .generic-box2 ul, .right ul {
    margin: 10px 0 18px;
    padding-left: 24px;
  }
  .generic-box1 ul li, .generic-box2 ul li, .right ul li {
    margin-left: 0;
    padding-right: 0;
  }
  #customer-organizations {
    width: 100%;
    margin: 12px 0;
    column-gap: 0;
  }
  .testimonials-page > .generic-box1:not(:has(#customer-organizations)) {
    padding: 22px 4px;
  }
  .testimonials-page > .generic-box1:not(:has(#customer-organizations)) p {
    font-size: 17px;
  }
  .video-library { padding: 14px 0 28px; }
  .video-library > h1, .video-library > hr { margin-left: 16px; margin-right: 16px; }
  .video-filter-bar { margin: 18px 16px 24px; }
  .video-grid { gap: 20px; padding: 0 16px; }
  .video-grid h2 { font-size: 19px; }
  .speedster-page-content { padding: 12px 0 20px; }
  .speedster-page-content .right > img,
  .speedster-page-content .product-interface-image { width: 100%; }
  table {
    display: block;
    width: 100% !important;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .share-area {
    clear: both;
    margin: 0 0 24px;
    padding: 14px;
    text-align: center;
  }
  .share-buttons { justify-content: center; }
  .footer {
    clear: both;
    padding: 22px 16px 30px;
    float: none;
    text-align: center;
  }
  .footer a:has(+ a[href="privacypage.html"]),
  .footer a[href="privacypage.html"] {
    display: none;
  }
  .about-page .body > .generic-box1,
  .about-page > .generic-box1 {
    box-sizing: border-box;
    width: calc(100% - 32px);
    max-width: none;
    margin: 0 16px;
    padding: 20px 0;
  }
  .about-page .generic-box1 p,
  .about-page .generic-box1 ul {
    box-sizing: border-box;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 24px;
    padding-right: 8px;
  }
  .about-page a[href*="youtube.com"] {
    display: block;
    margin: 12px 0 0 !important;
    overflow-wrap: anywhere;
  }
  .about-page a[href*="youtube.com"] img {
    display: none;
  }
  .footer > a {
    display: inline-block;
    padding: 5px 3px;
    font-size: 15px;
  }
}

/* 2026-08-07 GoDaddy navigation consistency fix.
   Every page now uses the same text/CSS navigation structure as Videos. */
#menu > a::after { content: none !important; }
#menu > a,
#menu > .menu-active-page,
#menu > .menu-active-videos {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Keep the restored desktop site at its original canvas width. */
@media (min-width: 601px) {
  #wrap,
  #head,
  #head2,
  .body {
    width: 980px !important;
    max-width: 980px !important;
  }
}

/* The archive's breadcrumb-style sitemap adds no useful navigation here. */
.sitemap,
.sitemap + br,
.sitemap + br + br {
  display: none !important;
}