/*
 * Chenoa Veterinary Clinic - legacy site recreation
 * Scoped under .chenoa-legacy-site to avoid bleeding into the WordPress theme.
 * All IDs from the original chenoa.css are prefixed with "chenoa-" for the
 * same reason. This is a deliberate 1:1 recreation of a pre-responsive,
 * fixed-width (957px) design - it is NOT meant to be responsive.
 */

/* ---- Full-bleed outer shell -----------------------------------------
   Breaks the shortcode content out of the theme's content column so the
   yellow background fills the entire browser width and height, the way
   it does on the original static site. The 957px design itself stays
   fixed-width and centered inside this shell. */
.chenoa-legacy-site {
	display: block;
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	min-height: 100vh;
	box-sizing: border-box;
	font-family: verdana, arial !important;
	font-size: 14px !important;
	background: #F8F79D !important;
	color: #2D2D28 !important;
	padding: 0 !important;
}

.chenoa-legacy-site * {
	box-sizing: content-box;
}

.chenoa-legacy-site #chenoa-wrapper {
	width: 957px;
	margin: 0 auto;
}

.chenoa-legacy-site #chenoa-top {
	background: url(../images/header.jpg) no-repeat;
	height: 122px;
	width: 957px;
	position: relative;
}

.chenoa-legacy-site #chenoa-menu {
	width: 957px;
	margin-left: 36px;
}

.chenoa-legacy-site #chenoa-menu ul {
	margin: 0 0 0 0px;
	padding: 0;
	list-style-type: none;
}

.chenoa-legacy-site #chenoa-menu ul li {
	float: left;
	background: url(../images/menu.jpg) top repeat-x #BD4D05;
	border: solid 1px #BB4C08;
	border-bottom: none;
	margin-right: 4px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.chenoa-legacy-site #chenoa-menu ul li.last {
	background: none;
}

.chenoa-legacy-site #chenoa-menu ul li a {
	padding: 6px 9px 5px 9px;
	display: block;
	color: #fff;
	font-size: 14px;
	text-decoration: none;
	font-family: verdana;
	text-transform: uppercase;
}

.chenoa-legacy-site #chenoa-menu ul li a:hover {
	color: #E1E1E1;
}

.chenoa-legacy-site #chenoa-content {
	width: 957px;
	float: left;
	padding: 25px 35px 20px 35px;
	min-height: 320px;
	margin-bottom: 6px;
	background: #fff;
	border: solid 2px #BB4C08;
	border-radius: 30px;
}

.chenoa-legacy-site #chenoa-main {
	width: 957px;
	float: left;
}

.chenoa-legacy-site .leftcol {
	width: 330px;
	margin-right: 20px;
	float: left;
	height: 100%;
}

.chenoa-legacy-site .rightcol {
	width: 560px;
	float: right;
}

.chenoa-legacy-site #chenoa-factoid {
	padding: 8px 0px;
	margin-top: 30px;
	background: url(../images/symbol.jpg) right no-repeat;
	padding-right: 55px;
	height: 72px;
	border-top: solid 1px #8CA7BC;
}

.chenoa-legacy-site ul.gallery {
	list-style: none;
	margin: 0 0 0 0px;
	padding: 0;
}
.chenoa-legacy-site ul.gallery li {
	float: left;
	margin: 0 10px 10px 0;
	padding: 0;
	cursor: pointer;
}
.chenoa-legacy-site ul.gallery li img {
	margin: 0;
	padding: 0;
	height: 110px;
	border: solid 1px #4B5360;
	width: 110px;
	display: block;
}

.chenoa-legacy-site #chenoa-gallery ul {
	list-style: none;
	margin: 0 0 0 0px;
	padding: 0;
}
.chenoa-legacy-site #chenoa-gallery li {
	float: left;
	margin: 0 10px 10px 0;
	padding: 0;
	cursor: pointer;
}
.chenoa-legacy-site #chenoa-gallery li img {
	margin: 0;
	padding: 0;
	height: 80px;
	width: 80px;
	border: solid 1px #000;
	display: block;
}

.chenoa-legacy-site table {
	border-collapse: collapse;
	padding: 0;
}
.chenoa-legacy-site table td {
	padding: 1px 5px;
}

.chenoa-legacy-site #chenoa-footer {
	padding: 0;
	width: 957px;
	margin: 0 auto;
	color: #1B1B1C;
	font-size: 12px;
	padding-bottom: 30px;
}

.chenoa-legacy-site #chenoa-footer p,
.chenoa-legacy-site #chenoa-footer a {
	color: #1B1B1C;
	text-decoration: none;
	font-size: 11px;
	padding: 0;
	margin: 0;
}

.chenoa-legacy-site #chenoa-footer a:hover {
	text-decoration: underline;
}

.chenoa-legacy-site h1 {
	font-size: 22px;
	font-weight: normal;
	color: #2D2D28;
	margin: 0 0 15px 0;
	padding: 0;
}

.chenoa-legacy-site h2 {
	font-size: 20px;
	color: #084156;
	margin: 0 0 8px 0;
	padding: 0;
	font-weight: normal;
}

.chenoa-legacy-site h3,
.chenoa-legacy-site h3 a {
	font-size: 18px;
	color: #470404;
	margin: 0 0 5px 0;
	padding: 0;
	font-weight: normal;
}

.chenoa-legacy-site .clear {
	clear: both;
}

.chenoa-legacy-site .left {
	float: left;
}

.chenoa-legacy-site .right {
	float: right;
}

.chenoa-legacy-site .alignleft {
	float: left;
	margin: 0 12px 12px 0;
}

.chenoa-legacy-site .alignright {
	float: right;
	margin: 0 0 12px 12px;
}

.chenoa-legacy-site .smMargR {
	margin-right: 6px;
}

.chenoa-legacy-site a {
	color: #BD4D05;
	text-decoration: none;
}

.chenoa-legacy-site a:hover {
	color: #BD4D05;
	text-decoration: underline;
}

.chenoa-legacy-site .hidden {
	display: none;
}

.chenoa-legacy-site .bord {
	border: solid 1px #8BA7BF;
	background: #fff;
	padding: 2px;
}

.chenoa-legacy-site hr {
	border-color: #0A0B4C;
	border-width: 1px 0 0 0;
	background: #fff;
	margin: 0 0 15px 0;
}

/* ---- Gallery lightbox (vanilla-JS replacement for the original
   jquery.lightbox plugin, which wasn't part of the supplied assets) ---- */
.chenoa-legacy-site .chenoa-lightbox-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.85);
	z-index: 99999;
	display: none;
	text-align: center;
}

.chenoa-legacy-site .chenoa-lightbox-overlay.chenoa-open {
	display: block;
}

.chenoa-legacy-site .chenoa-lightbox-inner {
	position: relative;
	display: inline-block;
	margin-top: 60px;
	max-width: 90%;
}

.chenoa-legacy-site .chenoa-lightbox-inner img {
	max-width: 100%;
	max-height: 75vh;
	border: solid 4px #fff;
	display: block;
	margin: 0 auto;
}

.chenoa-legacy-site .chenoa-lightbox-caption {
	color: #fff;
	font-size: 13px;
	margin-top: 10px;
}

.chenoa-legacy-site .chenoa-lightbox-close {
	position: absolute;
	top: -18px;
	right: -18px;
	width: 32px;
	height: 32px;
	line-height: 30px;
	background: #fff;
	color: #2D2D28;
	border-radius: 50%;
	font-family: arial, sans-serif;
	font-size: 18px;
	cursor: pointer;
	border: solid 1px #4B5360;
}
