/*

Base CSS for everything.

Originally was a common file between the app and the community, but now they've gone their separate ways.

Spiceworks Orange:#fe5200
Spiceworks Light Orange:#fff6f2

*/
* {
	margin:0pt;
	padding:0pt;
	}

body{
  font:62.5% Arial, Sans-Serif;
  color:#333;
  padding:0;
  margin:0;
  border-top:5px solid #3e3e3e;
  background:#fff;
}
body.login, body.wizard{ background:#fff none; border-top:0; }
body.server_error{ font-size:90%; }



/* Basic, generic styles
*****************************************************************/
a{
  color:#000;
  font-weight:normal;
  text-decoration:underline;
}
p.meta a{ text-decoration:underline; }
a:hover{ text-decoration:underline; }
a.help{ text-decoration:underline; }
a.help:hover{ color:#fe5200; }
a.stealth:hover{ text-decoration:underline; }
a.help_icon{
  background:transparent url(/apps/img/icons/small/help.png) no-repeat center right;
  padding:3px 20px 3px 0!important;
}
div.quick_form p.btn a.help_icon{
  background-position:center left;
  padding:3px 0 3px 20px!important;
}
a.stealth{
  text-decoration:none;
  color:#666;
  font-weight:normal;
  font-style:italic;
}
h1, h2, h3, h4, h5{ font-weight:normal; }

h4{
  font-size:14px;
  font-weight:bold;
}
h3{
  font-size:15px;
  font-weight:bold;
}
fieldset{ border:1px solid #ccc; }
fieldset legend{
  color:#444;
  font-weight:bold;
}
.highlight{ background-color:#ffc; }
.warning{ color:#EAB600; }
.error, .err{
  color:#933;
  font-weight:bold
}
.fleft{ float:left; }
.fright{ float:right; }
.contained-float{ overflow:hidden; /* containing floats without markup */ }
.clearfix-left{ clear:left; }
.clearfix-right{ clear:right; }
.clearfix-both{ clear:both; }
.baby-text{ font-size:11px; }
input.text, textarea, select, input.editor_field, input.file{
  padding:2px 0px 2px 4px;
  font-family:Arial, sans-serif;
  color:#444;
  line-height:1.3em;
  border-top:1px solid #7c7c7c;
  border-left:1px solid #c3c3c3;
  border-right:1px solid #c3c3c3;
  border-bottom:1px solid #ddd;
  background:#fff url(/apps/img/forms/fieldbg.gif) repeat-x top;
}
select{
  padding:2px;
}


input.init, textarea.init, select.init{ color:#999; }
input.error, textarea.error, select.error, .fieldWithErrors input, .fieldWithErrors textarea, .fieldWithErrors select{
  border:1px solid #f00;
  color:#444;
  font-weight:normal;
}
input.readonly, input.disabled, select.readonly, select.disabled, textarea.readonly, textarea.disabled{
  background:#ebebeb;
  color:#666;
}
input.image_button_disabled{ background:transparent; }
p.btn input.image_button{ vertical-align:baseline; /* see hacks.ie6.css */ }
a.image_button img{ border:0; }
.stripe0{ background-color:#fff; }
.stripe1{ background-color:#ddd; }
.center{ text-align:center; }
.right{ text-align:right; }
li{ list-style:none; }
body.server_error li{ list-style:decimal; }

/* cake view layouts
*****************************************************************************/

.index table tr.altrow {
	background:transparent none repeat scroll 0%;
}

.index h2{
	clear:both;
	background:#C0C6D0 url(/apps/img/layout/gradients/graylightblue_to_grayblue.png) repeat-x scroll left top;
	border:1px solid #AAAAAA;
	color:#444444;
	font-size:1.2em;
	font-weight:bold;
	margin:0pt;
	overflow:hidden;
	padding:2px 2px 4px;
	position:relative;
	width:100%;
	}

.index p{
	margin: 0pt 0pt 5px 2px;
	text-align: center;
}	

.index table tr {
	background:#EEEEEE none repeat scroll 0%;
}

.index table tr td, .index table tr th {
	padding:3px !important;
}

.index table tr td {
	vertical-align:top;
}

.index th{
	background:#E2E7EC none repeat scroll 0%;
	border:1px solid #CCCCCC;
	}

.index table tbody tr td {
	border:1px solid #EEEEEE;
}


/* Layout styles
*****************************************************************************/
#container, #footer{
  width:100%; /* see hacks.ie.css! */
  min-width:875px;
  font-size:1em;
  margin:0 auto;
}
#container{
  background:#fff;
  position:relative;
}
body.server_error #container{
  padding:0 10px 10px;
  border-right:1px solid #ccc;
  border-bottom:1px solid #ccc;
  border-left:1px solid #ccc;
}
#header{
  /* see hacks.ie.css */
}
#content_wrapper{
  border:1px outset #777792; /* see hacks.ie.css! IE doesn't roll with outset borders */
  clear:both;
  font-size:1.2em;
  position:relative;
  float:left;
  min-height:600px;
  background:#fff url(/apps/img/layout/single-column.png) repeat-y top left;
  background-position:-10px top;
}
#content_inner{
  border:1px inset #777792; /* see hacks.ie.css! IE doesn't roll with inset borders */
  float:left;
}
#navigation{
  width:149px;
  float:left;
  padding:5px 0 150px;
}
#content{
  width:700px;
  float:left;
  padding:15px 10px 10px;
}
#sidebar{
  width:300px;
  float:right;
  margin:15px 8px 5px 0;
  background:#fff;
  /* see hacks.ie6.css */
}
#sidebar #adbox{
  overflow:hidden!important;
  margin:0;
  padding:0;
  width:300px;
}
#sidebar #adbox iframe{
  height:698px;
  width:300px;
  overflow-y:hidden;
  z-index:100;
  margin:0;
  padding:0;
}
#sidebar #adbox a.myway img{ border:0; }
#footer{
  clear:both;
  background:transparent;
}
body.branded #footer, body.help_desk #footer{ background:transparent url(/apps/img/logos/powered_by.png) no-repeat top right; }
body.branded #footer img.footer_logo{
  float:left;
  margin:3px 3px 0 0;
}


/* Created a controller for helpdesk settings that adds class 'help_desk' to body... so undo what's done above here.*/
body.help_desk.settings #footer{
  background:none;
}
body.help_desk.settings #footer p{
  width:auto;
}

/* Header children styles
*****************************************************************************/
#header .nav_wrapper{
  background:transparent url(/apps/img/layout/header_nav_right_dark.png) no-repeat bottom right;
  float:right;
  padding:0 30px 0 0;
}
#header ul{
  padding:0 10px 0 70px;
  float:right;
  margin:0;
  list-style-type:none;
  background:#3e3e3e url(/apps/img/layout/header_nav_left_dark.png) no-repeat bottom left;
  text-align:right;
}
#header ul li{ display:inline; }
#header ul li a{
  display:block;
  float:left;
  padding:0 7px;
  margin:0 0 2px 0;
  border-right:1px solid #fff;
  color:#fff;
  font-size:1.2em;
  text-decoration:none;
}
#header ul li.last a{
  padding-right:0;
  border-right:0;
}
#header ul li.unread_messages a span{
  background:transparent url(/apps/img/icons/envelope.png) left center no-repeat;
  padding-left:19px;
}
#header ul li.help a.selected, #header ul li.help a:hover.selected{
  background-position:center left;
  cursor:auto;
}
#header div.inner{
  padding:0 10px 0 0;
  clear:right;
}
#header h1{
  margin:0;
  padding:0;
  width:150px;
  float:left;
}
body.branded #header h1{
  width:240px;
  overflow:hidden;
}
#header h1 a{
  border:0;
  display:block;
  float:left;
  text-decoration:none;
}
#header h1 a img{ border:0; }
a#current_spicemeter{
  display:block;
  width:147px;
  height:32px;
  float:right;
  clear:right;
  margin:10px 60px 5px;
  background:transparent url(/apps/img/spicemeter/scores/0.png) no-repeat top left;
  z-index:100;
}
a#current_spicemeter span{ display:none; }

/* Basic toolbar setup, the rest is in application.css
*****************************************************************************/
#toolbar{
  background:#e0e0e0 url('../img/layout/gradients/toolbar_background.png') repeat-x;
  border-bottom:1px solid #5b5b5b;
  padding:4px 0px;
  margin:0;
  font-size:.95em;
  float:left;
  /* see hacks.ie6.css */
}
#toolbar div.first{
  float:left;
  width:148px;
}
#toolbar div.second{
  float:left;
  width:701px;
  padding:0 10px;
}
#toolbar div.third{
  float:left;
/*  width:318px;*/
}
#toolbar div.first{ border-right:1px solid #999; }

#toolbar #search_box{ display:inline; }
#toolbar #search_box p{ margin:-6px 0 0 5px; }
#toolbar #search_box p input.text{ 
  width:110px;  
  padding: 2px 0px 1px 2px!important;
  /* see ie hacks */
}
#toolbar #search_box p input.image_button{
  position:relative;
  top:6px;
}

#toolbar div.third img.indicator{
  position:absolute;
  margin:0 0 0 290px;
}

#toolbar input.text{
  border-top:1px solid #737373;
  border-left:1px solid #999999;
  border-right:1px solid #999999;
  border-bottom:1px solid #999999;
}

/* Navigation styles
*****************************************************************************/
#navigation p{ padding:0 5px; }
#navigation dl, #navigation dl dt, #navigation dl dd{
  margin:0;
  padding:0;
  position:relative;
}
#navigation dl{
  margin:0 1px 10px 0;
}
#navigation dl dt{
  font-weight:bold;
}
#navigation dl dt a,
#navigation dl dd a{
  display:block;
  color:#000;
  text-decoration:none;
  outline:none;
  overflow:hidden;
  padding:3px 20px 3px 24px;
}
#navigation dl dt a{
  font-weight:bold;
  padding-left:0;
}
#navigation dl dt span{
  display:block;
  background:transparent 4px center no-repeat;
  padding:3px 0 3px 24px;
}

#navigation dl dd a span.new{
  background:transparent;
  position:absolute;
  color:red;
  font-size:10px;
  margin:-3px 0 0;
  right:4px;
}
#navigation dl dd a:hover span.new{ text-decoration:none!important; }

#navigation dl.dashboard span{ background-image:url(/apps/img/icons/navigation/swoosh.png) }
#navigation dl.my_network span{ background-image:url(/apps/img/icons/navigation/network.png) }
#navigation dl.community span{ background-image:url(/apps/img/icons/navigation/community.png) }
#navigation dl.help span{ background-image:url(/apps/img/icons/navigation/help.png) }
#navigation dl.my_stuff span{ background-image:url(/apps/img/icons/navigation/applications.png) }


#navigation dl.dashboard dt.current span{ background-image:url(/apps/img/icons/navigation/swoosh_dark.png) }
#navigation dl.my_network dt.current span{ background-image:url(/apps/img/icons/navigation/network.png) }
#navigation dl.community dt.current span{ background-image:url(/apps/img/icons/navigation/community_dark.png) }
#navigation dl.help dt.current span{ background-image:url(/apps/img/icons/navigation/help_dark.png) }


#navigation dl.toggleable dt{
  padding-left:20px;
  padding-right:20px;
  background:transparent url(/apps/img/icons/indicators/toggle2_blue.png) no-repeat center left;
  background-position:5px center;
  cursor:pointer;
}
#navigation dl dd{
  display:block;
  padding:1px 0;
}
#navigation dl dd a.meta{
  display:inline;
  padding:0;
}
#navigation dl dd a:hover, #navigation dl dt a:hover{ text-decoration:underline; }
#navigation dl dd.current, #navigation dl dt.current{
  background:#7692a3 url(/apps/img/layout/gradients/nav_current.png) repeat-x top left;
  border:1px solid #ccc;
  border-left:0;
  border-right:0;
  padding:0;
}
#navigation dl dt.current{ padding:0 0; }
#navigation dl dd.current a, #navigation dl dt.current a{ color:#fff; } 
#navigation dl dd.current a, #navigation dl dd.current a:hover, #navigation dl dt.current a{ 
 
}
#navigation dl dd#nav_it_services.current a span{ display:none; }
#navigation dl.closed dt{ background-image:url(/apps/img/icons/indicators/toggle1_blue.png); }
#navigation dl.closed dd{ display:none; }

#navigation_closeout, p#navigation_controls{ width:148px; }
p#navigation_controls{
  margin:0;
  padding:0;
  float:left;
  border:1px solid #d4d4d4;
  border-left:0; border-right:0;
  background:#fdfdfd url(/apps/img/layout/gradients/footer_toolbar.png) repeat-x center left;
}
p#navigation_controls a{
  float:left;
}
p#navigation_controls a{
  border-right:1px solid #d4d4d4;
  width:20px;
  height:20px;
  background-repeat:no-repeat;
  background-position:center center;
}
p#navigation_controls a.add_new_navigation{ background-image:url(/apps/img/icons/plus.png); }
p#navigation_controls a.delete{ background-image:url(/apps/img/icons/minus.png); }
p#navigation_controls a.edit{ background-image:url(/apps/img/icons/small/nav_edit.png); }
p#navigation_controls a span{ display:none; }

#navigation_closeout{
  position:absolute;
  bottom:0;
}
#navigation_closeout p{
  padding:0;
  margin:0;
  color:#444;
  font-size:10px;
}
#navigation_closeout #sponsored_block div.wrapper{
  padding:8px 5px 0;
  background:transparent;
  text-align:center;
}
#navigation_closeout #sponsored_block div.wrapper h4{
  font-weight:normal;
  font-size:1em;
  color:#444;
  padding:0;
  margin:0;
}
#navigation_closeout #sponsored_block div.wrapper p{ padding:10px 0; }
#navigation_closeout #sponsored_block a img{ border:0; }

/* my stuff section of navigation
*********************************************************************************************************/
#navigation dl.my_stuff{ margin-bottom:0; }
#navigation dl.customize dt{ display:none; }
#navigation dl.my_stuff dd{ position:relative; }
#navigation dl.my_stuff dd a.meta{
  position:absolute;
  margin:1px 0 0 0;
  right:5px;
  background:transparent none no-repeat center left;
  width:16px;
  height:16px;
  text-indent:-9999px;
  outline:none;
  display:none;
}
#navigation dl.my_stuff dd a.delete{ background-image:url(/apps/img/icons/small/trash.png); }
#navigation dl.my_stuff dd a.edit{ background-image:url(/apps/img/icons/small/round_nav_edit.png); }
#navigation dl.deleteable dd.custom a.delete{ display:block; }
#navigation dl.editable dd.custom a.edit{ display:block; }
#navigation dl.editable dd.editing a.edit{ display:none; }
#navigation dl.deleteable dd.current a.portal_link{ background-image:none; }
#navigation dl.customize dd.add a span{
  font-size:10px;
  text-decoration:underline;
}
#navigation dl.my_stuff dd.custom form, #navigation dl.customize dd.add_new{ padding:5px 0 0 23px; }
#navigation dl.my_stuff dd.custom form p, #navigation dl.customize dd.add_new form p{
  margin:0;
  padding:0 0 5px;
  font-size:10px;
}
#navigation dl.customize dd.add_new form p label, #navigation dl dd.editing form p label{
  width:3em;
}
#navigation dl dd.editing form p input.text, #navigation dl dd.add_new form p input.text{ width:70px; }
#navigation dl dd.editing form p.check, #navigation dl.customize dd.add_new form p.check{
  margin-top:8px;
}
#navigation dl.customize dd.editing form p.check label, #navigation dl.customize dd.add_new form p.check label{
  position:relative;
  top:-3px;
}
#navigation dl.customize dd.editing form p.btn, #navigation dl.customize dd.add_new form p.btn{ padding-bottom:0; }
#navigation dl.customize dd.editing form p.btn span, #navigation dl.customize dd.add_new form p.btn span{ display:block; }

/* Footer children styles
*****************************************************************************/
#footer p{
  margin:0;
  padding:5px 0 0;
}
body.help_desk #footer p, body.branded #footer p{ width:700px; }
#footer p a, p.copy a{
  text-decoration:none;
  color:inherit;
}

/* Styles for forms
**********************************************************************************/
form{
  margin:0;
  padding:0;
}
form.simple p{ clear:left; }
form.simple div.inset{ padding:0px 0 0px 20px; }
form.standard p{ width:430px; }
form.standard p input.text{ width:190px; }
form.standard p select{ width:196px; }
form.standard p.with_error, form.standard p.btn, form.standard p.non, form.standard p.wide{ width:auto; }
form.with_examples p{ width:auto!important; }
form.standard p.with_error input, form.simple p.with_error input, form.simple p.with_error select, form.simple p.with_error textarea, span.with_error{ border:1px solid #f00; }
form.simple p label, form.simple p.no_label strong, div.pseudo_form p label{
  display:block;
  float:left;
  width:6em;
  text-align:left;
  padding:3px 3px 0 0;
  font-weight:bold;
}
form.simple p.no_label strong{
  position:relative;
  top:-5px;
}
form.simple p.check, form.simple p.help{
  margin:0;
  padding-left:6em;

  /* there is some margin on the paragraph above this element, we need to push it up a little closer */
  position:relative;
  top:-10px;
}
form.simple p.natural{
  padding-left:0;
  position:static;
  top:0;
}
form p span.meta, div.pseudo_form p span.meta{
  display:block;
  clear:left;
  padding:3px 0 0;
}
form.simple p.check label, form.simple p label.secondary, div.pseudo_form p label.secondary{
  display:inline;
  float:none;
  padding:0;
}
form.simple p label.secondary, div.pseudo_form p label.secondary{ font-weight:normal; }
form.standard p label, div.pseudo_form p label, form.standard p.no_label strong{ width:200px; }
div.pseudo_form p.no_input span.alt{
  position:relative;
  top:5px;
}
form.standard p.with_checkbox label, div.pseudo_form p.with_checkbox label{
  padding-right:0px;
  margin-right:-1px;
}
form.standard p.with_checkbox input, div.pseudo_form p.with_checkbox input{
  position:relative;
  top:1px;
  /* see hacks.ie.css */
}
form.small p label, form.small p.no_label strong{ width:4em; }
form.small p.check, form.small p.help{ padding-left:4em; }
form.medium p label, form.medium p.no_label strong{ width:8em; }
form.medium p.check, form.medium p.help{ padding-left:8em; }
form.large p label, form.large p.no_label label, form.large p.with_checkbox label{ width:12em; }
form.large p.check, form.large p.help{ padding-left:12em; }
form.xlarge p label, form.xlarge p.no_label label{ width:15em; }
form.xlarge p.check, form.large p.help{ padding-left:15em; }
form.simple p label.secondary{
  display:inline;
  float:none;
  width:auto;
  padding:0;
  font-weight:normal;
}
form.standard p, div.pseudo_form p{
  padding:2px 0;
  margin:0;
  color:#000;
}
form.standard p.non{ border:0; }
form.simple p textarea{
  width:30em;
  height:10em;
}
form.standard p.help{
  clear:left;
  padding:10px 0;
  position:static;
  top:0;
  width:auto;
}
form.simple p.btn{
  margin:0;
  padding:0;
}
form.small p.btn{ margin:0 0 0 4em; }
form.standard p.btn{
  border:0;
  padding:5px 0;
}
form.standard p.btn em.highlight, p.table_actions em.highlight{
  position:relative;
  top:-4px;
}
form.inline p label{
  display:inline;
  float:none;
}
form.inline p input{ display:inline; }
span.example{
  color:#666;
  font-style:italic;
  font-size:.95em;
}

/* Lightbox-type styles
*****************************************************************/
#app_overlay, .darkbox, .lightbox{
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  z-index:500;
  /* see hacks.ie6.css and hacks.ie.css */
}
.darkbox{
  background:#000;
  -moz-opacity:0.4;
  opacity:.40;
  filter:alpha(opacity=40);
}
.lightbox div.content{
  width:450px;
  background:#fff;
  border:1px solid #fe5200;
  margin-top:100px;
  margin-bottom:auto;
  margin-left:auto;
  margin-right:auto;
  padding:10px;
  font-size:1.3em;
  text-align:center;
}
#lightbox_delete_attributes div{ margin-top:250px; }
.lightbox div a.close{
  display:block;
  float:right;
  text-indent:-9999px;
  background:transparent url(/apps/img/icons/round_close.png) no-repeat top left;
  width:16px;
  height:16px;
  outline:none;
}
.lightbox div h1{ font-size:1.3em; }
.lightbox div h2{ font-weight:bold; }

/* this little div is a nice way to make the app unclickable by putting it on top of everything else, but making it transparent...oooh so sneaky */
#app_overlay{
  /* show the hourglass icon, or whatever wait means in your OS */
  cursor:wait;
  
  /* we could make it slightly grayed out, by doing this... */
  /*
  background:#000;
  -moz-opacity:1.0;
  opacity:.1;
  filter:alpha(opacity=1);
  */
}
#app_overlay p{
  text-align:right;
  padding:0;
  margin:5px 5px 0 0;
}
#app_overlay p, #app_overlay p a{ color:#666; }
#app_overlay p a{
  background:transparent url(/apps/img/icons/square_close.png) no-repeat center right;
  padding:0 12px 0 0;
  font-weight:normal;
  text-decoration:none;
}

/* collapsable tables (the thead is always visible)
*******************************************************************************************/
div.collapsable{
  border:1px solid #ccc;
  background:#eee;
  margin:10px 0;
}
div.collapsable span.toggler{
  padding:0 15px 0 0;
  background:transparent url(/apps/img/icons/indicators/toggle2_blue.png) no-repeat 10% center;
  cursor:pointer;
}
div.collapsable table thead th{ font-weight:normal; }
div.collapsable table thead th.first_column{ text-align:left!important; }
div.collapsable table thead th.last_column{ text-align:right!important; }
div.collapsable-collapsed span.toggler{ background-image:url(/apps/img/icons/indicators/toggle1_blue.png); }
div.collapsable div.collapsing{
  border-top:1px solid #ccc;
  background:#fff;
  padding:8px;
}
div.collapsable-collapsed{}
div.collapsable-collapsed div.collapsing{
  border-top:0;
  display:none;
}

/* master table styles, the one table to rule them all
*********************************************************************************************************/
table.habanero tr.highlight{ background:#ffffcc!important; }
table.habanero tr{ background:#eee; }
table.habanero tr td{ padding:3px!important; }
table.habanero tr.stripe1{ background:#efefef; }
table.habanero thead tr{ font-weight:bold; }
table.habanero thead tr td{
  background:#e2e7ec;
  border:1px solid #ccc;
}
table.habanero thead.sortable tr td{ padding-right:12px!important; }
table.habanero thead.sortable tr td.no_label{
  /* cells in the header with no label don't need the right padding since the sort indicator will be centered */
  padding-right:0;
}
table.habanero thead.sortable tr td:hover, table.habanero thead.sortable tr td.hover{
  border:1px solid #bbb;
  cursor:pointer;
  color:#444;
  background-color:#cad8e5;
}
table.habanero thead.sortable tr td.sorted{
  /* styles for the column that the data is sorted on */
  background-repeat:no-repeat;
  background-position:99% center;
  background-color:#cad8e5;
}
table.habanero thead.sortable tr td.sorted.no_label{ background-position:center center; }
table.habanero thead.sortable tr td.asc{ background-image:url(/apps/img/icons/indicators/up_arrow.gif); }
table.habanero thead.sortable tr td.desc{ background-image:url(/apps/img/icons/indicators/down_arrow.gif); }
table.habanero tbody tr{ background:transparent; }
table.habanero tbody.clickable tr:hover, table.habanero tbody.clickable tr.hover, table.habanero tbody.clickable tr.clicked{
  background:#ddd;
  cursor:pointer;
}
table.habanero tbody.clickable tr:active, table.habanero tbody.clickable tr.active{
  background:#ccc;
  cursor:pointer;
}
table.habanero tbody tr td{ border:1px solid #eee; }
table.habanero tr td.action{ text-align:center; }
table.habanero tfoot tr{ background:transparent;   }
table.habanero tfoot tr td{ border:none; }
table.habanero tfoot tr td.instruction{ text-align:right; }
table.habanero tr td.value{ text-align:center; }
table.habanero tr td.name{ width:200px; }

/* alerts and errors tables
*****************************************************************************/
table.habanero tbody tr td.error{ border:1px solid #e9d4d4; }
table.habanero tbody tr.stripe0 td.error{ background:#f4eaea; }
table.habanero tbody tr.stripe1 td.error{ background:#e9d4d4; }

/* styles for the data rich table, selectable rows, editable cells, add new rows, etc... (used on monitors and network settings)
*****************************************************************************/
table.jalapeno{ width:100%; }
table.jalapeno td{
  padding:3px!important;
  text-align:center;
}
table.jalapeno th{
  padding:3px!important;
  text-align:center;
  font-weight:normal;
}
table.jalapeno thead tr td, table.jalapeno thead tr th{
  background:#e2e7ec;
  font-weight:bold;
  border:1px solid #ccc;
  color:#444;
}
table.jalapeno thead tr td.empty, table.jalapeno thead tr th.empty{
  border:0;
  background:#fff;
}
table.jalapeno tbody tr{ background:transparent; }
table.jalapeno tbody tr.stripe1{ background:#ebebeb; }
table.jalapeno tbody tr:hover, table.jalapeno tbody tr.hover{
  cursor:pointer;
  background:#ddd;
}
table.jalapeno tbody tr.disabled{ color:#666; }
table.jalapeno tbody tr.selected{ background:#ccc; }
table.jalapeno tfoot tr{ background:#eee; }
table.jalapeno tfoot tr td{
  padding:10px 0 5px 3px!important;
  text-align:center;
}

/* Styles for spicetables (easily generatable and exportable) for reports, etc.
***************************************************************************/
div.spicetable{ clear:both; }
table.spicetable{
  table-layout:auto;
  margin:auto;
}
div.spicetable_header{ text-align:center; }
div.spicetable_scrollable{
  border:1px solid #ccc;
  height:500px;
  width:100%; 
  overflow:auto;
}
table.spicetable tbody tr td{ vertical-align:top;  }

/* Export buttons found next to a table (pdf, excel, etc.)
*****************************************************************************/
p.back{
  float:left;
  margin:0;
  padding:0 0 0 20px;
  background:transparent url(/apps/img/icons/back_arrow.png) no-repeat center left;
}
p.export{
  margin:0 0 10px;
  float:right;
  clear:none;
  position:relative;
  top:-4px;
}
p.export a img{
  border:0;
  margin-right:3px;
  position:relative;
  top:3px;
}
p.export a{
  margin-right:7px;
  text-decoration:none;
}
p.export a:hover{ text-decoration:underline; }

/* Styles for calendar popup
***************************************************************************/
.calendar{
  z-index:501; /* right above the quick form and lightbox */
  position:relative;
  display:none;
  border:2px solid #888;
  font-size:12px;
  color:#564B47;
  cursor:default;
  background:#fff;
}
.calendar table{
  font-size:11px;
  cursor:default;
}
/* Header part -- contains navigation buttons and day names. */
.calendar .button{ /* "<<", "<", ">", ">>" buttons have this class */
  text-align:center;
  padding:1px;
  background:#CBD9E6 url(/apps/img/layout/gradients/blue_to_gray_calendar.png) repeat-x;
}
.calendar .headrow td{ background:#EFEFEF; }
.calendar .headrow .nav{ background:#EFEFEF url(/apps/img/icons/calendar_arrow.gif) no-repeat 100% 100%; }
.calendar .headrow td{ border-bottom:1px solid #CCC; }
.calendar thead .title{ /* This holds the current "month, year" */
  font-weight:bold;
  padding:1px;
  text-align:center;
  line-height:17px;
  background:#CBD9E6 url(/apps/img/layout/gradients/blue_to_gray_calendar.png) repeat-x;
}
.calendar thead .name{ /* Cells <TD> containing the day names */
  padding:4px 2px;
  text-align:center;
  font-size:10px;
  background:#fff;
}
.calendar thead .weekend{ font-style:italic; /* How a weekend day name shows in header */  }
.calendar td.button.hilite{ background:#A8BFD5; /* how it looks when hovered over */ }
.calendar .daynames .hilite, .calendar .headrow td.button.hilite{ background:#DDD; }
.calendar .headrow td.nav.hilite{ background:#DDD url(/apps/img/icons/calendar_arrow.gif) no-repeat 100% 100%; }
.calendar thead .active{ /* Active (pressed) buttons in header */
  padding:2px 0px 0px 2px;
  background-color:#ccc;
}
/* The body part -- contains all the days in month. */
.calendar tbody .day{ /* Cells <TD> containing month days dates */
  width:2em;
  text-align:right;
  padding:4px 4px 4px 2px;
}
.calendar tbody .day.othermonth{
  font-size:10px;
  color:#aaa;
}
.calendar tbody .day.othermonth.oweekend{ font-style:italic; }
.calendar table .wn{
  padding:2px 3px 2px 2px;
  background:#fff;
}
.calendar tbody .rowhilite td{ background:#FFE1D4 url(/apps/img/layout/gradients/orange_bar_calendar.png) repeat-x; }
.calendar tbody .rowhilite td.wn{ background:#ebebeb; }
.calendar tbody td.hilite{ /* Hovered cells <TD> */
  background:#fe5200;
  color:#fff;
}
.calendar tbody td.active{ /* Active (pressed) cells <TD> */
  padding:2px 2px 0px 2px;
  border-color:#333 #fff #fff #333;
}
.calendar tbody td.selected{ /* Cell showing selected date */
  font-weight:bold;
  padding:2px 2px 0px 2px;
  color:#fff;
  background:#fe5200;
}
.calendar tbody td.weekend{ font-style:italic; /* Cells showing weekend days */ }
.calendar tbody td.today{ /* Cell showing today date */
  padding:2px;
  padding-left:0;
  border:2px solid #fe5200;
}
.calendar tbody .disabled{ color:#999; }
.calendar tbody .emptycell{ visibility:hidden; /* Empty cells (the best is to hide them) */ }
.calendar tbody .emptyrow{ display:none; /* Empty row (some months need less than 6 rows) */ }
/* The footer part -- status bar and "Close" button */
.calendar tfoot .footrow{ background:#EFEFEF; /* The <TR> in footer (only one right now) */ }
.calendar tfoot .ttip{ /* Tooltip (status bar) cell <TD> */
  padding:1px;
  text-align:center;
  border-top:#CCC 1px solid;
}
.calendar tfoot .hilite{ /* Hover style for buttons in footer */
  padding:1px;
  background:#ebebeb;
}
.calendar tfoot .active{ padding:2px 0px 0px 2px; /* Active (pressed) style for buttons in footer */ }
.calendar .combo{
  /* Combo boxes (menus that display months/years for direct selection) */
  position:absolute;
  display:none;
  width:4em;
  top:0px;
  left:0px;
  cursor:default;
  background:#ebebeb;
  font-size:90%;
  padding:1px;
  z-index:100;
}
.calendar .combo .label,
.calendar .combo .label-IEfix{
  text-align:center;
  padding:1px;
}
.calendar .combo .label-IEfix{ width:4em; }
.calendar .combo .active{
  background:#ccc;
  padding:0px;
}
.calendar .combo .hilite{
  background:#564B47;
  color:#fff;
}
.calendar td.time{
  padding:1px 0px;
  text-align:center;
  background-color:#ebebeb;
}
.calendar td.time .hour,
.calendar td.time .minute,
.calendar td.time .ampm{
  padding:0px 3px 0px 4px;
  font-weight:bold;
  background-color:#fff;
}
.calendar td.time .ampm{ text-align:center; }
.calendar td.time .colon{
  padding:0px 2px 0px 3px;
  font-weight:bold;
}
.calendar td.time span.hilite{
  border-color:#333;
  background-color:#564B47;
  color:#fff;
}
.calendar td.time span.active{
  border-color:#f00;
  background-color:#333;
  color:#0f0;
}
a.calendar_trigger img{
  border:0;
  position:relative;
  top:4px;
  margin:-4px 0 0 2px;
}

div.notes {
  float: right;
  width: auto;
  height: auto;
  margin: 5px 0 10px 10px;
  padding: 5px;
  border: 1px solid #666666;
  background-color: #ffffe1;
  color: #666666;
  font-size: 100%;
}

div.search{
	
}