﻿
.boxgrid{
	width:  200px;
	height: 200px;
	margin: 10px 15px 10px 15px;
	float: left;
	background:#161613;
	border: solid 2px #8399AF;
	overflow: hidden;
	position: relative;
	text-align: left;
}

.boxgrid img{ position: absolute; top: 0; left: 0; border: 0; }
.boxgrid h1 { margin: 10px 10px 0px 10px; color: #9A2C33; font:18pt Arial, sans-serif; letter-spacing:-1px; font-weight: bold; }
.boxgrid p { padding: 0px 10px 0px 10px; color: #afafaf; font-weight: bold; font: 10pt Frutiger Linotype, Arial, Helvetica, Sans-serif; }

.boxcaption{
	float: left;
	position: absolute;
	background: #000;
	height: 100px;
	width: 100%;
	opacity: .8;
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	padding-top: 0;
 }
 
 .captionfull .boxcaption { top: 200; left: 0; }
 .caption .boxcaption { top: 160; left: 0; }
 
/*#pictureContainer { 
        display: table; 
        margin: 0 auto; 
        text-align: center; // center inline blocks for IE  
        border-collapse: separate; // cellspacing 
        border-spacing: 10px 0; // cellspacing distance - horizontal/vertical 
    } 

#pictureContainer .boxgrid { 
        display: inline-block; 
        margin: 0 10px 0 0; // spacing for inline-block, FF and Opera will ignore this  
    } 
    #pictureContainer .boxgrid { 
        display: inline; // IE workaround, extra rule to get inline-block to work for block element
    } 
    #pictureContainer .boxgrid { 
        display: table-cell; // FF and Opera, IE will ignore this and use the above two rules  
        text-align: left; // only if required to override center on container  
        padding: 10px; 
        font-size: 1.3em; 
        border: 2px solid #dad; 
        //width: 180px;
    } */