/* boxes with corners */

.whitebox
{
	background: white;
	color: black;
	position: relative;
}

.whitebox .bl, .whitebox .br, .whitebox .tl, .whitebox .tr
{
	position: absolute;
	width: 2px;
	height: 2px;
}

.whitebox .b, .whitebox .r
{
	position: absolute;
}

.whitebox .bl
{
	background: url(pic/white_bl.gif) no-repeat;
	left: 0;
	bottom: 0;
}

.whitebox .br
{
	background: url(pic/white_br.gif) no-repeat;
	right: 0;
	bottom: 0;
}

.whitebox .tl
{
	background: url(pic/white_tl.gif) no-repeat;
	left: 0;
	top: 0;
}

.whitebox .tr
{
	background: url(pic/white_tr.gif) no-repeat;
	right: 0;
	top: 0;
}

.whitebox .b
{
	background: url(pic/white_b.gif) repeat-x;
	width: 100%;
	height: 2px;
	left: 0;
	bottom: 0;
}

.whitebox .r
{
	background: url(pic/white_r.gif) repeat-y;
	width: 2px;
	height: 100%;
	right: 0;
	bottom: 0;
}

/**********************/

.graybox
{
	background: #999;
	color: white;
	position: relative;
}

.graybox .bl, .graybox .br, .graybox .tl, .graybox .tr
{
	position: absolute;
	width: 2px;
	height: 2px;
}

.graybox .b, .graybox .t
{
	position: absolute;
	width: 100%;
	height: 2px;
}

.graybox .l, .graybox .r
{
	position: absolute;
	width: 2px;
	height: 100%;
}

.graybox .bl
{
	background: url(pic/gray_bl.gif) no-repeat;
	left: 0;
	bottom: 0;
}

.graybox .br
{
	background: url(pic/gray_br.gif) no-repeat;
	right: 0;
	bottom: 0;
}

.graybox .tl
{
	background: url(pic/gray_tl.gif) no-repeat;
	left: 0;
	top: 0;
}

.graybox .tr
{
	background: url(pic/gray_tr.gif) no-repeat;
	right: 0;
	top: 0;
}

.graybox .t
{
	background: url(pic/gray_t.gif) repeat-x;
	top: 0;
	left: 0;
}

.graybox .l
{
	background: url(pic/gray_l.gif) repeat-y;
	top: 0;
	left: 0;
}

.graybox .b
{
	background: url(pic/gray_b.gif) repeat-x;
	left: 0;
	bottom: 0;
}

.graybox .r
{
	background: url(pic/gray_r.gif) repeat-y;
	right: 0;
	bottom: 0;
}

/**********************/

.bluebutton
{
	background: #5093df;
	color: white;
	position: relative;
	width: 12em;
	text-align: left;
}

.bluebutton .wrapper1
{
	margin-top: 11px;
}

.bluebutton hr
{
	clear: both;
	color: white;
	background-color: white;
	width: 100%;
	height: 1px;
	border: none;
}

.bluebutton .bl, .bluebutton .br, .bluebutton .tl, .bluebutton .tr
{
	position: absolute;
	width: 11px;
	height: 11px;
}

.bluebutton .b, .bluebutton .t
{
	position: absolute;
	width: 100%;
	height: 11px;
}

.bluebutton .l, .bluebutton .r
{
	position: absolute;
	width: 11px;
	height: 100%;
}

.bluebutton .bl
{
	background: url(pic/bluebtn_bl.gif) no-repeat;
	left: 0;
	bottom: 0;
}

.bluebutton .br
{
	background: url(pic/bluebtn_br.gif) no-repeat;
	right: 0;
	bottom: 0;
}

.bluebutton .tl
{
	background: url(pic/bluebtn_tl.gif) no-repeat;
	left: 0;
	top: 0;
}

.bluebutton .tr
{
	background: url(pic/bluebtn_tr.gif) no-repeat;
	right: 0;
	top: 0;
}

.bluebutton .t
{
	background: url(pic/bluebtn_t.gif) repeat-x;
	top: 0;
	left: 0;
}

.bluebutton .l
{
	background: url(pic/bluebtn_l.gif) repeat-y;
	top: 0;
	left: 0;
}

.bluebutton .b
{
	background: url(pic/bluebtn_b.gif) repeat-x;
	left: 0;
	bottom: 0;
}

.bluebutton .r
{
	background: url(pic/bluebtn_r.gif) repeat-y;
	right: 0;
	bottom: 0;
}

a.bluebutton:active .bl
{
	background: url(pic/bluebtn_pressed_bl.gif) no-repeat;
}

a.bluebutton:active .br
{
	background: url(pic/bluebtn_pressed_br.gif) no-repeat;
}

a.bluebutton:active .tl
{
	background: url(pic/bluebtn_pressed_tl.gif) no-repeat;
}

a.bluebutton:active .tr
{
	background: url(pic/bluebtn_pressed_tr.gif) no-repeat;
}

a.bluebutton:active .t
{
	background: url(pic/bluebtn_pressed_t.gif) repeat-x;
}

a.bluebutton:active .l
{
	background: url(pic/bluebtn_pressed_l.gif) repeat-y;
}

a.bluebutton:active .b
{
	background: url(pic/bluebtn_pressed_b.gif) repeat-x;
}

a.bluebutton:active .r
{
	background: url(pic/bluebtn_pressed_r.gif) repeat-y;
}