﻿
div#photoandcaptioncust {
	z-index : 1;
	background : #fff;
}


div#photosupercust {
	position : absolute;
	top: 20px;
	z-index: 4;
	background : transparent url(../images/rounded_corners.png) no-repeat 0 0;
}

div#captionsupercust {
	z-index: 4;
}

.roundcont {
		position:absolute;
		background-color: #F57712; /* #F58024; */
		color: #fff;
		text-align:center; /* kec */
		z-index:3;
		margin:0px; padding:0px;
}

.roundcont p {
		margin: 0px 10px; 
		padding: 0px 10px; 
}

.roundtop {
		position:absolute;
		background: url(../images/round_upleft.png) no-repeat top left;
		behavior: url(../Styles/iepngfix.htc);  
 
		width:10px;
		height:10px;
		float:left;
		z-index:5;
}

.roundtopright { 
		position:absolute;
		background: url(../images/round_upright.png) no-repeat top right; 
		behavior: url(../Styles/iepngfix.htc);  
		float:right;
		right:0px;
		width:10px;
		height:10px;
		z-index:5;
}

.bottomfiller {
		position:relative;
		background-color: #F57712; /* #F58024; */
		color: #fff;
		padding-top:4px;
		padding-bottom:0px;
		margin-bottom:0px;
		z-index:4;
}
	
.pic_caption 
{
	padding:0px; margin:0px;
}
.roundbottom 
{
	    position:absolute; /*relative;*/
		background: url(../images/round_lowleft.png) no-repeat bottom left; 
		behavior: url(../Styles/iepngfix.htc);  
		/* background-position: 0px -10px ; */
		width:10px;
		height:10px; 
		float:left;
		left:0px;
		padding:0px; margin:0px;
		z-index:6;
}

.roundbottomright 
{
	    position:absolute; /*relative;*/
		background: url(../images/round_lowright.png) no-repeat bottom right; 
		behavior: url(../Styles/iepngfix.htc);  
		/* background-position: -11px -11px ; */
		width:10px;
		height:10px; 
		float:right;
		right:0px;
		padding:0px; margin:0px;
		z-index:6;
}

/* - these helped if above 2 rules are positioned relative
* html .roundbottom 
{
	top:4px; }
	
* html .roundbottomright
{
	top:4px; 
}
*/
img.corner {
		width: 10px;
		height: 10px;
		border: none;
		display: block !important;
}


/*
	// All the WIDTHs should be the same
	// roundcont		LEFT:550 - positions the whole thing
	// roundtopright	LEFT:222 - should always be 10 less than WIDTH
	// bottomfiller		HEIGHT:36 - is whatever looks good for the size of the caption
	// roundbottom*		TOP:30 - is always 6 less than HEIGHT

    <div class="roundcont" style="top:20px; left:550px; width:232px; ">
	    <div class="roundtop">&nbsp;</div>
	    <div class="roundtopright" style="left:222px;">&nbsp;</div>

        <img id="Img2" src="../pictures/benefitsschool232x265.jpg" 
                                width="232" runat="server" alt="SchoolBenefits"/>
     
	    <div class="bottomfiller" style="width:232px; height:36px;">
            <p class="pic_caption">	
                    TC is like an extension of your financial aid office</p> 
		    <div class="roundbottom" style="top:30px;"></div>
		    <div class="roundbottomright" style="top:30px;"></div>
	    </div>
    </div>	

*/