/* 
  -- Even more rounded corners with CSS: Base stylesheet --
*/

.kackbox 
{
    position:relative;
    margin:0px auto;
    min-width:8em;
    max-width:1000px; /* based on image dimensions - not quite consistent with drip styles yet */
    color:#fff;
    z-index:1;
    margin-left:15px; /* default, width of left corner */
    margin-bottom:0.5em; /* spacing under kackbox */
}

.kackbox .content,
.kackbox .t,
.kackbox .b,
.kackbox .b div 
{
	background: transparent url('../images/boxes/kack_box.png') no-repeat right top;
}

.kackbox .content 
{
    position:relative;
    zoom: 1;
    padding:0px 9px 0px 0px;
}

.kackbox .t 
{
    /* top+left vertical slice */
    position:absolute;
    left:0px;
    top:0px;
    width:15px; /* top slice width */
    margin-left:-15px;
    height:100%;
    background-position:top left;
}

.kackbox .b 
{
    /* bottom */
    position:relative;
    width:100%;
}

.kackbox .b,
.kackbox .b div 
{
    height:15px; /* height of bottom cap/shade */
    font-size:1px;
}

.kackbox .b 
{
    background-position:bottom right;
}

.kackbox .b div 
{
    position:relative;
    width:15px; /* bottom corner width */
    margin-left:-15px;
    background-position:bottom left;
}

.kackbox .hd,
.kackbox .bd,
.kackbox .ft 
{
    position:relative;
}

.kackbox h1,
.kackbox p 
{
    margin:0px; /* margins will blow out backgrounds, leaving whitespace. */
    padding:0.5em 0px 0.5em 0px;
}

.kackbox h1 
{
    padding-bottom:0px;
}