#viewitembox
{
    BORDER-RIGHT: #e0e0e0 1px solid;
    BORDER-TOP: #e0e0e0 1px solid;
    DISPLAY: inline;
    FLOAT: left;
    MARGIN: 5px 5px 5px 0px;
    PADDING:0px;
    BORDER-LEFT: #e0e0e0 1px solid;
    WIDTH: 178px;
    LINE-HEIGHT: 17px;
    BORDER-BOTTOM: #e0e0e0 1px solid;
    POSITION:RELATIVE;
    HEIGHT: 200px;
    /*Background-color:#f7f7f7;  url(../images/itembox_bg.png)  #ebeeef repeat-x 0px 0px;*/
}
#viewitembox .item_title
{
	FONT-SIZE:12px;
	FONT-WEIGHT:BOLD;
	TEXT-ALIGN:left;
	TEXT-DECORATION:NONE
	
}
#viewitembox .item_category
{
	FONT-SIZE:12px;
	FONT-WEIGHT:BOLD;
	TEXT-ALIGN:left;
	TEXT-DECORATION:NONE;
	background:url(../images/h30.png) repeat-x 0px 0px;
	height:30px;
	PADDING:5px;
}
#viewitembox .item_details
{
	FONT-SIZE:12px;
	FONT-WEIGHT:BOLD;
	TEXT-ALIGN:left;
	PADDING:5px;
	TEXT-DECORATION:NONE;
	
	height:30px;
}

.overlay{
position:fixed;
z-index:900;    /* PUT THIS ELEMENT FAR ABOVE THE REST.. WE WANT THE 'DIALOG BOX' TO BE ABOVE OTHER ELEMENTS.*/
width:100%;     /*MAKE IT STRETCH ALL OVER THE BROWSER SCREEN SO IT COVERS EVERYTHING ELSE WITH THE TRANSPARENT SHADOW, SO THINGS BENEATH CANNOT BE CLICKED*/
height:100%;    /*  - || - */
/*background-image:url(transparent.png);*/  /*SEMI-TRANSPARENT PNG TO SHADE THINGS BENEATH THE DIALOG BOX*/
background-repeat:repeat;               /*FILL THE WHOLE OVERLAY ELEMENT WITH PNG IMAGE*/
top:0;  /*PLACE THE TOP LEFT CORNER OF THE OVERLAY ELEMENT TO THE TOP LEFT CORNER OF BROWSER SCREEN*/
left:0;
display:none;
}

.overlay .centered   /*THIS IS THE STYLE FOR THE ELEMENT THAT WILL ACTUALLY HOLD CONTROLS TO DISPLAY FOR THE USER*/
{
position:relative;/*We also fix it to about center of the screen (see other css rules below)*/
width:25%;/*half the screen width*/
height:25%;/*half the screen height*/
margin: 20% 35% 20% 35%;  /*Put it about the center..*/
padding:10px;  /*Move contents of the dialog a bit away from the borders.. */
background-color:White;  /* make the background of the dialog white */ 

z-index:450;    /*PUT IT ABOVE THE OVERLAY'S SEMI-TRANSPARENT ELEMENT*/
border-top:5px solid #eee; border-left:5px solid #ccc; border-right:5px solid #ccc; border-bottom:5px solid #777; 
background: #fff url(../images/h150_med.png) 0 0 repeat-x; 
 -moz-box-shadow:0 10px 70px 0 #000; -webkit-box-shadow: 0 10px 70px #000; position:absolute; z-index:1000; -moz-border-radius: 3px; -webkit-border-radius: 3px;
}

.simple_overlayvc { border-top:1px solid #eee; border-left:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #777; background:#d9dee0 url(../images/h150_med.png) 0 0 repeat-x;   width:480px; padding-left:20px;padding-right:1px; padding-top:2px;-moz-box-shadow:0 10px 70px 0 #000; -webkit-box-shadow: 0 10px 70px #000; position:absolute; z-index:1000; -moz-border-radius: 3px; -webkit-border-radius: 3px; } 
.simple_overlayvc .close { background-image:url(../images/overlay_close.gif); position:absolute; right:5px; top:5px; cursor:pointer; height:35px; width:35px; }
