/* 

Google Chrome inspired...

colors:
	#34649f - tab-on top border
	#3f79c2 - tab-off top border
	#60a1f0 - lightest blue in nav gradient
	#4a8fe3 - darkest blue in nav gradient
	#062d75 - link color in nav

	#d8e7fc - super light blue for table row highlight
	#ebf1f7 - very light blue for readonly backgrounds
	#cddeed - light blue just a bit too faint for input borders
	#b9d3e7 - light blue suitable for input borders
	#2b71ae - blue for header background, lightest blue of nav gradient
	#0066cc - bright blue for text, used in sidebar links
	#2a6ea8 - dull, darker blue used in footer text
*/

* {
	margin: 0;
	padding: 0;
}
body {
	margin: 0;
	padding: 0;
	background: #fff;
	color: #000;
	font: 62.5% "Lucida Grande", Verdana, Arial, sans-serif; /* Resets 1em to 10px */
}
img {
	border: none;
}
:focus {
	outline: 0;
}
#wrapper {
}
#header {
	color: #60a1f0;
	height: 30px;
	overflow: hidden;
}

								/* Content */

p {
	margin: 0 0 4px 2em;
}
a {
	color: #000;
}
span.fakelink {
	color: #000;
	cursor: pointer;
}
span.fakelink:hover {
	text-decoration: underline;
}
a:hover {
	color: #000;
}
a:visited {
	color: #000;
}
a.hidelink {
	border: none;
	text-decoration: none;
}
#content {
	float: left;
	min-width: 600px;
	max-width: 80%;
	min-height: 400px;
}
h3 {
	font: bold 1.3em Verdana, Arial, sans-serif;
	margin: 6px 0 6px 40px;
	padding: 0;
	color: #000;
}
h4 {
	font: bold 1.3em Verdana, Arial, sans-serif;
	margin: 0 0 4px 1em;
	padding: 8px 0 0 0;
}
#footer {
	text-align: center;
	color: #2a6ea8;
	margin: 0;
	padding: 20px;
	clear: both;
	border-top: 1px solid #a5c1dc;
}

								/* Misc */

#errorsearch {								
	margin: 10px;
	padding: 8px;
	border: 1px solid #a5c1dc;
}								

								/* Nav */
								
div#nav {
	height: 72px;
	position: relative;
	background: url(../images/bg-nav-gradients.png) top repeat-x;
}							
ul#pagenav {
	padding: 0 0 0 20px;
	list-style-type: none;
	float: left;
}
ul#subnav {
	padding: 0 0 0 26px;
	list-style-type: none;
	clear: both;
}
ul#pagenav li {
	margin: 14px 0 0 4px;
	float: left;
	height: 25px;
	background: url(../images/tabs.png) no-repeat;
	background-position: right -100px;
}
ul#pagenav li.active, ul#pagenav li.active:hover {
	background: url(../images/tabs.png) no-repeat;
	background-position: right -75px;
}
ul#pagenav li:hover {
	background: url(../images/tabs.png) no-repeat;
	background-position: right -125px;
}
ul#subnav li {
	margin: 6px 0 0;
	float: left;
	height: 22px;
}
ul#subnav li:hover {
	background: url(../images/buttons-22.png) no-repeat;
	background-position: right -22px;
}
ul#subnav li.firstitem {
}
ul#pagenav li a {
	display: block;
	margin: 0;
	padding: 6px 14px 5px 14px;
	color: #062d75;
	text-decoration: none;
	font: 12px "Lucida Grande", Verdana, Arial, sans-serif;
	background: url(../images/tabs.png) no-repeat;
	background-position: left -25px;
}
ul#pagenav li a.active, ul#pagenav li a.active:hover {
	color: #062d75;
	background: url(../images/tabs.png) no-repeat;
	background-position: left 0px;
}
ul#pagenav li a:hover {
	background: url(../images/tabs.png) no-repeat;
	background-position: left -50px;
}
ul#subnav li a {
	display: block;
	margin: 0;
	padding: 4px 10px;
	color: #062d75;
	text-decoration: none;
	font: 12px "Lucida Grande", Verdana, Arial, sans-serif;
}
ul#subnav li a:hover {
	background: url(../images/buttons-22.png) no-repeat;
	background-position: left 0px;
}
span.accesskey {
	text-decoration: underline;
}
/* Sublevel page nav */
/* End sublevel page nav */

h1 {
	width: 30%;
	float: left;
	padding: 2px 0 0 30px;
	font: bold 2.0em "Trebuchet MS", Tahoma, Arial, sans-serif;
	color: #2a6ea8;
}
h1 span {
	font-size: .7em;
}
h2.pagetitle {
	width: 30%;
	margin: 0 auto 0;
	padding: 4px 0 0;
	text-align: center;
	color: #2a6ea8;
	font: bold 1.6em "Trebuchet MS", Tahoma, Arial, sans-serif;
}
h2.logintitle {
	width: 30%;
	float: right;
	padding: 4px 30px 0 0;
	text-align: right;
	color: #2a6ea8;
	font: bold 1.6em "Trebuchet MS", Tahoma, Arial, sans-serif;
}
h2.logintitle a {
	color: #2a6ea8;
	font: normal 0.8em "Trebuchet MS", Tahoma, Arial, sans-serif;
	text-decoration: none
}
h2.logintitle a:hover {
	text-decoration: underline;
}
h2.updated {
	margin: 10px 10px 0;
	padding: 4px;
	text-align: center;
	font: bold 1.3em Verdana, Arial, sans-serif;
	border: 1px solid #119911;
	color: #060;
	background: #e6f8dd;
}
h2.updated a, h2.updated a:visited {
	text-decoration: none;
	color: #060;
	display: block;
}
h2.warning {
	margin: 10px 10px 0;
	padding: 4px;
	text-align: center;
	font: bold 1.3em Verdana, Arial, sans-serif;
	border: 1px solid #ff6400;
	color: #000;
	background: #ffa749;;
}
h2.attention {
	margin: 10px 10px 0;
	padding: 4px;
	text-align: center;
	font: bold 1.3em Verdana, Arial, sans-serif;
	border: 1px solid #0144cf;
	color: #0144cf;
	background: #c3daf9;
}
h2.error {
	margin: 10px 10px 0;
	padding-left: 4px;
	font: bold 1.3em Verdana, Arial, sans-serif;
	border: 1px solid #9E3131;
	color: #eee;
	background: #C34242 url(../images/gradient_message.gif) top right no-repeat;
}
h2.error span {
	display: block;
	padding: 24px 0 0 76px;
	background: url(../images/exclamation.gif) no-repeat;
	min-height: 44px;
}
h2.attention a, h2.attention a:visited {
	text-decoration: none;
	color: #0144cf;
	display: block;
}
h2.gentlewarning {
	margin: 10px;
	padding: 4px;
	text-align: center;
	font: bold 1.3em Verdana, Arial, sans-serif;
	border: 1px solid #e6db55;
	color: #2c2b29;
	background: #fffbcc;
}
h2.gentlewarning a, h2.gentlewarning a:visited {
	text-decoration: none;
	color: #2c2b29;
	display: block;
}
#content h2 {
	margin: 10px 0 0 10px;
}

								/* Sidebar */

#sidebar {
	float: left;
	width: 20px;
	padding: 10px 0 0;
}
#issaved {
	width: 222px;
	color: #FF5E00;
	font: 1.1em/21px Verdana, Arial, sans-serif;
}
.sidebox {
	width: 200px;
	margin: 20px 10px 10px;
	border: 1px solid #a5c1dc;
	min-height: 40px;
}
.sidebox h3 {
	color: #222222;
	margin: 0;
	padding: 0 0 0 6px;
	font: bold 1.0em/21px Verdana, Arial, sans-serif;
	background: url(../images/bg_box_head_gradient.gif) repeat-x;
}
.sidebox ul {
	list-style: none;
	color: #777;
	padding: 10px 0 6px 10px;
	margin: 0 4px 0 4px;
	border-bottom: 1px solid #fff;
}
.sidebox ul li {
	padding: 0 0 8px 0;
	color: #0066cc;
	font: 1.1em "Lucida Grande", Verdana, Arial, sans-serif;
}
.sidebox ul li a {
	color: #0066cc;
	text-decoration: none;
}
.sidebox ul li a:hover {
	text-decoration: underline;
}

								/* Add/Edit Tickets and Mail Tables */

form#ticketform, form#mail {
	padding: 6px 0 20px;
}
table.tickettable td {
	padding: 6px 4px;
	vertical-align: top;
/*
	border: 1px solid #b0cfe6;
*/
}
table.mailtable td {
	padding: 2px 4px;
}
table.tickettable td.alignright, table.mailtable td.alignright  {
	text-align: right;
	padding: 0 0 0 4px;
}
label {
	display: block;
	padding: 0 0 4px 0;
	color: #000;
	font: bold 1.2em Arial, Helvetica, sans-serif;
}
span.inputbox {
	/* a fake input field */
	display: block;
	width: 156px;
	height: 18px;
	border: 1px solid #a7a6aa;
	font: 1.3em Verdana, Arial, Helvetica, sans-serif;
	padding: 0 2px;
}
.w60 {
	width: 60px;
	height: 22px;
}
.readonly {
	/* class="readonly" looks like crap - it has the effect of shortening the form element */
	border: 1px solid #b9d3e7;
	background: #ebf1f7;
	padding: 2px 4px;
}
input.fourcolspan {
	width: 628px;
}
textarea {
	font: 1.3em Verdana, Arial, Helvetica, sans-serif;
	padding: 1px 3px;
}
select {
	width: 120px;
	height: 22px;
}
input, option {
	padding: 1px 3px;
}
input.singlecheckbox {
	margin: 4px 0 0 0;
}
#duedate {
	color: #f00;
}
#submit {
	margin: 8px 0 0;
	padding: 4px 12px;
}
.commentbox {
	width: 700px;
	margin: 0 0 0 8px;
	padding: 10px 0;
	border-top: 1px solid #b9d3e7;
}
.commentmeta {
	width: 160px;
	float: left;
}
#content .commentbox p {
	padding: 0;
	margin: 0;
}
#content p.commentnum {
	float: left;
	color: #90bada;
	font:  2.0em "Trebuchet MS", Tahoma, Arial, sans-serif;
}
#content p.commenter {
	text-align: right;
	font-size: 1.2em;
	line-height: 1.5;
	padding: 0 0 2px 0;
}
#content p.commentdatetime {
	text-align: right;
	font-size: 1.2em;
	padding: 0 0 4px 0;
}
#content p.commenttext {
	width: 500px;
	float: right;
	font-size: 1.2em;
	line-height: 1.5;
}
.textbox {
	width: 680px;
	min-height: 16px;
	margin: 0 0 20px 0;
	padding: 6px 10px;
	font: 1.3em Verdana, Arial, Helvetica, sans-serif;
	/* white space wrapping from http://cheeaun.phoenity.com/weblog/2005/06/whitespace-and-generated-content.html */
	white-space: pre; /* CSS2 */
	white-space: -moz-pre-wrap; /* Mozilla */
	white-space: -hp-pre-wrap; /* HP printers */
	white-space: -o-pre-wrap; /* Opera 7 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}
.pre {
	white-space: pre; /* CSS2 */
	white-space: -moz-pre-wrap; /* Mozilla */
	white-space: -hp-pre-wrap; /* HP printers */
	white-space: -o-pre-wrap; /* Opera 7 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}
a.prettylink {
	color: #2a6ea8;
	text-decoration: none;
}
a.prettylink:hover {
	text-decoration: underline;
}

								/* Lists Tables */
								
.ticketslist {
	font-size: 1.1em;
	margin: 30px 10px 30px 6px;
	padding: 0 0 25px 0;
	/* empty-cells: show; shows borders on empty cells in some browsers (not IE6) */
	empty-cells: show;
	border: 1px solid #e2e8f2;
}
.ticketslist th {
	padding: 1px 22px 0 6px;
	height: 22px;
	cursor: pointer;
	color: #444444;
	font: bold 1.0em/21px Verdana, Arial, sans-serif;
	background: #e2e8f2 url(../images/bg_th_gradient.gif) left bottom repeat-x;
	text-align: left;
}
.ticketslist th + th {
	border-left: 1px solid #e2e8f2;
}
.ticketslist th.sorttable_sorted {
	background: #e2e8f2 url(../images/sort_asc_16.png) right 50% no-repeat;
}
.ticketslist th.sorttable_sorted_reverse {
	background: #e2e8f2 url(../images/sort_desc_16.png) right 50% no-repeat;
}
.ticketslist tr {
}
.ticketslist tr:hover {
	background: #eef2f8;
}
.ticketslist td {
	border-bottom: 1px solid #eee;
	vertical-align: text-top;
	padding: 0 4px 0 0;
}
.ticketslist td a, .ticketslist td a:visited {
	padding: 6px 4px;
	display: block;
	text-decoration: none;
	color: #000;
}
.hidden {
	display: none;
}

								/* Reports */

#reportholder {
	padding: 20px;
}
.reportitem p {
	font: normal 1.2em Verdana, Arial, sans-serif;
	padding: 0 20px 4px 0;
}

								/* scriptaculous auto complete */
								
div.autocomplete {
	position: absolute;
	margin: 0px;
	padding: 0px;
}
div.autocomplete ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
div.autocomplete ul li.selected { 
	background-color: #b9d3e7;
}
div.autocomplete ul li {
	list-style-type: none;
	display: block;
	margin: 0;
	padding: 4px;
	cursor: pointer;
	border-color: #cddeed;
	border-style: solid;
	border-width: 0pt 1px 1px;
	background: #fff;
}

								/* calendar */
								
.calendar_day {
	margin: 0;
	padding: 20px;
}
.calendar_day p {
	margin: 0;
	padding: 0;
	font: 10px Arial, Helvetica, sans-serif;
}
.calendar_day h3 {
}
.calendar_day div.dayholder {
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
	/* Add a background that has a red horizontal line, and adjust the top margin to move the line as the day goes along. */
	background: url(../images/bg_calendar.png) repeat-x; 
}
.calendar_day div.timelabels {
	width: 60px;
	float: left;
	border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
}
.calendar_day p.timelabel {
	text-align: right;
	border-bottom: 1px solid #ccc;
	padding: 2px 6px;
}
.calendar_day div.eventholder {
	min-height: 432px;
	max-width: 11%;
	float: left;
}
.calendar_day p.event {
	margin: 0 0 0 1px;
	padding: 2px 6px;
}
.calendar_day p.event a {
	color: #000;
	display: block;
	text-decoration: none;
}
.calendar_day p.event span {
	display: block;
}
.calendar_day p.thing1, .calendar_day p.thing5 {
	background: #9CEE98;
	border: 1px solid #32ce26;
}
.calendar_day p.thing2, .calendar_day p.thing6 {
	background: #98A4EE;
	border: 1px solid #445ee0;
}
.calendar_day p.thing3, .calendar_day p.thing7 {
	background: #EEEB98;
	border: 1px solid #dbcf15;
}
.calendar_day p.thing4, .calendar_day p.thing8 {
	background: #EC7670;
	border: 1px solid #d02420;
}



/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.clearfix:after, #container:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix, #container {display: inline-block;}
* html .clearfix,
* html .container {height: 1%;}
.clearfix, #container {display: block;}

/* Regular clearing
   apply to column that should drop below previous ones. */

.clear { clear:both; }