@import "html.css";

/* begin layout divs */
	#wrapper
	{
		position: relative;	/* anything positioned inside the wrapper gets positioned relative to the wrapper */
		background-color: #FFF;
		margin: 10px auto 10px auto;
		padding: 15px;
		width: 870px;
	}

	#header
	{
		position: absolute;
		top: 15px;		/* move header content (at bottom of html source) to 15px from top of wrapper */
	}

		#ident
		{
			background-image: url(../i/header-tel.gif);
			background-repeat: no-repeat;
			background-position: top right;
			width: 870px;	/* does nothing much really */
		}

/* custom layout divs for homepage */
	#main-menu
	{
		clear: both;
	}

	#main-menu ul
	{
		list-style-type: none;
		padding: 0;
		margin: 0;
	}

	#main-menu li
	{
		float: left;
		padding: 6px 8px 7px 6px;
		border-right: 1px solid #FFFFFF;
		background: #2b7392 url(/assets/i/main-menu-corner.gif) bottom right no-repeat;
	}

	#main-menu a
	{
		color: #FFF;
	}

	#breadcrumbs
	{
		clear: both;
	}

	#breadcrumbs ul
	{
		list-style-type: none;
		margin: 0;
		padding: 0;
	}

	#breadcrumbs li
	{
		float: left; 
		padding: 6px 8px 7px 0px;
	}


/* the real meat of the site */
	#main
	{
		padding-top: 9.75em;	/* give the #header some breating room */
	}


	#panels
	{
		clear: both;	/* holds the boxes, portfolio, news items */
	}


/* footer, last div before end of wrapper */	
	#footer
	{
		clear: both;
	}


/* panels on homepage */
	#panel-left
	{
	}

	#panel-left p a
	{
		color: #FFF;
		text-decoration: underline;
	}

		#p1
		{
			margin-right: 1px;
			float: left;
			width: 140px;
		}

			#p1 h2
			{
				letter-spacing: -1px;
				margin: 0;
				padding: 5px;
				border-bottom: 1px solid #FFF;
				height: 40px; 
				background: #18739e url(/assets/i/panel-header-bg.gif) top left repeat-x;
			}

			#p1 img
			{
				width: 140px; height: 85px;
				border-bottom: 1px solid #FFF;
			}

			#p1 p
			{
				margin: 0;
				padding: 6px 6px 20px 6px;
				color: #FFF;
				background: #18739e url(/assets/i/panel-corner.gif) bottom right no-repeat;
				height: 210px;
			}

		#p2
		{
			margin-right: 1px;
			float: left;
			width: 140px;
		}

			#p2 h2
			{
				letter-spacing: -1px;
				margin: 0;
				padding: 5px;
				border-bottom: 1px solid #FFF;
				height: 40px; 
				background: #18739e url(/assets/i/panel-header-bg.gif) top left repeat-x;
			}

			#p2 img
			{
				width: 140px; height: 85px;
				border-bottom: 1px solid #FFF;
			}

			#p2 p
			{
				margin: 0;
				padding: 6px 6px 20px 6px;
				color: #FFF;
				background: #18739e url(/assets/i/panel-corner.gif) bottom right no-repeat;
				height: 210px;
			}

		#p3
		{
			margin-right: 1px;
			float: left;
			width: 140px;
		}

			#p3 h2
			{
				letter-spacing: -1px;
				margin: 0;
				padding: 5px;
				border-bottom: 1px solid #FFF;
				height: 40px; 
				background: #18739e url(/assets/i/panel-header-bg.gif) top left repeat-x;
			}

			#p3 img
			{
				width: 140px; height: 85px;
				border-bottom: 1px solid #FFF;
			}

			#p3 p
			{
				margin: 0;
				padding: 6px 6px 20px 6px;
				color: #FFF;
				background: #18739e url(/assets/i/panel-corner.gif) bottom right no-repeat;
				height: 210px;
			}

		#p4
		{
			margin-right: 1px;
			float: left;
			width: 140px;
		}

			#p4 h2
			{
				letter-spacing: -1px;
				margin: 0;
				padding: 5px;
				border-bottom: 1px solid #FFF;
				height: 40px; 
				background: #18739e url(/assets/i/panel-header-bg.gif) top left repeat-x;
			}

			#p4 img
			{
				width: 140px; height: 85px;
				border-bottom: 1px solid #FFF;
			}

			#p4 p
			{
				margin: 0;
				padding: 6px 6px 20px 6px;
				color: #FFF;
				background: #18739e url(/assets/i/panel-corner.gif) bottom right no-repeat;
				height: 210px;
			}


	#panel-right
	{
		float: right;
		width: 300px;
	}

		#portfolio-header
		{
			letter-spacing: -1px;
			margin: 0;
			padding: 5px;
			border-bottom: 1px solid #FFF;
			background: #2B7392 url(/assets/i/panel-header-bg.gif) top left repeat-x;
		}

		#portfolio
		{
			list-style-type: none;
			padding: 0;
			margin: 5px;
		}
	
		#portfolio li
		{
			display: inline;
			margin: 0;
			padding: 0;
		}


		#news-header
		{
			clear: both;

			letter-spacing: -1px;
			margin: 0;
			padding: 5px;
			border-bottom: 1px solid #FFF;
			background: #2B7392 url(/assets/i/panel-header-bg.gif) top left repeat-x;
		}

		.news dt
		{
			margin-left: 7px;
			font-weight: bold;
		}

		.news dd
		{
			margin-left: 7px;
		}

		.portfolios dt
		{
			margin-left: 7px;
			font-weight: bold;
		}

		.portfolios dd
		{
			margin-left: 7px;
		}

/* page.php */

	#menu
	{
		float: left;
		padding-right: 17px;
		background-image: url(/assets/i/vr-dots.gif);
		background-position: right;
		background-repeat: repeat-y;
	}

	#page
	{
		float: right;
		width: 675px;
		margin: 0;
		padding: 0px;
	}

	#page .header
	{
		background-image: url(/assets/i/page-header-bg.jpg);
		background-color: #333;
		color: #FFF;
		padding: 20px;
		margin: 0 0 5px 0;
	}

	#page .text
	{
		padding: 10px;
	}

	#page .text .trigger-left
	{
		background-color: #117DAC;
		background-image: url(/assets/i/trigger-left-bg.gif);
		color: #FFF;
		display: block;
		width: 140px;
		padding: 15px;
		font-family: arial, helvetica, sans-serif;
		font-size: 1.95em;
		letter-spacing: -1px;
		float: left;
		margin: 3px 7px 7px 0;
	}

	#page .text .trigger-right
	{
		background-color: #60AC11;
		background-image: url(/assets/i/trigger-right-bg.gif);
		color: #FFF;
		display: block;
		width: 140px;
		padding: 15px;
		font-family: arial, helvetica, sans-serif;
		font-size: 1.95em;
		letter-spacing: -1px;
		float: right;
		margin: 3px 0px 7px 7px;
	}

	#page .images
	{
		float: right;
		padding: 20px 10px 0px 10px;
	}
	.images img
	{
		display: block;
		border: 5px solid #FFF;
		margin: 0 0 5px 0;
	}

	#related-content
	{
		width: 160px;
	}
		#related-content h2
		{
			margin: 0;
			letter-spacing: -1px;
			padding: 10px;
			color: #FFF;
			background-image: url(/assets/i/related-items-bg.gif);
		}

		#related-content div
		{
			padding: 10px;
			color: #FFF;
			background-image: url(/assets/i/related-items-corner.gif);
			background-position: bottom right;
		}
		
		#related-content div a
		{
			color: #FFF;		
		}


/* left menu classes */

	#common-menu
	{
		width: 160px;
		margin-bottom: 20px;
		background-image: url(/assets/i/common-menu-bg.gif);
		background-position: bottom;
		background-repeat: repeat-x;
	}

	.l2 			{
				padding: 7px 14px 7px 14px;
				background-image: url(/assets/i/common-menu-dots.gif);
				background-position: bottom;
				background-repeat: no-repeat;
				}
				
	.l2 .content		{
				padding: 0px 10px 0px 10px;
				background-image: url(/assets/i/common-menu-arrow.gif);
				background-position: left center;
				background-repeat: no-repeat;
				}
	.l2 .content a		{ color: #000000; text-decoration: none; }
	.l2 .content a:hover		{ color: #9F1E30; text-decoration: none;}

	.l2 .content-on		{
				padding: 0px 10px 0px 10px;
				background-image: url(../i/common-menu-arrow.gif);
				background-position: left center;
				background-repeat: no-repeat;
				}

	.l2 .content-on a		{ color: #9F1E30; text-decoration: none; }
	.l2 .content-on a:hover	{ color: #9F1E30; text-decoration: none;}



/* sitemap classes */

	.sitemap			{
				}

	.s1 			{
				padding: 7px 0px 7px 0px;
				}

	.s1 .content		{
				padding: 0px 10px 0px 10px;
				background-image: url(../i/arrow_1.gif);
				background-position: left center;
				background-repeat: no-repeat;
				}

	.s2 			{
				padding: 7px 14px 7px 28px;
				}
	.s2 .content		{
				padding: 0px 10px 0px 10px;
				background-image: url(../i/arrow_2.gif);
				background-position: left center;
				background-repeat: no-repeat;
				}

	.s3 			{
				padding: 7px 21px 7px 42px;
				}
	.s3 .content		{
				padding: 0px 15px 0px 15px;
				background-image: url(../i/arrow_3.gif);
				background-position: left center;
				background-repeat: no-repeat;
				}
.downloads-table { width: 100%; margin-bottom: 5em; }
.downloads-table th { text-align: left; background-color: #741602; color: #fff; }
.downloads-table td { vertical-align: top; }
.downloads-table .dk td { background-color: #efefef; }
.downloads-table .comments { display: block; font-size: 85%; }

.login-form { margin-bottom: 5em; }
.login-form label { display: block; }