/*
 * The customer's old website: deliberately dated. Lives inside a phone screen or a browser frame,
 * sized in cqi so it scales with its container. Real HTML, so the reskin can tear it away.
 */

.jb-oldsite {
	position: absolute;
	inset: 0;
	overflow: hidden;
	padding: 3cqi 3cqi 2cqi;
	background-color: #DDE6F0;
	background-image:
		linear-gradient(45deg, rgba(255, 255, 255, 0.45) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, 0.45) 75%),
		linear-gradient(45deg, rgba(255, 255, 255, 0.45) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, 0.45) 75%);
	background-size: 6cqi 6cqi;
	background-position: 0 0, 3cqi 3cqi;
	color: #000080;
	font-family: "Times New Roman", Times, serif;
	font-size: 2.3cqi;
	line-height: 1.25;
	text-align: center;
}
.jb-oldsite__title {
	margin: 0 0 1.5cqi;
	font-family: "Comic Sans MS", "Comic Neue", cursive;
	font-size: 5cqi;
	font-weight: 700;
	color: #CC0000;
	text-shadow: 0.4cqi 0.4cqi 0 #FFFF00;
}
.jb-oldsite__nav { margin-bottom: 2cqi; font-size: 2.2cqi; }
.jb-oldsite__nav a { color: #0000EE; text-decoration: underline; }
.jb-oldsite__nav a:nth-child(2) { color: #551A8B; }
.jb-oldsite__photo {
	width: 70%;
	height: 26cqi;
	margin: 0 auto 2cqi;
	border: 0.6cqi ridge #999;
	overflow: hidden;
}
.jb-oldsite__photo img { width: 100%; height: 100%; object-fit: fill; filter: saturate(0.7) contrast(1.15); }
.jb-oldsite__welcome { margin-bottom: 1.6cqi; font-size: 2.6cqi; font-weight: 700; }
.jb-oldsite__construction {
	margin: 0 -3cqi 2cqi;
	padding: 1.2cqi 0;
	background: repeating-linear-gradient(-45deg, #FFD60A 0 2.4cqi, #111 2.4cqi 4.8cqi);
	color: #111;
	font-family: Arial, sans-serif;
	font-weight: 900;
	font-size: 2.6cqi;
	letter-spacing: 0.1em;
}
.jb-oldsite__construction span { background: #FFD60A; padding: 0.2cqi 1.4cqi; }
.jb-oldsite__counter { margin-bottom: 1.4cqi; font-size: 2cqi; }
.jb-oldsite__counter b {
	display: inline-block;
	padding: 0.3cqi 1cqi;
	background: #000;
	color: #3F3;
	font-family: "Courier New", monospace;
	letter-spacing: 0.3cqi;
}
.jb-oldsite__foot { font-size: 1.8cqi; color: #444; }

/* In a phone the screen is narrow, so everything is bigger relative to width */
.jb-phone .jb-oldsite { padding: 14cqi 5cqi 4cqi; font-size: 5cqi; }
.jb-phone .jb-oldsite__title { font-size: 9.5cqi; }
.jb-phone .jb-oldsite__nav { font-size: 4.6cqi; }
.jb-phone .jb-oldsite__photo { width: 92%; height: 38cqi; }
.jb-phone .jb-oldsite__welcome { font-size: 5.4cqi; }
.jb-phone .jb-oldsite__construction { margin-inline: -5cqi; font-size: 4.6cqi; background-size: auto; }
.jb-phone .jb-oldsite__counter { font-size: 4.2cqi; }
.jb-phone .jb-oldsite__foot { font-size: 3.8cqi; }