﻿@media screen {

	/* =============== Content */
	.features { float: right; width: 270px; }
	.features h3 { margin-top: 0; }
	.features li { line-height: 14px; }

	#largeimage { width: 500px; text-align: center; position: relative; }
	
	#largeimage img {
		max-width: 500px; max-height: 500px;
		border: 1px solid black;
		border-width: 1px !important; /* override default 0px */
		background-image: url('images/loading.jpg');
		background-repeat: no-repeat;
		background-position: bottom;
	}
	
	#largeimage .imagenotice {
		width: 480px;
		color: white; background-color: #ff9029;
		border: 1px solid black;
		font-weight: bold;
		font-size: 32px;
		
		position: absolute; top: 45%; left: 0; display: block;
	}

	#thumbnails input {
		height: 75px;
		border: 1px solid blue;
		border-width: 1px !important; /* override default 0px */
		margin-right: 4px;
		margin-top: 4px;
	}
	
	#thumbnails input:hover { border: 1px solid red; }
	
	#content table.displaytable {clear: both; margin-top: 5px; width: 780px; }
	#content table.displaytable th { text-align: left; color: black; background-color: #c1bdfb; height: 20px; font-size: 11px; }
	#content table.displaytable th.topheader { background: #6060B8; color: white; font-size: 12px; font-weight: bold; text-align: center; text-transform: uppercase; }
	#content table.displaytable td { padding: 5px; font-size: 11px; vertical-align: middle; }
	#content table.displaytable col { width: 190px; }
	

	#content #projectfundingcontainer { vertical-align: top; padding: 0; }
	
	#content #projectfundingtable { width: 400px; }
	#content #projectfundingtable col { width: 50%; }
	#content #projectfundingtable .fundvalues { text-align: right; padding-right: 120px; }	
	
	#content #projectfundingrecap th { background-color: #996633; }
	#content #projectcost th,
	#content #grantamount th { text-align: right; background-color: #F4AC40; }
	#content #externalfunds th,
	#content #matchingfunds th { text-align: right; background-color: #FFCC66; }
	#content #expediturestodate th,
	#content #annualexpenditures th { text-align: right; background-color: #FFFF99; }
	#content #projectcostnote { background-color: #FFCC66; }
	#annualexpenditures select { font-family: Verdana; font-size: 10px; color:#000080; }
	#externalfunds td, #projectcost td { text-decoration: underline; }
	

	#downpaymentassistance { font-size: 16px; }
	#amount { color: #6060b8; font-weight: bold; }

	/* =============== Right */
	#locationdescription p { line-height: 14px; }
	
	#infomap { text-align: center; }
	#infomap img { border: 1px solid black; width: 170px; height: 170px; }
	
	#completionbar {
		border: 1px solid white;
		width: 180px; height: 18px;
		margin-left: 4px;
	}
	
	#completionbar img { width: 180px; height: 18px; vertical-align: bottom; }
	#completion p { margin: 0; text-align: center; line-height: 16px; }
}

@media print {
	#completionbar { border: 1px solid black; width: 180px; height: 18px; }
	#completionbar img { width: 180px; height: 18px; vertical-align: bottom; }
	#infomap { text-align: left; }
	#right { vertical-align: top; }
	
	#largeimage img, #thumbnails img, #infomap img { border: 1px solid black; }
	
	#content table.displaytable col { width: 25%; }
	th.topheader { border-bottom: 1px solid black; }
}