html {
  margin: 0; padding: 0;
  color: #585858;
  background-color: #e6e6e6;
  font-size: 62.8%; font-family: Helvetica, "Lucida Grande","Lucida Sans",Arial,sans-serif;
}
body {
  margin: 0; padding: 0;
  font-size: 1.3em; line-height: 1.4em;
}

/* Convenience Classes */
.float-left   { float: left; }
.float-right  { float: right; }
.clear        { clear: both; }
.clear-left   { clear: left; }
.clear-right  { clear: right; }
.nowrap       { white-space: nowrap; }

/* Headings */
h1, h2, h3, h4, h5, h6 { padding: 0.2em 0; margin-bottom: 1em; border-bottom: 1px solid #dedede;}
h1 { font-size: 2.0em; line-height: 1.2em; text-shadow: 1px 1px 0px #FFF; -webkit-text-shadow: 1px 1px 0px #FFF;}
h2 { font-size: 1.7em; line-height: 1.2em; }
h3 { font-size: 1.5em; line-height: 1.2em; }
h4 { font-size: 1.3em; line-height: 1.2em; }
h5 { font-size: 1.1em; line-height: 1.2em; }
h6 { font-size: 0.9em; line-height: 1.2em; }

/* General */
p { margin-bottom: 1em; }

/* Links */
a         { color: #0069cc; text-decoration: none;}
a:visited { color: #0069cc;}
a:hover   { color: #0069cc; text-decoration: underline; }
a.action  { float: right; font-size: 0.9em;}

#header > div, #content-wrapper, #footer {
  width: 930px;
  margin: 0 auto;
  position: relative;
}

/* Header */
#header {
  margin-bottom: 24px;
  height: 71px;
  border-bottom: 1px solid #fff;
  position:relative;
  background: #000000;
}
#header > div {
  height: 71px;
}
#header #site-name {
  display: block;
  width: 88px;
  height: 31px;
  position: absolute;
  top: 22px;
  left: 2px;
  background: transparent url(<%= asset_path 'images/logo.png' %>) 0 0 no-repeat;
  text-indent: -5000em;
}

#header #session-links {
  position: absolute;
  top: 20px;
  right: 0;
  font-size: 0.9em;
}
#header #session-links li {
  float: right;
  margin-left: 10px;
  color: #ccc;
  background-color: #1e1e1e;
  border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border: 1px solid #484B4F;
  font-size: 14px;
}
#header #session-links li:hover {
  box-shadow: 0 0 3px #69c;
  -moz-box-shadow: 0 0 3px #69c;
  -webkit-box-shadow: 0 0 3px #69c;
}
#header #session-links li:hover a {
  color: white;
}
#header #session-links a {
  color: #ccc;
  padding: 0 14px;
  line-height: 30px;
}
#header #session-links #sign-out i {
  color: #cc0033;
  font-size: 11px;
  margin-right: 3px;
}
#header #session-links a:hover {
  text-decoration: none;
}

/* Navigation */
#nav-bar {
  position: absolute;
  bottom: 0;
  left: 172px;
}
#nav-bar li {
  float: left;
  height: 34px;
  margin-right: 12px;
  color: #666;
  background-color: #d0d0d0;
  background-image: none;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  -moz-border-top-left-radius: 12px;
  -moz-border-top-right-radius: 12px;
  -webkit-border-top-left-radius: 12px;
  -webkit-border-top-right-radius: 12px;
  border: 1px solid #bbb;
}
#nav-bar li.active {
  border-color: #fff;
  background: #FFF url(<%= asset_path "images/button-bg.png" %>) 0 -2px repeat-x;
  border-width:1px 1px 0;
  margin-bottom:-2px;
  height: 37px;
}
#nav-bar li.active a {
  color: #333;
}

#nav-bar li i {
  margin-right: 5px;
}
#nav-bar li a {
  color: #666;
  padding: 0 20px;
  font-size: 14px;
  font-weight: bold;
  line-height: 37px;
  text-decoration: none;
  text-shadow: 1px 1px 0px #FFF;
  -webkit-text-shadow: 1px 1px 0px #FFF;
  background: transparent 10px 6px no-repeat;
}
#nav-bar li a:hover { color: #666;}
#nav-bar li:not(.active):hover {
  box-shadow: 0 0 3px #69c;
  -moz-box-shadow: 0 0 3px #69c;
  -webkit-box-shadow: 0 0 3px #69c;
}

/* Content Wrapper */
#content-wrapper {
  border: 1px solid #C6C6C6;
}

/* Content Title and Comments */
#content-title, #content-comments {
  padding: 30px 24px;
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
  background-color: #f2f2f2;
}

/* Make err title bar bigger to fit more buttons */
#content-title.err_show {
  padding: 43px 24px 37px;
}

#content-title.err_show.resolved{
  background-color: #90EE90;
}

#content-comments {
  background-color: #ffffff;
}
#content-title h1, #content-comments h3 {
  padding: 0; margin: 0;
  width: 85%;
  border: none;
  color: #636363;
  font-size: 2em; line-height: 1em; font-weight: bold; font-family: arial, sans-serif;
  word-wrap: break-word;
}
#content-comments h3 {
  font-size: 1.5em;
  margin-bottom: 14px;
}

#content-title .meta { font-size: 0.9em; color: #787878; }

/* Action Bar */
#action-bar {
  position: absolute;
  text-align: right;
  top: 22px; right: 24px;
}
#action-bar span {
  display: inline-block;
  margin-left: 18px;
  margin-bottom: 16px;
  text-decoration: none;
  color: #666;
  background: #FFF url(<%= asset_path "images/button-bg.png" %>) 0 bottom repeat-x;
  border-radius: 50px;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  border: 1px solid #bbb;
}
#action-bar span a {
  color: #666;
  padding: 0 20px;
  font-size: 14px; font-weight: bold; line-height: 39px; text-decoration: none;
  text-shadow: 1px 1px 0px #FFF; -webkit-text-shadow: 1px 1px 0px #FFF;
  background: transparent 10px 8px no-repeat;
}
#action-bar a:hover { text-decoration: none;}
#action-bar span:hover {
  box-shadow: 0 0 3px #69c;
  -moz-box-shadow: 0 0 3px #69c;
  -webkit-box-shadow: 0 0 3px #69c;
}
#action-bar a i {
  margin-right: 5px;
}

#action-bar span.github a:before { font-family: FontAwesome; content: "\f09b"; margin-right: 8px; position: relative; top: 4px; font-size: 26px; }
#action-bar span.google a:before { font-family: FontAwesome; content: "\f1a0"; margin-right: 8px; position: relative; top: 4px; font-size: 26px; }

#action-bar span a.issue-tracker-button {
  padding-left: 5px;
}

#action-bar span a.issue-tracker-button img {
  padding-left: 10px;
}

/* Content */
#content {
  padding: 20px; border-top: 1px solid #C6C6C6;
  background-color: #FFF;
}

#content a.button {
  float: right;
  display: block;
  margin-bottom: 10px;
}

/* Footer */
#footer {
  padding: 20px 0;
  font-size: 0.8em; text-align: center;
  color: #929292;
}

/* Flash Messages */
#flash-messages li {
  padding: 13px 45px;
  margin-bottom:25px;
  border: 1px solid #C6C6C6;
  background-color: #F9F9F9;
  line-height: 1em;
}
#flash-messages li.notice {
  padding-left: 20px;
  background-color: #b5eeff;
  border: 1px solid #6cf;
}
#flash-messages li.success {
  background: #cfc url(<%= asset_path "images/icons/success.png" %>) 16px 50% no-repeat;
  border: 1px solid #6c3;
}
#flash-messages li.error {
  background: #fcc url(<%= asset_path "images/icons/error.png" %>)   16px 50% no-repeat;
  border: 1px solid #f99;
}
#flash-messages .alert {
  background: #ffc url(<%= asset_path "images/icons/warning.png" %>) 10px 7px no-repeat;
  border-color: #e4bb69;
}

/* Forms */
form#new_user,
form.edit_user,
form#new_app,
form.edit_app {
  width: 620px;
}
form > div, form fieldset > div { margin: 1em 0;}
form fieldset {
  padding: 0.8em; margin-bottom: 1em;
  background-color: #F0F0F0; border: 1px solid #C6C6C6; border-left: none; border-right: none;
}
form fieldset legend {
  font-size: 1.2em; font-weight: bold; text-transform: uppercase;
  color: #555;
}
form label {
  font-weight: bold; text-transform: uppercase; line-height: 1.6em;
  display: inline-block;
}
form label.inline { display: inline; }
form .checkbox label { display: inline; }
form .required label:after { font-family: FontAwesome; content: "\f069"; color: #cc0033; margin-left: 5px; font-weight: normal; }
form .field_with_errors label { color: #900; }
form input[type=text], form input[type=password], form input[type=email] {
  width: 96%; padding: 0.8em;
  font-size: 1em;
  color: #787878; border: 1px solid #C6C6C6;
}
form textarea {
  width: 100%; padding: 0.8em;
  font-size: inherit; font-family: inherit;
  color: #787878; border: 1px solid #C6C6C6;
}
form textarea.short { height: 8em; }
form textarea.supershort { height: 4em; }
form input[type=text]:focus, form input[type=password]:focus, form input[type=email]:focus, form textarea:focus {
  box-shadow: 0px 0px 4px #69C;
  -moz-box-shadow: 0px 0px 4px #69C;
  -webkit-box-shadow: 0px 0px 4px #69C
}
form input[type=checkbox]:focus + label{
  color: #69C;
}
form input[type=submit] {
  display:block; width: auto; padding: 0.5em;
  font-size: 1.2em; line-height: 1em; text-transform: uppercase;
  border: none; color: #FFF; background-color: #387fc1;
  cursor: pointer;
}
form input[type=submit].button {
  font-size: 1em;
  text-transform: none;
}
form div.buttons {
  color: #666;
  background: #FFF url(<%= asset_path "images/button-bg.png" %>) 0 bottom repeat-x;
  border-radius: 50px;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  border: 1px solid #bbb;
  display: inline-block;
}
form div.buttons:hover {
  color: #666;
  box-shadow: 0 0 3px #69c;
  -moz-box-shadow: 0 0 3px #69c;
  -webkit-box-shadow: 0 0 3px #69c;
}
form div.buttons input, form div.buttons button {
  padding: 0 20px;
  color: #666;
  background: none;
  display: inline-block;
  height: 36px;
  font-size: 14px; font-weight: bold; line-height: 36px; text-decoration: none;
  text-shadow: 1px 1px 0px #FFF;
  -moz-text-shadow: 1px 1px 0px #FFF;
  -webkit-text-shadow: 1px 1px 0px #FFF;
  border: none;
}

.sign_in:before {
  font-family: FontAwesome;
  content: "\f061";
  margin-right: 8px;
}

form strong.option {
  display: block;
  margin: 0.7em 0;
  color: #999;
}

form .nested {
  border-top: 1px dotted #BBB;
  margin-top: 1.5em;
  padding-top: 1.5em;
}

form legend + .nested {
  border: none;
  margin-top: 0;
  padding-top: 0;
}

form .error-messages {
  padding: 13px;
  background: #fcc;
  border: 1px solid #f99;
}

form .error-messages h2 {
  font-size: 1.2em;
  border-color: #F99;
}
form .error-messages ul {
  margin-left: 2em;
  list-style-type: square;
}

form .field-helpertext {
  display: inline;
}

form input#app_email_at_notices {
  width: 130px;
  margin: 0 5px;
}


/* Tables */
table {
  width: 100%;
  border: 1px solid #C6C6C6;
  margin-bottom: 1.5em;
  border-collapse: separate;
}
table thead th {
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
}
table th, table td {
  border-top: 1px solid #C6C6C6;
  padding: 10px 8px;
  text-align: left;
}
table tbody tr:first-child th, table tbody tr:first-child td {
  border-top: none;
}
table thead + tbody tr:first-child td {
  border-top: 1px solid #C6C6C6;
}
table th { background-color: #ececec; font-weight: bold; text-transform: uppercase; white-space: nowrap; }
table tbody tr:nth-child(odd) td { background-color: #F9F9F9; }
table .main { width: 100%; }

table.single_user {
  border-top: none;
}

.raw_data {
  width: 100%;
  color: #f0f0f0;
  background-color: #222;
  overflow: auto;
}

/* Code */
pre {
  padding: 0.8em;
  margin-bottom: 1em;
  font-family: monaco, courier, monospace;
  font-size: 1.1em;
}

/* HTML Styling */
.html { padding-left: 1em; border-left: 2px solid #C6C6C6;}
.html h1, .html h2, .html h3, .html h4, .html h5, .html h6 {
  border: none;
}
.html ul, .html ol  { margin-left: 2em; margin-bottom: 1em; }
.html ul li   { margin-bottom: 0.5em; list-style: disc; }
.html ol li   { margin-bottom: 0.5em; list-style: decimal; }

/* Pagination */
.pagination {
  margin: 0 0 25px;
  font-size: 17px;
  text-align: center;
}
.pagination em {
  font-style: normal;
  font-weight: bold;
}


/* Buttons */
input[type="submit"].button,
a.button {
  display: inline-block;
  padding: 0 0.8em;
  margin-left: 0.5em;
  color: #666;
  background-color: #dadada;
  border: 1px solid #BBB;
  border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  line-height: 30px;
  min-width: 54px;
  text-align: center;
  text-shadow: 0 1px 0 #fff;
}
input[type="submit"]:hover.button,
a:hover.button {
  box-shadow: 0px 0px 4px #bfbfbf;
  -moz-box-shadow: 0px 0px 4px #bfbfbf;
  -webkit-box-shadow: 0px 0px 4px #bfbfbf;
  text-decoration: none;
  background-color: #e5e5e5;
}
a.button.active {
  border-color: #fff;
  background-color: #CCC;
  background-image: none;
}


/* Tab Bar */
.tab-bar {
  margin-top: 12px;
}
#content .tab-bar a.button {
  border-bottom:0;
  margin-bottom:0;
  border-top-left-radius:12px;
  border-top-right-radius:12px;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
  height:30px;
}
#content .tab-bar a.button.active {
  background: #FFF;
  color: #444;
  border-color:#ccc;
  border-style:solid;
  border-width:1px 1px 0;
  margin-bottom:-1px;
  height:31px;
}
.tab-bar ul {
  padding: 9px 0 0;
  line-height:0;
}
.tab-bar li {
  display: inline-block;
}

/* Issue Tracker / Notification Forms */
div.issue_tracker.nested .tracker_params, div.notification_service.nested .notification_params {
  display: none;
}

div.nested .chosen {
  display: block !important;
}
div.nested .choose {
  margin-bottom: 0.5em;
}

div.issue_tracker.nested .choose {
  background-color: #ebebeb;
  border: 1px solid #dddddd;
  margin: 0 0 15px;
  padding: 12px;
}

div.notification_service.nested .choose  {
  background-color: #ebebeb;
  border: 1px solid #dddddd;
  margin: 0 0 15px;
  padding: 12px;

}
div.issue_tracker.nested img {
  vertical-align: middle;
}

div.notification_service.nested img {
  vertical-align: middle;
}

/* Icons for Issue Tracker Radio Buttons */
div.issue_tracker.nested label.label_radio {
  color: #929292;
  margin-right: 8px;
}

div.notification_service.nested label.label_radio  {
  color: #929292;
  padding-left: 33px;
  margin-bottom: 6px;
  margin-right: 8px;
  line-height: 30px;
}

div.notification_service.nested .choose {
  padding-bottom: 6px;
}

div.issue_tracker.nested label.label_radio:hover, div.notification_service.nested label.label_radio:hover {
  color: #696969;
}

div.issue_tracker.nested .label_radio input {
  display: none;
}

div.notification_service.nested .label_radio input {
  position: absolute; left: -9999px;
}

.button-icon {
  float: left;
  margin: 5px 0 0 6px;
}

div.issue_tracker.nested label.r_on, div.issue_tracker.nested label.r_on:hover, div.notification_service.nested label.r_on, div.notification_service.nested label.r_on:hover {
  color: #191919;
}

/* Icons need to be preloaded, otherwise it looks bad */
.image_preloader { display: none; }

/* Apps Table */
table.apps tbody tr:hover td ,table.errs tbody tr:hover td { background-color: #F2F2F2;}

table.apps td.name { width: 100%; }
table.apps td { padding: 16px 20px; }
table.apps th { padding: 10px 20px; }

table.apps td.issue_tracker, table.apps td.count {
  text-align: center;
}
table.apps td.issue_tracker, table.apps td.count {
  padding: 10px 8px;
}
table.apps td.issue_tracker img { vertical-align: top; }

td.message .line {
  display:inline-block;
  margin-left:1em;
}
td.latest {
  white-space: nowrap;
}
td.count, td.issue_link {
  text-align: center;
}

.count a {
  display: inline-block;
  padding: 0.1em 0.7em;
  margin-top: 3px;
  color: #fff;
  background-color: #cc0033;
  border: 1px solid #900;
  border-radius: 18px;
  -moz-border-radius: 18px;
  -webkit-border-radius: 18px;
  font-weight: bold;
  opacity: 0.8;
  -moz-opacity: 0.8;
  -webkit-opacity: 0.8
}
.count a.resolved {
  background-color: #05B81d;
  border: 1px solid #080;
}
.count a:hover {
  text-decoration: none;
  opacity: 1;
  -moz-opacity: 1;
  -webkit-opacity: 1;
}

/* Err Tables */
table.errs td.app .name {
  display: block;
  width: 150px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
table.errs td.app .environment {
  font-size: 0.8em;
  color: #999;
}
table.errs td.message a {
  display: block;
  word-wrap: break-word;
  width: 440px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
table.errs td.message em {
  color: #727272;
  font-size: 0.9em;
}

table.errs tr.resolved td > * {
  opacity: 0.5;
  -moz-opacity: 0.5;
  -webkit-opacity: 0.5;
}

/* Tally tables */
table.tally {
  border:none;
}
table.tally td,
table.tally th {
  border:none !important;
  background:none !important;
  padding:8px 0 0;
}
table.tally tbody tr:first-child td,
table.tally tbody tr:first-child th {
  padding-top:0;
}
table.tally td.percent {
  padding-right: 10px;
}
table.tally th.value {
  width: 100%;
  text-transform: none;
}

/* Resolve Errs */
#action-bar .resolve:before {
  font-family: FontAwesome;
  content: "\f087";
  margin-right: 5px;
}

/* Go Up */
#action-bar a.up:before {
  font-family: FontAwesome;
  content: "\f077";
  margin-right: 5px;
}

/* Notices Pagination */
.notice-pagination {
  float: left;
  margin-right: 10px;
}

.notice-pagination-loader {
  visibility: hidden;
  float: left;
  width: 16px;
  height: 16px;
  margin-right: 1em;
}
.notice-pagination-loader img {
  vertical-align: middle
}


/* Backtrace */
.window {
  width: 100%;
  margin-bottom: 1em;
  overflow: auto;
  border:1px solid #ccc;
  padding:1px;
}

.window table {
  margin: 0;
}

table.backtrace {
  padding: 8px 0;
  background-color: #222;
}

table.backtrace td {
  width: 100%;
  padding: 0;
  margin: 0;
  color: #C7C7C7;
  background-color: #222;
}

table.backtrace td, table.backtrace th {
  border-top: none;
}

/* remove alternating color rules */
table.backtrace tr:nth-child(2n+1) td { background-color: #222; }
table.backtrace tr:first-child td { border-top: 0; }

table.backtrace th.line-numbers {
  border-bottom: 1px solid #F0F0F0;
  font-size: 13px;
  text-align: right;
  vertical-align: top;
  padding: 1px 6px 1px 7px;
}

table.backtrace td.line {
  font-size: 13px;
  padding: 2px 8px;
  vertical-align: top;
  white-space: nowrap;
}
table.backtrace td.line .file {
  font-weight: bold;
}
table.backtrace td.line .method {
  color: #aaa;
  font-weight: bold;
}

table.backtrace td.line.in-app {
  color: #2adb2e;
  background-color: #2f2f2f;
}
table.backtrace td.line.in-app .path,
table.backtrace td.line.in-app .number { color: #2ACB2E; }
table.backtrace td.line.in-app .file   { color: #3AFB3E; }
table.backtrace td.line.in-app .method { color: #2ACB2E; }

table.backtrace td.line.in-app a .path,
table.backtrace td.line.in-app a .number,
table.backtrace td.line.in-app a:hover { color: #21B4FF; }
table.backtrace td.line.in-app a .file { color: #31C4FF; }

/* External backtrace classes and separators */
table.backtrace tr.hidden_external_backtrace {
  display: none;
}
table.backtrace td.backtrace_separator span {
  cursor: pointer;
  display: inline-block;
  font-size: 17px;
  font-weight: bold;
  padding: 0px 11px 5px;
  margin: 4px 0;
  background-color: #444444;
  border: 1px solid #555555;
}
table.backtrace td.backtrace_separator span:hover {
  background-color: #666666;
  border: 1px solid #777777;
}



/* Extra empty rows at top and bottom of table */
table.backtrace tr.padding th, table.backtrace tr.padding td {
  height: 10px;
  margin: 0;
  padding: 0;
}

h3#watchers_toggle, h3#repository_toggle {
  cursor: pointer;
}

span.click_span {
  font-size: 0.7em;
}

#repository_div, #watchers_div {
  display: none;
}

/* Comments */
#content-comments form p {
  margin: 30px 0 0 0;
  text-transform: uppercase;
}
table.comment tbody th {
  text-transform: none;
  font-weight: normal;
  height: 20px;
  line-height: 0.5em;
}
table.comment th span, table.comment th img {
  vertical-align: middle;
}
table.comment th span.comment-info {
  line-height: 21px;
  float: left;
}
table.comment img.gravatar {
  margin-right: 7px;
  float: left;
}

table.comment tbody td {
  background-color: #F9F9F9;
}
#content-comments a.destroy-comment {
  color: #EE0000;
  margin-right: 5px;
  margin-top: 2px;
  font-size: 21px;
  line-height: 1;
  float: right;
}
#content-comments a.destroy-comment:hover {
  text-decoration: none;
  color: #AA0000;
}
#content-comments #comment_submit {
  margin-top: 15px;
}
/* Inline comments in tables */
table.errs tr td.message .inline_comment {
  display: inline-block;
  padding: 3px 7px;
  margin: 6px 0;
  background-color: #DAE5FF;
  border: 1px solid #E2E2E2;
  text-shadow: 0 1px 0 #FAFAFA;
  font-style: normal;
  word-wrap: break-word;
  text-overflow: ellipsis;
  width: 300px;
}
table.errs tr:hover td.message .inline_comment {
  background-color: #D5E0FA;
  border-color: #DBDBDB;
  text-shadow: 0 1px 0 #FFFFFF;
}
table.errs tr td.message .inline_comment em {
  color: #444;
}
table.errs tr td.message .inline_comment em.commenter {
  color: #777;
}

textarea#comment_body {
  width: 420px;
  height: 80px;
}

.current.asc:after { content: ' ↑'; }
.current.desc:after { content: ' ↓'; }


table.users td {
  vertical-align: middle;
}
table.users td img.gravatar {
  vertical-align: middle;
  margin-left: 3px;
}