/**
* file: container.css
* author: Yuli Mitsner
* date: July 19, 2004
* description:
*	Describes the container of the page.
*	Background images stack to create "paper on grey gradient" effect:
*	1. container_bg_top.jpg (1200x100) - Header with maple leaves
*	2. container_bg_top_under.jpg (900x50) - Subtitle
*	3. container_bg_header.jpg (900x400) - Hero/menu area background
*	4. container_bg_repeat.jpg (900x25) - Repeating content background
*	5. container_bg_bottom.jpg (1000x141) - Footer with tape effects
*/

html {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	padding: 0;
	/* Gradient from darker grey at top to lighter grey at bottom, matching the image backgrounds */
	background: linear-gradient(to bottom, #4F4F4F 0%, #707070 100px, #888888 200px, #AAAAAA 350px, #CCCCCC 600px, #CCCCCC 100%);
	background-attachment: fixed;
	min-height: 100vh;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

#page_wrapper {
	width: 900px;
	margin: 0 auto;
	padding: 0;
	overflow: visible;
	position: relative;
}

/* 1. Top header with maple leaves (1200x100) - centered, overflows wrapper */
#container_top {
	width: 1200px;
	height: 100px;
	margin: 0;
	padding: 0;
	line-height: 0;
	font-size: 0;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}

#container_top img {
	display: block;
	margin: 0;
	padding: 0;
}

/* 2. Subtitle row (900x50) */
#container_top_under {
	width: 900px;
	height: 50px;
	margin: 0;
	padding: 0;
	line-height: 0;
	font-size: 0;
}

#container_top_under img {
	display: block;
	margin: 0;
	padding: 0;
}

/* 3. Header area - hero banner + menu (uses container_bg_header.jpg 900x400) */
#container_header {
	width: 900px;
	min-height: 300px;
	margin: 0;
	padding: 0;
	background: url(../images/common/container_bg_header.jpg) top center no-repeat;
}

/* 4. Main content area (uses container_bg_repeat.jpg 900x25, repeat-y) */
#container_content {
	width: 900px;
	margin: 0;
	padding: 0;
	background: url(../images/common/container_bg_repeat.jpg) top center repeat-y;
}

/* 5. Footer area (uses container_bg_bottom.jpg 1000x141) */
#container_footer {
	width: 1000px;
	min-height: 141px;
	margin: 0;
	padding: 20px 70px;
	background: url(../images/common/container_bg_bottom.jpg) top center no-repeat;
	box-sizing: border-box;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}

/* Legacy selectors kept for compatibility */
#container_container {
	display: none; /* Old table structure no longer used */
}

td#container_left,
td#container_right {
	display: none;
}

#container_bottom {
	display: none;
}