	.collage {
		width: 830px;
/*		width: 100%;*/
		padding: 15px 0 30px 0;
		text-align: center;
	}

	#instructors {
		
		padding-top: 15px;
/*		padding: 20px;*/
/*		border: 1px solid #999;*/
	}

	.instructor {
		display: block;
		float: left;
/*		width: 478px;*/
		width: 570px;
/*		height: 15em;*/
		padding: 10px;
		margin-left: 20px;
		margin-bottom: 50px;
		
/*		background-color: #f6f4e8;*/
/*		background-color: #f2f2f2;*/
/*		background-color: #f8efe3;*/		
		}

	.ie .instructor { margin-left: 10px; }

	.instructor:hover	{ background-color: #f1f1f1; }


/************************************

Sprite, Window/Canvas based layout. All of the pictures would be setup in a matrix (the canvas) and viewed through the "window" of div.picture, with overflow: hidden.

	div.picture {
		display: block;
		position: relative;
		overflow: hidden;		
		padding: 10px;
		border: 3px red solid;
		background-color: yellow;
	}
	
	div.picture img {
		display: block;
		position: absolute;
		top: 10px;
		left:20px;
	}

*************************************/



	.instructor .picture {
		float: left;
		width: 80px;
		height: 90px;
		margin: 0 15px 15px 0;
		padding: 1px;
		border: 5px solid #e1e1e1;
/*		border: 6px solid #e1e1e1;*/
		}

	.instructor .text {
/*		margin-left: 105px;*/
/*		position: absolute;*/
		float: left;
/*		width: 360px;*/
		width: 440px;
		
/*		background-color: #f6f4e8;*/
/*		background-color: red;*/
/*		background: url(instructor_bg.gif) repeat-x top left;*/

		}

	.instructor .name {
		display: block;
		font-size: 140%;
		
/*		background-color: #f8efe3;*/
		
		}
	.instructor .instrument {
		display: inline;
		margin-bottom: 10px;
		
		font: italic 80% Helvetica, Arial, sans-serif;
		text-transform: uppercase;
		color: #999999;
		}
	
	.instructor .description {
		display: block;
		margin-top: 10px;
		padding-bottom: 10px;
		/*text-align: justify;*/
		}


	.instructor .available {
		display: none;
		font: 85% Helvetica, Arial, sans-serif; font-style: italic; color: #777777;
		}

	.instructor .available em {
		padding: 1px;
		margin-left: 2px;
		font-style: normal;
		background-color: #eceff0;
		}
	
	
	.instructor .phone {
		display: block;		
		margin-top: 10px;
		padding: 4px 0 6px 5px;

		font-size: 130%;

		border-top: 1px solid #e5e5e5;
		border-bottom: 3px double #e5e5e5;
		}

	.instructor .phone:hover {
		color: white;
		background-color: black;
		}

	.instructor .phone .crm {
		font-size: 0.7em;
		font-style: italic;
		color: #999999;
	}


	.instructor .backtotop {
		display: block;		
		margin-top: 10px;
		padding: 4px 0 6px 5px;


		font-size: .8em;
/*		text-transform: uppercase;*/
		
		}

	.instructor .backtotop a { color: gray; text-decoration: none; font-style: italic; }







	#instructorsList {
		float: right;
		/*width: 165px;*/
		width: 180px;
		margin: 10px 30px 0 0;
/*		padding: 20px 0 0 15px;*/
/*		padding: 15px 10px 0px 10px;*/
		
		border: 1px solid #d5d5cb;
		border-bottom: 3px solid #d5d5cb;
		background-color: #f6f3e7;
		
/*		background: url(../images/home-pullquotes-bg3.png) no-repeat -15px -2px;*/
	}

	.ie #instructorsList { margin-right: 15px; }

	#instructorsList h2 {
		padding-left: 12px;
		padding-top: 9px;
		padding-bottom: 9px;
		
		margin-bottom: 10px;
		margin-top: 0px;
		
		font-style: italic;
		font-size: 120%;
		font-weight: normal;
		color: #7b7a71;
		
		border-bottom: 1px dotted #e2e2e2;
		background-color: #efebdf;
		
	}

	#instructorsList ul {
		list-style: none outside;
/*		margin: 2px 0 0px 0;*/
		padding: 4px 0 9px 13px;
		font-size: 100%;
/*		border-bottom: 1px dotted #e2e2e2;*/
		}
	
	#instructorsList ul li.instrument {
		color: #e97845;
		font-size: .8em;
		text-transform: uppercase;
		padding: 0px;
		margin: 0px;
	}
	
/* 
For some reason <#instructorsList ul li> was <#instructorsList ul* li>. Reason at the time (pre 2009.03.23): "was a list of "#instructorsList ul.guitar li" before ul*. This way I doesn't have to add a class for each no instrument added to the list. Not to mention, no class is needed anymore"
*/

	#instructorsList ul li {
		text-transform: none;
		color: #604234;
		font-size: 1.2em;
		line-height: 1.2em;
	}

	#instructorsList a.instrumentTitle:link		{ color: #e97845; text-decoration: none; }
	#instructorsList a.instrumentTitle:visited	{ color: #e97845; text-decoration: none; }
	#instructorsList a.instrumentTitle:hover	{ font-weight: bold; background-color: white; /*background-color: #f4eee1;*/ }

	#instructorsList a:link		{ color: #604234; text-decoration: none; }
	#instructorsList a:visited	{ color: #604234; text-decoration: none; }
	#instructorsList a:hover	{ color: black; font-weight: bold; background-color: white; /*background-color: #f4eee1;*/ }
