Address Book Using JPA +ZK + Spring.

style.css

@CHARSET "ISO-8859-1";

/* ----------------------------------------------------------------------------------------------------------------------- */
/* Modal Window CSS Customization
/* ----------------------------------------------------------------------------------------------------------------------- */
.mymodal .z-window-modal-header,.mymodal .z-window-modal-header-noborder
  {
	padding-top: 1px;
	padding-right: -1px;
	padding-bottom: 1px;
	padding-left: 0;
	margin-right: -4px;
	color: white;
	font-size: 12px;
	font-weight: bolder;
}

/* ----------------------------------------------------------------------------------------------------------------------- */
/* Modal Window CSS Customization
/* ----------------------------------------------------------------------------------------------------------------------- */
.mymodal .z-window-modal-hm,.mymodal .z-window-modal-br,.mymodal .z-window-modal-cr,.mymodal .z-window-modal-cl,.mymodal .z-window-modal-hr,.mymodal .z-window-modal-tr,.mymodal .z-window-modal-hl
	{
	background-image: none;
	background: transparent repeat-x 0 0;
	background: #6F8992; /* Old browsers */
	background-image: -ms-linear-gradient(top, #6F8992 0%, #6F8992 100%);
	/* IE10+ */
	background-image: -moz-linear-gradient(top, #6F8992 0%, #6F8992 100%);
	/* Firefox 3.6+ */
	background-image: -o-linear-gradient(top, #6F8992 0%, #6F8992 100%);
	/* Opera 11.10+ */
	background-image: -webkit-gradient(linear, top, bottom, color-stop(0%, #6F8992),
		color-stop(100%,, #6F8992) ); /* Chrome,Safari4+ */
	background-image: -webkit-linear-gradient(top, #6F8992 0%, #6F8992 100%);
	/* Chrome10+,Safari5.1+ */
	background-image: linear-gradient(to bottom, #6F8992 0%, #6F8992 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient(  startColorstr='#6F8992',
		endColorstr='#6F8992', GradientType=0 ); /* IE6-9 */
}

.mymodal .z-window-modal-icon {
	width: 20px;
	height: 16px;
	border-width: 1px;
	border-style: solid;
	border-color: #6F8992 #6F8992 #6F8992 #6F8992;
	box-shadow: inset 0 1px 0 #6F8992, inset -1px -1px 0 #6F8992, inset -1px
		-2px 0 #6F8992;
}

.mymodal .z-window-modal-close {
	background: url('../images/CloseBlue.gif') transparent no-repeat 0 0;
}

/* ----------------------------------------------------------------------------------------------------------------------- */
/* Listbox CSS Customization
/* ----------------------------------------------------------------------------------------------------------------------- */
.z-listcell.highlightcell .z-listcell-cnt,.z-label.highlightcell {
	color: blue;
	cursor: pointer;
	text-decoration: underline;
}

.mylist .z-listbox {
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #CFCFCF;
	overflow: hidden;
}

.mylist .z-listitem-seld {
	background-image: none;
	background-color: #DDF0FB;
}

.mylist .z-listitem.z-listbox-odd.z-listitem-seld {
	background-image: none;
	background-color: #E0F7BA;
}

.mylist .z-listitem.z-listitem-over {
	background-image: none;
	background-color: #E0F7BA;
}

.mylist .z-listitem-odd-seld {
	background-image: none;
	background-color: #DDF0FB;
}

.mylist .z-listbox-header tr.z-listhead,div.z-listbox-header
		tr.z-auxhead {
	background-color: #6F8992;
}

/* Header and Footer Font and Height */
.mylist
		.z-listfooter-cnt,.mylist .z-listheader-cnt {
	border: 0 none;
	color: white;
	font-size: 13px;
	margin: 0;
	height: 14px;
}

/* Cell Height and Font */
.mylist .z-listcell-cnt {
	font-size: 13px;
	height: 20px;
}

.mylist .z-listbox-body .z-listcell,.mylist.z-listbox-footer
		.z-listfooter {
	cursor: default;
}

.mylist .z-listheader-sort-img {
	float: left;
	font-size: 0;
	left: 90%;
	margin-left: auto;
	margin-right: auto;
	position: absolute;
}

.mylist .z-listbox-header tr.z-listhead,div.z-listbox-header
		tr.z-auxhead {
	background-image: none;
	color: white;
}

.mylist .z-listbox-header th.z-listheader-sort-over {
	background-image: none;
}

/* ----------------------------------------------------------------------------------------------------------------------- */
/* Label CSS Customization
/* ----------------------------------------------------------------------------------------------------------------------- */
.TitleWBold.z-label {
	font-weight: bolder;
	color: #FFFFFF;
}

.TitleBold.z-label {
	font-weight: bolder;
}

.sectionTitleLabel.z-label {
	font-size: 14px;
	font-weight: bolder;
	color: #0C6BA8;
}

.flabel.z-label {
	font-size: 12px;
	font-weight: normal;
}

/* ----------------------------------------------------------------------------------------------------------------------- */
/* Text Box
/* ----------------------------------------------------------------------------------------------------------------------- */
.ftextbox.z-textbox.z-textbox-focus {
	border-style: solid;
	border-width: 1px;
	border-color: blue;
}

/* ----------------------------------------------------------------------------------------------------------------------- */
/* Vertical Grid
/* ----------------------------------------------------------------------------------------------------------------------- */
.vgrid tr.z-row
		td.z-row-inner,tr.z-row,div.z-grid-body div.z-cell,div.z-grid {
	border: none;
	overflow: hidden;
	zoom: 1;
	background: white;
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: none;
}

.vgrid .z-grid-odd .vgrid .z-row-inner,.vgrid .z-grid-odd .z-cell {
	background-color: transparent;
	border-bottom: 1px solid transparent;
	border-left: 1px solid transparent;
	border-top: 1px solid transparent;
}

.vgrid .z-grid-odd .vgrid.z-row-inner,.vgrid.z-grid-odd .z-cell,.vgrid.z-grid-odd
	{
	background: none repeat scroll 0 0 transparent;
}

.vgrid tr.z-row td.z-row-inner,.vgrid tr.z-row .z-cell {
	line-height: 12px;
}

.vgrid tr.z-grid-odd td.z-row-inner,.vgrid tr.z-grid-odd .z-cell,.vgrid tr.z-grid-odd
	{
	background: white
}

.vgrid tr.z-row td.z-row-inner,.vgrid tr.z-row .z-cell {
	background: white;
	border-top: none;
}

/* End: Form Grid 
---------------------------------------------- */

/* Start: Action Images- Auditlog
---------------------------------------------- */
.fImageAudit {
	width: 25px;
	background-image: url('../images/AuditLog.jpg');
	background-repeat: no-repeat;
	border: 0 none;
	cursor: pointer;
}

/* Start: Action Images- Edit
---------------------------------------------- */
.fimageedit {
	width: 25px;
	background-image: url('../images/EditRecord.png');
	background-repeat: no-repeat;
	border: 0 none;
	cursor: pointer;
}

/* End: Action Images - Edit
---------------------------------------------- */

/* Start: Action Images- Delete
---------------------------------------------- */
.fimageDelete {
	width: 25px;
	background-image: url('../images/DeleteRecord.png');
	background-repeat: no-repeat;
	border: 0 none;
	cursor: pointer;
}

.fimageView {
	width: 25px;
	background-image: url('../images/view.png');
	background-repeat: no-repeat;
	border: 0 none;
	cursor: pointer;
}

/* End: Action Images - Delete
---------------------------------------------- */

/* Start: Action Images- Active
---------------------------------------------- */
.fimageActive {
	width: 25px;
	background-image: url('../images/ActiveRecord.png');
	background-repeat: no-repeat;
	border: 0 none;
	cursor: pointer;
}

/* End: Action Images - Active
---------------------------------------------- */

/* Start: Action Images- Inactive
---------------------------------------------- */
.fimageInactive {
	width: 25px;
	background-image: url('../images/DeactivateRecord.png');
	background-repeat: no-repeat;
	border: 0 none;
	cursor: pointer;
}

/* End: Action Images - InActive
---------------------------------------------- */

/* ----------------------------------------------------------------------------------------------------------------------- */
/* Label CSS Customization
/* ----------------------------------------------------------------------------------------------------------------------- */
.sectionTitleLabel.z-label {
	color: #0C6BA8;
}

/* ----------------------------------------------------------------------------------------------------------------------- */
/* Div(s)
/* ----------------------------------------------------------------------------------------------------------------------- */
.sectionTitle {
	float: left;
	padding-left: 10px;
}

.sectionTitleBar {
	background: none repeat scroll 0 0 #6F8992;
	margin-left: 20px;
	padding: 2px 5px;
}

.sectionSeperator {
	margin-bottom: 18px;
	padding-bottom: 0.25em;
	margin-left: 10px;
	border-bottom: 4px solid #DFDFDF
}

/* ----------------------------------------------------------------------------------------------------------------------- */


/* ----------------------------------------------------------------------------------------------------------------------- */
/* Patient Cases
/* ----------------------------------------------------------------------------------------------------------------------- */
.patientcaseHeader {
	background: none repeat scroll 0 0 #6F8992;
	padding: 2px 10px;
}

/* ----------------------------------------------------------------------------------------------------------------------- */
/* End of Patient Cases
/* ----------------------------------------------------------------------------------------------------------------------- */
.mybutton.z-button .z-button-cm {
	background-image: none;
	color: white;
	font-weight: bolder;
}

.mybutton.z-button .z-button-tm,.z-button .z-button-bm {
	background-image: none;
}

.mybutton.z-button .z-button-cl,.z-button .z-button-cr {
	background-image: none;
}

.mybutton.z-button .z-button-tl {
	background-image: none;
}

.mybutton.z-button .z-button-bl {
	background-image: none;
}

.mybutton.z-button .z-button-tr {
	background-image: none;
}

.mybutton.z-button .z-button-br {
	background-image: none;
}

.button {
	display: inline-block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	*display: inline;
	vertical-align: baseline;
	margin: 0 2px;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: .5em 2em .55em;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
	box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

.button:hover {
	text-decoration: none;
}

.button:active {
	position: relative;
	top: 1px;
}

.bigrounded {
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;
}

.medium {
	font-size: 12px;
	padding: .4em 1.5em .42em;
}

.small {
	font-size: 11px;
	padding: .2em 1em .275em;
}

/* color styles
  ---------------------------------------------- */

/* black */
.black {
	color: #d7d7d7;
	border: solid 1px #333;
	background: #333;
	background: -webkit-gradient(linear, left top, left bottom, from(#666),
		to(#000) );
	background: -moz-linear-gradient(top, #666, #000);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666',
		endColorstr='#000000' );
}

.black:hover {
	background: #000;
	background: -webkit-gradient(linear, left top, left bottom, from(#444),
		to(#000) );
	background: -moz-linear-gradient(top, #444, #000);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444',
		endColorstr='#000000' );
}

.black:active {
	color: #666;
	background: -webkit-gradient(linear, left top, left bottom, from(#000),
		to(#444) );
	background: -moz-linear-gradient(top, #000, #444);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000',
		endColorstr='#666666' );
}

/* gray */
.gray {
	color: #e9e9e9;
	border: solid 1px #555;
	background: #6e6e6e;
	background: -webkit-gradient(linear, left top, left bottom, from(#888),
		to(#575757) );
	background: -moz-linear-gradient(top, #888, #575757);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888',
		endColorstr='#575757' );
}

.gray:hover {
	background: #616161;
	background: -webkit-gradient(linear, left top, left bottom, from(#757575),
		to(#4b4b4b) );
	background: -moz-linear-gradient(top, #757575, #4b4b4b);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575',
		endColorstr='#4b4b4b' );
}

.gray:active {
	color: #afafaf;
	background: -webkit-gradient(linear, left top, left bottom, from(#575757),
		to(#888) );
	background: -moz-linear-gradient(top, #575757, #888);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757',
		endColorstr='#888888' );
}

/* white */
.white {
	color: #606060;
	border: solid 1px #b7b7b7;
	background: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff),
		to(#ededed) );
	background: -moz-linear-gradient(top, #fff, #ededed);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',
		endColorstr='#ededed' );
}

.white:hover {
	background: #ededed;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff),
		to(#dcdcdc) );
	background: -moz-linear-gradient(top, #fff, #dcdcdc);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',
		endColorstr='#dcdcdc' );
}

.white:active {
	color: #999;
	background: -webkit-gradient(linear, left top, left bottom, from(#ededed),
		to(#fff) );
	background: -moz-linear-gradient(top, #ededed, #fff);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed',
		endColorstr='#ffffff' );
}

/* orange */
.orange {
	color: #fef4e9;
	border: solid 1px #da7c0c;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#faa51a),
		to(#f47a20) );
	background: -moz-linear-gradient(top, #faa51a, #f47a20);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a',
		endColorstr='#f47a20' );
}

.orange:hover {
	background: #f47c20;
	background: -webkit-gradient(linear, left top, left bottom, from(#f88e11),
		to(#f06015) );
	background: -moz-linear-gradient(top, #f88e11, #f06015);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11',
		endColorstr='#f06015' );
}

.orange:active {
	color: #fcd3a5;
	background: -webkit-gradient(linear, left top, left bottom, from(#f47a20),
		to(#faa51a) );
	background: -moz-linear-gradient(top, #f47a20, #faa51a);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20',
		endColorstr='#faa51a' );
}

/* red */
.red {
	color: #faddde;
	border: solid 1px #980c10;
	background: #d81b21;
	background: -webkit-gradient(linear, left top, left bottom, from(#ed1c24),
		to(#aa1317) );
	background: -moz-linear-gradient(top, #ed1c24, #aa1317);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ed1c24',
		endColorstr='#aa1317' );
}

.red:hover {
	background: #b61318;
	background: -webkit-gradient(linear, left top, left bottom, from(#c9151b),
		to(#a11115) );
	background: -moz-linear-gradient(top, #c9151b, #a11115);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9151b',
		endColorstr='#a11115' );
}

.red:active {
	color: #de898c;
	background: -webkit-gradient(linear, left top, left bottom, from(#aa1317),
		to(#ed1c24) );
	background: -moz-linear-gradient(top, #aa1317, #ed1c24);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aa1317',
		endColorstr='#ed1c24' );
}

/* blue */
.blue {
	color: #d9eef7;
	border: solid 1px #0076a3;
	background: #0095cd;
	background: -webkit-gradient(linear, left top, left bottom, from(#00adee),
		to(#0078a5) );
	background: -moz-linear-gradient(top, #00adee, #0078a5);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00adee',
		endColorstr='#0078a5' );
}

.blue:hover {
	background: #007ead;
	background: -webkit-gradient(linear, left top, left bottom, from(#0095cc),
		to(#00678e) );
	background: -moz-linear-gradient(top, #0095cc, #00678e);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0095cc',
		endColorstr='#00678e' );
}

.blue:active {
	color: #80bed6;
	background: -webkit-gradient(linear, left top, left bottom, from(#0078a5),
		to(#00adee) );
	background: -moz-linear-gradient(top, #0078a5, #00adee);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0078a5',
		endColorstr='#00adee' );
}

/* rosy */
.rosy {
	color: #fae7e9;
	border: solid 1px #b73948;
	background: #da5867;
	background: -webkit-gradient(linear, left top, left bottom, from(#f16c7c),
		to(#bf404f) );
	background: -moz-linear-gradient(top, #f16c7c, #bf404f);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f16c7c',
		endColorstr='#bf404f' );
}

.rosy:hover {
	background: #ba4b58;
	background: -webkit-gradient(linear, left top, left bottom, from(#cf5d6a),
		to(#a53845) );
	background: -moz-linear-gradient(top, #cf5d6a, #a53845);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf5d6a',
		endColorstr='#a53845' );
}

.rosy:active {
	color: #dca4ab;
	background: -webkit-gradient(linear, left top, left bottom, from(#bf404f),
		to(#f16c7c) );
	background: -moz-linear-gradient(top, #bf404f, #f16c7c);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bf404f',
		endColorstr='#f16c7c' );
}

/* green */
.green {
	color: #e8f0de;
	border: solid 1px #538312;
	background: #64991e;
	background: -webkit-gradient(linear, left top, left bottom, from(#7db72f),
		to(#4e7d0e) );
	background: -moz-linear-gradient(top, #7db72f, #4e7d0e);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7db72f',
		endColorstr='#4e7d0e' );
}

.green:hover {
	background: #538018;
	background: -webkit-gradient(linear, left top, left bottom, from(#6b9d28),
		to(#436b0c) );
	background: -moz-linear-gradient(top, #6b9d28, #436b0c);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6b9d28',
		endColorstr='#436b0c' );
}

.green:active {
	color: #a9c08c;
	background: -webkit-gradient(linear, left top, left bottom, from(#4e7d0e),
		to(#7db72f) );
	background: -moz-linear-gradient(top, #4e7d0e, #7db72f);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4e7d0e',
		endColorstr='#7db72f' );
}

/* pink */
.pink {
	color: #feeef5;
	border: solid 1px #d2729e;
	background: #f895c2;
	background: -webkit-gradient(linear, left top, left bottom, from(#feb1d3),
		to(#f171ab) );
	background: -moz-linear-gradient(top, #feb1d3, #f171ab);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#feb1d3',
		endColorstr='#f171ab' );
}

.pink:hover {
	background: #d57ea5;
	background: -webkit-gradient(linear, left top, left bottom, from(#f4aacb),
		to(#e86ca4) );
	background: -moz-linear-gradient(top, #f4aacb, #e86ca4);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4aacb',
		endColorstr='#e86ca4' );
}

.pink:active {
	color: #f3c3d9;
	background: -webkit-gradient(linear, left top, left bottom, from(#f171ab),
		to(#feb1d3) );
	background: -moz-linear-gradient(top, #f171ab, #feb1d3);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f171ab',
		endColorstr='#feb1d3' );
}