CSS - Barra lateral (Uma imagem em cima dos gadgets e no fundo do gadget outra imagens)

Código:

#sidebar-wrapper h2 {
	background:transparent url(Aqui o link da imagem do sidebar) no-repeat scroll 0pt;
	margin:0pt;
	padding:5px 25px 15px 15px;
	color: #FFFFFF;
	font: bold 110%/110% "Lucida Grande", Arial, sans-serif;text-align: center;
	}
	.widget-content {
	background:transparent url(Aqui o link da barra lateral) repeat-y bottom left;
	margin:0pt;
	overflow:hidden;
	padding:5px 0px 9px;
	}
	#sidebar-wrapper ul{
	list-style: none;
	}
	#sidebar-wrapper li{
	background: url() no-repeat;
	padding-left: 16px ;
	}
	/*-- (Lateral 2) --*/
	#sidebarl-wrapper {
	float:left;
	width: 210px;
	color: #FFFFFF;
	line-height: 160%;
	padding:11px 0 0 0;
	}
	.sidebarl .widget {
	padding:0pt 0px 10px;
	width:210px;
	}
	#sidebarl-wrapper h2 {
	background:transparent url(Aqui o link da imagem do sidebar) no-repeat scroll 0pt;
	margin:0pt;
	padding:5px 25px 20px 15px;
	color: #FFFFFF;
	font: bold 110%/110% "Lucida Grande", Arial, sans-serif;text-align: center;
	}
	.widgetl-content {
	background:transparent url(Aqui o link da imagem da barra lateral) repeat-y bottom left;
	margin:0pt;
	overflow:hidden;
	padding:5px 0px 9px;
	}