@import 'lib/reset.css';
@import 'lib/typography.css';
@import 'lib/forms.css';

/* layout */
.container {width:950px;margin:0 auto;}
.showgrid {background:url(/img/grid.png);}
body {margin:1.5em 0;background:#f0ebe1 url(/img/bg/body.jpg);}
div.span-1, div.span-2, div.span-3, div.span-4, div.span-5, div.span-6, div.span-7, div.span-8, div.span-9, div.span-10, div.span-11, div.span-12, div.span-13, div.span-14, div.span-15, div.span-16, div.span-17, div.span-18, div.span-19, div.span-20, div.span-21, div.span-22, div.span-23, div.span-24 {float:left;margin-right:10px;}
div.last {margin-right:0;}
.span-1 {width:30px;}
.span-2 {width:70px;}
.span-3 {width:110px;}
.span-4 {width:150px;}
.span-5 {width:190px;}
.span-6 {width:230px;}
.span-7 {width:270px;}
.span-8 {width:310px;}
.span-9 {width:350px;}
.span-10 {width:390px;}
.span-11 {width:430px;}
.span-12 {width:470px;}
.span-13 {width:510px;}
.span-14 {width:550px;}
.span-15 {width:590px;}
.span-16 {width:630px;}
.span-17 {width:670px;}
.span-18 {width:710px;}
.span-19 {width:750px;}
.span-20 {width:790px;}
.span-21 {width:830px;}
.span-22 {width:870px;}
.span-23 {width:910px;}
.span-24, div.span-24 {width:950px;margin:0;}
.append-1 {padding-right:40px;}
.append-2 {padding-right:80px;}
.append-3 {padding-right:120px;}
.append-4 {padding-right:160px;}
.append-5 {padding-right:200px;}
.append-6 {padding-right:240px;}
.append-7 {padding-right:280px;}
.append-8 {padding-right:320px;}
.append-9 {padding-right:360px;}
.append-10 {padding-right:400px;}
.append-11 {padding-right:440px;}
.append-12 {padding-right:480px;}
.append-13 {padding-right:520px;}
.append-14 {padding-right:560px;}
.append-15 {padding-right:600px;}
.append-16 {padding-right:640px;}
.append-17 {padding-right:680px;}
.append-18 {padding-right:720px;}
.append-19 {padding-right:760px;}
.append-20 {padding-right:800px;}
.append-21 {padding-right:840px;}
.append-22 {padding-right:880px;}
.append-23 {padding-right:920px;}
.prepend-1 {padding-left:40px;}
.prepend-2 {padding-left:80px;}
.prepend-3 {padding-left:120px;}
.prepend-4 {padding-left:160px;}
.prepend-5 {padding-left:200px;}
.prepend-6 {padding-left:240px;}
.prepend-7 {padding-left:280px;}
.prepend-8 {padding-left:320px;}
.prepend-9 {padding-left:360px;}
.prepend-10 {padding-left:400px;}
.prepend-11 {padding-left:440px;}
.prepend-12 {padding-left:480px;}
.prepend-13 {padding-left:520px;}
.prepend-14 {padding-left:560px;}
.prepend-15 {padding-left:600px;}
.prepend-16 {padding-left:640px;}
.prepend-17 {padding-left:680px;}
.prepend-18 {padding-left:720px;}
.prepend-19 {padding-left:760px;}
.prepend-20 {padding-left:800px;}
.prepend-21 {padding-left:840px;}
.prepend-22 {padding-left:880px;}
.prepend-23 {padding-left:920px;}
div.border {padding-right:4px;margin-right:5px;border-right:1px solid #eee;}
div.colborder {padding-right:24px;margin-right:25px;border-right:1px solid #eee;}
.pull-1 {margin-left:-40px;}
.pull-2 {margin-left:-80px;}
.pull-3 {margin-left:-120px;}
.pull-4 {margin-left:-160px;}
.pull-5 {margin-left:-200px;}
.pull-6 {margin-left:-240px;}
.pull-7 {margin-left:-280px;}
.pull-8 {margin-left:-320px;}
.pull-9 {margin-left:-360px;}
.pull-10 {margin-left:-400px;}
.pull-11 {margin-left:-440px;}
.pull-12 {margin-left:-480px;}
.pull-13 {margin-left:-520px;}
.pull-14 {margin-left:-560px;}
.pull-15 {margin-left:-600px;}
.pull-16 {margin-left:-640px;}
.pull-17 {margin-left:-680px;}
.pull-18 {margin-left:-720px;}
.pull-19 {margin-left:-760px;}
.pull-20 {margin-left:-800px;}
.pull-21 {margin-left:-840px;}
.pull-22 {margin-left:-880px;}
.pull-23 {margin-left:-920px;}
.pull-24 {margin-left:-960px;}
.pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11, .pull-12, .pull-13, .pull-14, .pull-15, .pull-16, .pull-17, .pull-18, .pull-19, .pull-20, .pull-21, .pull-22, .pull-23, .pull-24 {float:left;position:relative;}
.push-1 {margin:0 -40px 1.5em 40px;}
.push-2 {margin:0 -80px 1.5em 80px;}
.push-3 {margin:0 -120px 1.5em 120px;}
.push-4 {margin:0 -160px 1.5em 160px;}
.push-5 {margin:0 -200px 1.5em 200px;}
.push-6 {margin:0 -240px 1.5em 240px;}
.push-7 {margin:0 -280px 1.5em 280px;}
.push-8 {margin:0 -320px 1.5em 320px;}
.push-9 {margin:0 -360px 1.5em 360px;}
.push-10 {margin:0 -400px 1.5em 400px;}
.push-11 {margin:0 -440px 1.5em 440px;}
.push-12 {margin:0 -480px 1.5em 480px;}
.push-13 {margin:0 -520px 1.5em 520px;}
.push-14 {margin:0 -560px 1.5em 560px;}
.push-15 {margin:0 -600px 1.5em 600px;}
.push-16 {margin:0 -640px 1.5em 640px;}
.push-17 {margin:0 -680px 1.5em 680px;}
.push-18 {margin:0 -720px 1.5em 720px;}
.push-19 {margin:0 -760px 1.5em 760px;}
.push-20 {margin:0 -800px 1.5em 800px;}
.push-21 {margin:0 -840px 1.5em 840px;}
.push-22 {margin:0 -880px 1.5em 880px;}
.push-23 {margin:0 -920px 1.5em 920px;}
.push-24 {margin:0 -960px 1.5em 960px;}
.push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11, .push-12, .push-13, .push-14, .push-15, .push-16, .push-17, .push-18, .push-19, .push-20, .push-21, .push-22, .push-23, .push-24 {float:right;position:relative;}

/* structure */
#header { background: url(/img/bg/header.png) top left no-repeat; position: relative; height: 180px; z-index: 5; }
#footer { height: 60px; background: url(/img/bg/footer.png) bottom left no-repeat; }
#main 	{ background: url(/img/bg/main.png) top left repeat-y; min-height: 200px; }
#logo 	{ padding-top: 3.5em; }

#page-home 	{}

#page-login { margin-top: 5em; }
#page-login .container { width: 790px; }
#page-login #header { text-align: center; background-image: url(/img/bg/login-header.png); padding-bottom: 3em; }
#page-login #main { background-image: url(/img/bg/login-main.png); min-height: 280px; }
#page-login #footer { background-image: url(/img/bg/login-footer.png); }

#page-login #login-card {
	height: 250px;
	position: relative;
	z-index: 5;
	bottom: -250px;
	margin-top: -250px;
	padding: 40px 40px 0 80px;
	background: url(/img/bg/login-card.png) 0 0 no-repeat;
}

/* navigation */
#navigation { height: 27px; float: left; }
#nav-list { list-style: none; padding: 0; margin: 0; }
#nav-list li { float: left; font-size: 1.273em; }
#nav-list li a { float: left; height: 27px; background-image: url(/img/navigation.gif); text-indent: -999em; background-repeat:no-repeat; }

#nav-list #nav-home a { width: 55px; background-position: 0 0; }
#nav-list #nav-home a:hover { background-position: 0 -27px; }
#nav-list #nav-home a:active,
#nav-list #nav-home a.current { background-position: 0 -54px; }

#nav-list #nav-cases a { width: 66px; background-position: -55px 0; }
#nav-list #nav-cases a:hover { background-position: -55px -27px; }
#nav-list #nav-cases a:active,
#nav-list #nav-cases a.current { background-position: -55px -54px; }

#nav-list #nav-people a { width: 72px; background-position: -121px 0; }
#nav-list #nav-people a:hover { background-position: -121px -27px; }
#nav-list #nav-people a:active,
#nav-list #nav-people a.current { background-position: -121px -54px; }

#nav-list #nav-agencies a { width: 88px; background-position: -193px 0; }
#nav-list #nav-agencies a:hover { background-position: -193px -27px; }
#nav-list #nav-agencies a:active,
#nav-list #nav-agencies a.current { background-position: -193px -54px; }

#nav-list #nav-iwall a { width: 45px; background-position: -281px 0; }
#nav-list #nav-iwall a:hover { background-position: -281px -27px; }
#nav-list #nav-iwall a:active,
#nav-list #nav-iwall a.current { background-position: -281px -54px; }


#nav-list #nav-quicklink a { width: 30px; background-position: -326px 0; }
#nav-list #nav-quicklink a:hover { background-position: -326px -27px; }
#nav-list #nav-quicklink a:active,
#nav-list #nav-quicklink a.current { background-position: -326px -54px; }


/* my bling */
#my-bling {}
#my-bling-avatar {
	height: 100px;
	width: 100px;
	padding: 20px 3px 16px 33px;
	background: url(/img/bg/my-bling-avatar.png) top left no-repeat;
	overflow: hidden;
}
#my-bling-info {
	padding: 20px 0 0;
}
#my-bling-logout {
	float: right;
	color: #111;
	margin-right: 1em;
}
#my-bling-dropdown-toggle {
	color: #111;
	font-size: 1.091em;
	display: block;
	height: 18px;
	line-height: 18px;
	margin-bottom: .5em;
	background: url(/img/icons/dropdown-arrow.png) right no-repeat;
}
#my-bling-dropdown {
	background: #fff;
	position: absolute;
	right: 40px;
	z-index: 200;
	border: 2px solid #333;
	width: 190px;
}
#my-bling-dropdown h3 {
	background: #555;
	color: #fff;
	padding: 5px 10px;
}
#my-bling-dropdown a {
	color: #333;
}
#my-bling-dropdown ul {
	list-style-type: none;
}

/* search */
#search {
	line-height: 24px;
	height: 24px;
	float: right;
	text-align: right;
}

/* dialog */
.dialog {
	position:relative;
	z-index: 1;
	margin:0 auto;
	min-width:8em;
	max-width:900px; /* based on image dimensions - not quite consistent with drip styles yet */
	margin-left:12px; /* default, width of left corner */
	margin-bottom: 1em; /* spacing under dialog */
	padding-top: 20px;
}
.dialog .content,
.dialog .t,
.dialog .b,
.dialog .b div {
	background: transparent url(/img/dialog.gif) no-repeat top right;
}
.dialog .content {
	position: relative;
	z-index: 15;
	padding: 0 12px 0 0;
}
.dialog .t {
	/* top+left vertical slice */
	position:absolute;
	z-index: 15;
	left:0;
	top:0;
	width:12px; /* top slice width */
	margin-left:-12px;
	height:100%;
	background-position:top left;
}
.dialog .b {
	/* bottom */
	position:relative;
	z-index: 15;
	width:100%;
}
.dialog .b,
.dialog .b div {
	height:12px; /* height of bottom cap/shade */
	font-size:1px;
}
.dialog .b {
	background-position:bottom right;
}
.dialog .b div {
	position:relative;
	z-index: 15;
	width:12px; /* bottom corner width */
	margin-left:-12px;
	background-position:bottom left;
}
.dialog .hd,
.dialog .bd,
.dialog .ft {
	position:relative;
	z-index: 15;
}
.dialog .wrapper {
	/* extra content protector - preventing vertical overflow (past background) */
	position:static;
	z-index: 20;
	max-height:1000px;
	overflow:auto; /* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without if you aren't worried about height/overflow issues. */
}
.dialog .hd {
	padding-bottom: 15px;
}
.dialog .hd .hd-ball {
	margin-top: -20px;
	float: left;
}
.dialog .hd .hd-nav {
	float: right;
	color: #fff;
	margin-top: 6px;
}
.dialog .hd .hd-nav a:hover {
}
.dialog .hd .hd-nav a {
	color: #fff;
	font-weight: normal;
}

/* lists */
dl.date-list { margin: 0; padding: 0;	width: 47em; }
dl.date-list dt { color: #737373; margin: 0; padding: 0.727em .5em; float: left; width: 8em; border-top: 1px solid #ddd; }
dl.date-list dd { margin: 0; padding: 0.727em .5em 0; float: left; width: 36em; border-top: 1px solid #ddd; }

dl.image-list { margin: 0; padding: 0; width: 26em; }
dl.image-list dt { margin: 0; padding: 0.727em .5em; float: left; width: 8em; border-top: 1px solid #ddd; }
dl.image-list dd { margin: 0; padding: 0.727em .5em 0; float: left; width: 15em; border-top: 1px solid #ddd; }

/* tables */
col.date 		{}
col.image 	{ width: 90px; }
col.generic {}

/* rating */
.rating {
	width: 80px;
	height: 16px;
	margin: 0 0 0.727em 0;
	list-style: none;
	position: relative;
	z-index: 25;
	background: url(/img/star-matrix.gif) no-repeat 0 0;
}
ul.rating li {
	cursor: pointer;
	float: left;
	text-indent: -999em;
}
ul.rating li a {
	position: absolute;
	left: 0;
	top: 0;
	width: 16px;
	height: 16px;
	text-decoration: none;
	z-index: 200;
}
ul.rating li.one a {left:0}
ul.rating li.two a {left:16px;}
ul.rating li.three a {left:32px;}
ul.rating li.four a {left:48px;}
ul.rating li.five a {left:64px;}
.nostar {background-position:0 0}
.onestar {background-position:0 -16px}
.twostar {background-position:0 -32px}
.threestar {background-position:0 -48px}
.fourstar {background-position:0 -64px}
.fivestar {background-position:0 -80px}

ul.rating li a:hover {
	z-index: 2;
	width: 80px;
	height: 16px;
	overflow: hidden;
	left: 0;
	background: url(/img/star-matrix.gif) no-repeat 0 0;
}
ul.rating li.one a:hover {
	background-position: 0 -96px;
}
ul.rating li.two a:hover {
	background-position: 0 -112px;
}
ul.rating li.three a:hover {
	background-position: 0 -128px;
}
ul.rating li.four a:hover {
	background-position: 0 -144px;
}
ul.rating li.five a:hover {
	background-position: 0 -160px;
}

#case-rating {
	float: right;
}
#case-rating a,
#case-rating p,
#case-rating ul {
	float: left;
	margin-right: 1em;
}

.comment-rating {
	list-style: none;
	float: right;
	height: 16px;
	line-height: 1.00;
	padding: 0;
	margin: 0;
}
.comment-rating img {
	vertical-align: middle;
}
.comment-rating li {
	display: inline;
	vertical-align: middle;
	padding-left: 3px;
}
.negative-comment {
	color: #666;
	background: #eee;
}
.positive-comment {
	color: #111;
}

.positive {
	color: green;
}
.negative {
	color: red;
}

/* agencies */
#agencies {}
#agencies #agencies-header {
	color: #fff;	
	margin: 0 10px;
	height: 20px;
	line-height: 20px;
	margin-bottom: 10px;
}
#agencies #agencies-header a {
	color: #fff;
}
#agencies .agency {
	height: 95px;
	padding-top: 25px;
	background: url(/img/bg/agency-logo.png) no-repeat;
}

#map-canvas {
	width: 840px;
	height: 400px;
}
#map {
	width: 600px;
	height:	400px;
	margin-left: 1em;
	margin-top: .5em;
}

/* tag cloud */
#tag-cloud { margin: 0; padding: 0; }
#tag-cloud li { display: inline; }
#tag-cloud span { position: absolute; left: -999em; z-index: 5; }
#tag-cloud .not-popular { font-size: 1em; }
#tag-cloud .not-very-popular { font-size: 1.09em; line-height: 1.833; }
#tag-cloud .somewhat-popular { font-size: 1.27em; line-height: 1.571; }
#tag-cloud .popular { font-size: 1.45em; line-height: 1.375; }
#tag-cloud .very-popular { font-size: 1.64em; line-height: 1.222; }
#tag-cloud .ultra-popular { font-size: 1.81em; line-height: 1.1; }

/* pagination */
#pagination { margin: 0; padding: 0;}
#pagination li { border: 0; margin: 0; padding: 0; list-style: none; float: left; }
#pagination a, #pagination span { display: block; float: left; padding: 3px 6px; border-right: solid 1px #DEDEDE; margin-right: 2px; }
#pagination .previous-off,
#pagination .next-off { color: #888; display: block; float: left; font-weight: bold; padding: 3px 4px; }	
#pagination .next a,
#pagination .previous a { border: none; font-weight: bold; }	
#pagination .current { font-weight: bold; display: block; float: left; padding: 4px 6px; border-right: solid 1px #DEDEDE; }

/* suggestionbox */
.suggestionsBox {
	position: absolute;
	display: none;
	background: #fff;
	margin-left: 130px;
	width: 200px;
	border: 1px solid #ccc;
	padding: 3px;
	margin-top: 2px;
	color: #666;
	z-index: 100;
}
.suggestionList {
	margin: 0;
	padding: 0;
	list-style: none;
}
.suggestionList li {
	cursor: pointer;
	padding: 3px 5px;
}
.suggestionList li:hover {
	background-color: #eee;
}

/* buttons */
a.button {
    background: transparent url("/img/button-a.png") no-repeat scroll top right;
    color: #fff;
    display: block;
    float: left;
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 1.091em;
		font-weight: bold;
    height: 24px;
    margin: 0 6px 0 0;
    padding: 0 18px 0 0; /* sliding doors padding */
    text-decoration: none;
}
a.button span {
    background: transparent url("/img/button-b.png") no-repeat;
    display: block;
    line-height: 14px;
    padding: 4px 0 6px 18px;
		white-space: nowrap;
}
a.button:active {
    background-position: bottom right;
    color: #eee;
    outline: none; /* hide dotted outline in Firefox */
}
a.button:active span {
    background-position: bottom left;
    padding: 5px 0 5px 18px; /* push text down 1px */
}

.online { background: url(/img/icons/online.png) 0 .3em no-repeat; padding-left: 15px; display: inline-block; }
.offline { background: url(/img/icons/offline.png) 0 .3em no-repeat; padding-left: 15px; display: inline-block; }

.date { white-space: nowrap; color: #888; }

/* horizontal dividers */
hr {background:#b2351c url(/img/bg/hr.gif);color:#b2351c;clear:both;float:none;width:100%;height:.27em;margin:0 0 1.45em;border:none;}
hr.space {background:#B6A388;color:#B6A388;}

.dialog hr { background:#828282;height: 0.091em; }
.dialog hr.space {background:#fff;color:#fff;}

/* misc classes */
.left {float:left;}
.right {float:right;}
.hide {display:none;}
.reset-margin {margin:0;} 
.reset-padding {padding:0;} 
.reset {margin:0;padding:0;} 
.align-justify {text-align:justify;} 
.align-left {text-align:left;} 
.align-center {text-align:center;} 
.align-right {text-align:right;} 
.box {padding:1.5em;margin-bottom:1.5em;background:#E5ECF9;}
.clearfix:after, .container:after, .content:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix, .container, .content {display:inline-block;}
* html .clearfix, * html .container, * html .content {height:1%;}
.clearfix, .container, .content {display:block;}
.clear {clear:both;}


div#chat {
	position:absolute;
	left:0;
	z-index:1000000;
	top:0;
}

div.chatwindow {
	z-index:1000000;
	float:left;
	border: 1px solid black;
	width:120px;
	height:auto;
	background:#FFFFFF;
}