body{
 background-color:#FFFFFF;
 color:#0E0E0E;
 font-family: Helvetica, HelveticaNeue, Verdana, Arial, sans-serif;

 }
 
 
 h1
 {
 padding:0;
 margin:0;
 width:auto;
 height:auto;
 }
 
 
 
 /* BASIC FONT DECLARATIONS */
/* ////////////////////////////////////////////////////////////////// */

.helvetica
{
 font-weight:400;
 letter-spacing:0.09em;
 font-family: Helvetica, HelveticaNeue, Verdana, Arial, sans-serif;
 }
 
 
/* ////////////////////////////////////////////////////////////////// */
 /* END of BASIC FONT DECLARATIONS */
 
 
 
 
.centereverything
{
 /*this holds everything, and centers it*/
width:980px;
height:auto;
min-height:100px;
margin:auto;
}


.maincontainer
{
 /*this holds everything*/
 height:500px;
 width:980px;
/* background-color:#CCFFCC;*/
 
}
 
 
  
 
 /* ////////////////////////////////////////////////////////////////// */
/* HEADER */

.header
{
 /*the header box */

 height:auto;
 width:980px;
 padding-top:30px;
 padding-bottom:29px;
 /* OVERALL WIDTH of 980*/
 
 margin-left:20px;
 margin-right:20px;

 border-bottom:4px solid #FF6B00;
 /*background-color:#CCFFCC;*/

}
 
 
		.nmbname
		{
			font-size:24px;
			text-transform:uppercase;
			color:#0E0E0E;
		}
			.nmbname A:link {color: #0E0E0E; text-decoration: none} 
			.nmbname A:visited {color: #0E0E0E; text-decoration: none} 
			.nmbname A:active {color: #0E0E0E; text-decoration: none} 
			.nmbname A:hover {color: #0E0E0E; text-decoration: none; } 
			
		
 /* END HEADER */
 /* ////////////////////////////////////////////////////////////////// */

 
 
 
 
 		
 		
 
 
 
 .caplabels
 {
 
 font-weight:400;
 letter-spacing:0.09em;
 font-family: Helvetica, HelveticaNeue, Verdana, Arial, sans-serif;
 height:auto;
 width:940px;
 padding-top:20px;
 margin-left:20px;
 float:left;
 letter-spacing:0.1em;
 font-size:18px;

 }
 
 
 
 
 
 
/* ////////////////////////////////////////////////////////////////// */
/* left column */



	.leftcolumn
	{
		/*the leftcolumn box */

		height:auto;
		min-height:600px;
		width:620px;
		margin-top:18px;
		/* OVERALL WIDTH of 980*/
 
		margin-left:20px;
		margin-right:20px;


		float:left;
	}
	
	
			#left
			{
			/*background-color:#FDB912;*/
			}
			
			#centercell
			{
			margin-left:20px;
			}
			
			#right
			{
			margin-left:20px;
			}
			
			
			.cell
			{
			height:180px;
			width:300px;
			background-color:#EBE8E5;
			float:left;
			margin-bottom:20px;
			}
			
				cell.a
				{
				height:180px;
				width:300px;
				}
				.cell A:link {color: #0E0E0E; text-decoration: none} 
				.cell A:visited {color: #0E0E0E; text-decoration: none} 
				.cell A:active {color: #0E0E0E; text-decoration: none} 
				.cell A:hover {color: #898989; text-decoration: none; } 
			
			
				.cell:hover .cellonhover
				{
				opacity:0.9;
				-webkit-transition: opacity .2s ease-in-out;
				}
			
			
			
				
				.cellonhover
				{
				height:180px;
				width:300px;
				color:#FFFFFF;
				opacity:0.0;
				-webkit-transition: opacity .2s ease-in-out;
				}
				
			
					.blackout_spacer
					{
					height:120px;
					width:300px;
					}
				
				
					.blackout
					{
					padding-top:11px;
					height:55px;
					padding-left:12px;
					width:288px;
					background-color:#0E0E0E;
					opacity:0.9;
					}
				
					.blackoutheadline
					{
					font-weight:bold;
					font-size:16px;
					letter-spacing:0.09em;
					font-family: ClarendonBT-Roman, monaco, sans-serif;
					text-transform:uppercase;
					opacity:1.0;

					}
					
					.blackoutSUBheadline
					{
					padding-top:4px;
					font-weight:400;
					font-size:10px;
					letter-spacing:0.1em;
					font-family: freight-sans-pro, monaco, sans-serif;
					text-transform:uppercase;
					font-style:italic;
					opacity:1.0;
					}
				
				
			

/* end leftcolumn */
/* ////////////////////////////////////////////////////////////////// */
 
 
 
 
 
 
	 .singlecolumncap
	{
		/*the WORK caption */

		height:auto;
		min-height:20px;
		width:auto;
		margin-right:20px;
		float:left;
		
		
	}


 	.singlecolumndescription
	{
		/*the WORK caption */

		height:auto;
		min-height:20px;
		width:auto;
		float:right;
		margin-top:3px;
		color:#6B6B6B;
 			font-family: adelle, monaco, sans-serif;
 			font-weight:600;
 			font-size:12px;
 			letter-spacing:0.05em;
 			line-height:1.4em; 
 
	}

 
 
	.workcolumn
	{
		/*the workcolumn box */

		height:auto;
		min-height:600px;
		width:940px;
		margin-top:18px;
		/* OVERALL WIDTH of 980*/
 
		margin-left:20px;
		margin-right:20px;


		float:left;
	}
	
	
	
	
	
 
 
 
 
 
 
/* ////////////////////////////////////////////////////////////////// */
/* right column */

	.rightcolumncap
	{
		/*the FROM THE BLOG... caption */
		height:auto;
		min-height:20px;
		width:300px
		float:left;
	}
	
	
	.rightcolumn
	{
		/*the slider box */

		height:auto;
		min-height:600px;
		width:300px;
		margin-top:18px;
		/* OVERALL WIDTH of 980*/
 
		margin-right:20px;

		float:left;
	}


/* end rightcolumn */
/* ////////////////////////////////////////////////////////////////// */
 
 
 
 
 
 
 
 
 
 
 
 
  /* ////////////////////////////////////////////////////////////////// */
/* FOOTER */

.footer
{
 /*the footer box */

 height:auto;
 width:980px;
 padding-top:30px;
 padding-bottom:29px;
 /* OVERALL WIDTH of 980*/
 
 margin-left:0px;
 margin-right:20px;
 margin-top:20px;
 
 border-top:4px solid #FF6B00;
 /*background-color:#CCFFCC;*/
 float:left;
}

.em_copyright {font-size:8px; text-align:left; vertical-align:top;}

/* FOOTER */
/* ////////////////////////////////////////////////////////////////// */
 
 
 
 
 /**
 * Grid
 */
 
#grid{

    /* Dimensions - same width as your grid with gutters */
    width: 980px;

    /* Grid (left-aligned)
    position: absolute;
    top: 0;
    left: 0;
    */

    /* Grid (centered) */
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -490px;

}

/**
 * Vertical grid lines
 *
 * Set the column width taking the borders into consideration,
 * and use margins to set column gutters.
 */
#grid div.vert{

    width: 139px;
    border: solid darkturquoise;
    border-width: 0 1px;
    margin-right: 19px;

}

#grid div.vert.first-line{

    margin-left: 19px;

}


/**
 * Horizontal grid lines, defined by your base line height
 *
 * Remember, the CSS properties that define the box model:
 * visible height = height + borders + margins + padding
 */
#grid div.horiz{

    /* 20px line height */
    height: 19px;
    border-bottom: 1px dotted darkgray;
    margin: 0;
    padding: 0;

}

/**
* Classes for multiple grids
*
* When using more than one grid, remember to set the numberOfGrids 
* option in the hashgrid.js file.
*/
#grid.grid-1 div.vert{

    /* Vertical grid line colour for grid 1 */
    border-color: darkturquoise;

}
#grid.grid-2{

    /* Adjustments */
    padding: 0 160px;
    width: 660px;

}
#grid.grid-2 div.vert{

    /* Vertical grid line colour for grid 2 */
    border-color: crimson;

}