/* Default styling. Used when JavaScript is unsupported */
.roundMe { margin: .65em 10px; padding: 0 10px; background: #F7F7F7; border: 1px solid #666; }
.roundMe h1 { margin: 0 -10px; padding: 3px 10px 0px 10px; background: url('../images/header_bg.jpg') repeat-x 100% 0; color: white; height: 24px; font-size: 90%; }
.rounded { margin: 0.5em 0; }

/* Rules for the top corners and border */
.bt { background: url(../images/rbox.png) no-repeat 100% 0; margin: 0 0 0 29px; height: 20px; }
.bt div { height: 20px; width: 20px; position: relative; left: -20px; background: url(images/rbox.png) no-repeat 0 0; }

/* Rules for the bottom corners and border */
.bb { background: url(../images/rbox.png) no-repeat 100% 100%; margin:0 0 0 29px; height:20px; }
.bb div { height: 20px; width: 20px; position: relative; left:-20px; background: url(../images/rbox.png) no-repeat 0 100%; }

/* Insert the left border */
.i1 { padding: 0 0 0 16px; background: url(../images/rbox_border_left.png) repeat-y 0 0; }

/* Insert the right border */
.i2 { margin-right: -9px; padding: 0 15px 0 0; background: url(../images/rbox_border_right.png) repeat-y 100% 0; }

/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
.i3 { background:#F7F7F7; border: 1px solid #F7F7F7; border-width: 1px 0; padding:0 10px; }

.i3 h1 { margin: 0px -15px 0px -16px; padding: 3px 10px 0px 10px; background: url('../images/header_bg.jpg') repeat-x 100% 0; height: 24px; color: white; font-size: 100%; font-weight: normal; }
	
/* CSS for the box ends here */