div#address-book {
	float:left;
	width:600px;
}

div#address-book ol {
    padding:0;
    list-style-type:none;
}

div#address-book fieldset {
	border:none;
	background:none;
}

div#people-filter {
	border:1px solid #ccc;
	border-bottom:none;
	background:#fff;
}

div#people-filter form#filter {
    background:#fff;
}

h3#toggle-filter-button {
    border-top:1px solid #ccc;
    border-right:1px solid #ccc;
    border-left:1px solid #ccc;
    font-weight:normal;
    font-size:13px;
    padding:0.5em 1em;
    text-indent:20px;
    width:140px;
    margin:0;
    position:relative;
    top:1px;
}

.filter-on {
    border-bottom:1px solid #fff;
    background:#fff url(/images/icon.arrow-down.png) 10px no-repeat;
}

.filter-off {
    border-bottom:1px solid #ccc;
    background:#fff url(/images/icon.arrow-right.png) 10px no-repeat;
}

h3#toggle-filter-button a {
	color:#5a5a5a;
	text-decoration:none;
	font-size:12px;
}

div#offices {
    font-size:0.8em;
    text-align:right;
    background:#fff url(/images/bg.nav.png) repeat-x;
    padding:1em;
    border-top:1px solid #ccc;
    border-left:1px solid #ccc;
    border-right:1px solid #ccc;
}

div#offices h3 {
	display:none;
}

div#offices a {
    text-decoration:none;
    font-size:12px;   
}

div#offices a:hover {
    border-bottom:1px solid purple;   
}

span#office-active {
    background:transparent url(/images/bg.selected-office.png) center bottom no-repeat;
    color:white;
    padding:0.5em 1em 20px 1em;
}

span.office-count {
    color:#888;
}

span#office-active span.office-count {
    color:#ccc;
}

div#index {
	padding:2px 0 1px 0;
    float:left;
    height:528px;
    border:1px solid #ccc;
    background:white;
}

div#index h3 {
   display:none;
}

div#index li {
	line-height:1em;
}

div#index li span,
div#index li a {
    font-size:13px;
    text-align:center;
	padding:2px 0.5em;
	display:block;
}

div#index li span {
	color:#bbb;
}


div#index li a:hover {
	background:#ddd;
}

div#contacts-list {
	width:542px;
	padding:14px;
	margin-left:25px;
	background:#fff;
    height:500px;
    border-bottom:1px solid #aaa;
    border-right:1px solid #aaa;
    overflow-y:scroll;
}

div#contacts-list li h4 {
	font-weight:bold;
	float:left;
}

div#contacts-list hr {
	display:block;
	top:0.5em;
	position:relative;
	margin-left:1em;
	border-top:1px dotted #aaa;
}

li.letter {
	clear:both;
}

ul.contacts-for-letter {
    margin:1em 1em 0 1.8em;	
}

ul.contacts-for-letter li.contact {
	list-style-type:none !important;
}
	
ul.contacts-for-letter li:last-child {
    border:none;	
}

li.contact {
    border-bottom:1px dotted #ddd;
    padding:1em 0;
}

li.contact img,
li.contact a img {
   	float:right;
   	border:1px solid #ccc;
}

div#contact-name {
	float:left;
}

div#contact-details {
	height:60px;
    font-size:12px;
    color:#5a5a5a;
    margin-right:70px;
    margin-top:-5px;
    text-align:right;
}

div#contact-details strong {
    font-weight:bold;
}

div#contact-details a {
    text-decoration:none;
    border-bottom:1px solid purple;	
    font-size:12px;
}

span.employee-name,
span.employee-name a {
	display:block;
	margin:0;
	text-decoration:none;
	line-height:1em;
    font-size:14px;
    font-weight:bold;
}

span.employee-name a {
	border-bottom:1px solid purple;
}
	
span.job-title small {
    font-size:13px;
    color:#888;
    font-weight:bold;
}

a.vcard {
    background:transparent url(/images/icon.vcard.png) left no-repeat;
    text-indent:25px;
    display:block;
    color:#888;
    font-size:11px;
}

a.vcard:hover {
    border-bottom:none;	
}
