/*

fici = fi cornered image

tested on (PC only)
-Firefox 3.0.14
-IE 7
-IE 6 (no borders at all)
-Google Chrome 3.0(.195)
-Safari 3.1

make sure to set the width and height of the .fici div inline

*/
.fici {
  width:auto;
  height:auto;
  position : relative;
  padding:0;
  overflow:hidden;
}

.fici img {
	position:relative;
}

.fici .tl, .fici .tr, .fici .bl, .fici .br {
  position : absolute;
  width : 5px;
  height : 5px;  /* corner img are 40x40 */
  display : block;
}

.fici .tl {
  background : transparent url(../img/fici/fici_tl.png) no-repeat top left;
  top : 0;
  left : 0;
}

.fici .tr {
  background : transparent url(../img/fici/fici_tr.png) no-repeat top right;
  top : 0;
  right : 0;
}

.fici .bl {
  background : transparent url(../img/fici/fici_bl.png) no-repeat bottom left;
  bottom : 0;
  left : 0;
}

.fici .br {
  background : transparent url(../img/fici/fici_br.png) no-repeat bottom right;
  right : 0;
  bottom : 0;
}