/* css reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
a img {border:none;}

/* typography css */
body {color:#222; font-family: Helvetica, sans-serif;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}
p {margin:0 0 1.5em 0;}
p img.left {float:left;margin:1.5em 1.5em 1.5em 0;padding:0;}
p img.right {float:right;margin:1.5em 0 1.5em 1.5em;}
a:focus, a:hover {color:#868686;}
a {color:#0f3bc8;text-decoration:underline;}
strong {font-weight:bold;}
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
abbr, acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre, code, tt, pre span {font:1em 'menlo', 'andale mono', 'lucida console', monospace;line-height:1.5;}
li ul, li ol {margin:0 1.5em;}
ul, ol {margin:0 0 1.5em 1.5em;}
ul {list-style-type:disc;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}
caption {background:#eee;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {display:none;}
.quiet {color:#666;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}
a:active { outline: none !important; }
:focus {-moz-outline-style: none;}

/* forms.css */
label    { font-weight: bold; }
legend   { font-weight: bold; font-size:1.2em; margin-top:-0.2em; margin-bottom:1em; }
input,
input[type=text],
input[type=password],
input[type=url],
input[type=email],
input[type=date],
input.text,
input.title,
textarea {
  font-size: 1em;
  background-color:#fff;
  border:1px solid #bbb;
  color:#000;
}
input:focus,
input[type=text]:focus,
input[type=password]:focus,
input[type=url]:focus,
input[type=email]:focus,
input[type=date]:focus,
input.text:focus,
input.title:focus,
textarea:focus {
  border-color:#D69600;
}
select { background-color:#fff; border-width:1px; border-style:solid; }

input[type=text], input[type=password], input[type=url], input[type=email],
input.text, input.title,
textarea, select {
  margin:0.5em 0;
}

input.text,
input.title { width: 300px; padding:5px; }
input.title { font-size:1.5em; }
/*textarea    { width: 390px; height: 250px; padding:5px; }*/

form.inline { line-height:3; }
form.inline p { margin-bottom:0; }

.error,
.alert,
.notice,
.success,
.info { padding: 0.8em; margin-bottom: 1em; border: 2px solid #ddd; }

.error, .alert { background: #fbe3e4; color: #8a1f11; border-color: #fbc2c4; }
.notice        { background: #fff6bf; color: #514721; border-color: #ffd324; }
.success       { background: #e6efc2; color: #264409; border-color: #c6d880; }
.info          { background: #d5edf8; color: #205791; border-color: #92cae4; }
.error a, .alert a { color: #8a1f11; }
.notice a          { color: #514721; }
.success a         { color: #264409; }
.info a            { color: #205791; }

/* grid.css */
.container_12 {
  margin-bottom: 40px;
}

.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {
    display:inline;
    float: left;
    position: relative;
    margin-left: 1%;
    margin-right: 1%;
}

.alpha { margin-left: 0; }
.omega { margin-right: 0; }

.container_12 .grid_1 { width:6.333%; }
.container_12 .grid_2 { width:14.667%; }
.container_12 .grid_3 { width:23.0%; }
.container_12 .grid_4 { width:31.333%; }
.container_12 .grid_5 { width:39.667%; }
.container_12 .grid_6 { width:48.0%; }
.container_12 .grid_7 { width:56.333%; }
.container_12 .grid_8 { width:64.667%; }
.container_12 .grid_9 { width:73.0%; }
.container_12 .grid_10 { width:81.333%; }
.container_12 .grid_11 { width:89.667%; }
.container_12 .grid_12 { width:98.0%; }

.container_12 .prefix_1 { padding-left:8.333%; }
.container_12 .prefix_2 { padding-left:16.667%; }
.container_12 .prefix_3 { padding-left:25.0%; }
.container_12 .prefix_4 { padding-left:33.333%; }
.container_12 .prefix_5 { padding-left:41.667%; }
.container_12 .prefix_6 { padding-left:50.0%; }
.container_12 .prefix_7 { padding-left:58.333%; }
.container_12 .prefix_8 { padding-left:66.667%; }
.container_12 .prefix_9 { padding-left:75.0%; }
.container_12 .prefix_10 { padding-left:83.333%; }
.container_12 .prefix_11 { padding-left:91.667%; }

.container_12 .suffix_1 { padding-right:8.333%; }
.container_12 .suffix_2 { padding-right:16.667%; }
.container_12 .suffix_3 { padding-right:25.0%; }
.container_12 .suffix_4 { padding-right:33.333%; }
.container_12 .suffix_5 { padding-right:41.667%; }
.container_12 .suffix_6 { padding-right:50.0%; }
.container_12 .suffix_7 { padding-right:58.333%; }
.container_12 .suffix_8 { padding-right:66.667%; }
.container_12 .suffix_9 { padding-right:75.0%; }
.container_12 .suffix_10 { padding-right:83.333%; }
.container_12 .suffix_11 { padding-right:91.667%; }

.container_12 .push_1 { left:8.333%; }
.container_12 .push_2 { left:16.667%; }
.container_12 .push_3 { left:25.0%; }
.container_12 .push_4 { left:33.333%; }
.container_12 .push_5 { left:41.667%; }
.container_12 .push_6 { left:50.0%; }
.container_12 .push_7 { left:58.333%; }
.container_12 .push_8 { left:66.667%; }
.container_12 .push_9 { left:75.0%; }
.container_12 .push_10 { left:83.333%; }
.container_12 .push_11 { left:91.667%; }

.container_12 .pull_1 { left:-8.333%; }
.container_12 .pull_2 { left:-16.667%; }
.container_12 .pull_3 { left:-25.0%; }
.container_12 .pull_4 { left:-33.333%; }
.container_12 .pull_5 { left:-41.667%; }
.container_12 .pull_6 { left:-50.0%; }
.container_12 .pull_7 { left:-58.333%; }
.container_12 .pull_8 { left:-66.667%; }
.container_12 .pull_9 { left:-75.0%; }
.container_12 .pull_10 { left:-83.333%; }
.container_12 .pull_11 { left:-91.667%; }

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

/* navigation.css */

body {
    --s1: 1em;

    --niceThingsYellow1: #FFC200;
    --niceThingsYellow2: #FAAF00;
    --niceThingsYellow3: #D69600;
    --niceThingsYellow4: #B88100;
    --niceThingsYellow5: #9E6900;

    --niceThingsRed1: #E64727;
    --niceThingsRed2: #CF4023;
    --niceThingsRed3: #B8391F;
    --niceThingsRed4: #A1321B;
    --niceThingsRed5: #8A2B17;

    --niceThingsOrange1: #FB9623;
    --niceThingsOrange2: #E2871F;
    --niceThingsOrange3: #C9781C;
    --niceThingsOrange4: #B06918;
    --niceThingsOrange5: #975A15;
}

.navigation {
    background-color: #eee;
}

nav li {
    list-style: none;
    padding: 5px 0px;
}

nav ul a {
    text-decoration: none !important;
    color: #333333;
    font-size: 1.5em;
    line-height 2;
    font-weight: 800;
}

/* layout.css */

.wrapper {
    overflow: hidden;
}

.wrapper > * {
    display: flex;
    flex-wrap: wrap;
}

.wrapper > * > * {
    padding: 1em 0;
    flex-basis: 10rem;
    flex-grow: 1;
}

.wrapper > * > :last-child {
    flex-basis: 0;
    flex-grow: 999;
    min-width: calc(50% - var(--s1));
    margin: calc(2*var(--s1))
}

/* nicethings.css */

h1, h2, h3, h4, h5, h6 {
    font-weight: 800;
}

h1 {
    font-size: 8em;
}

h2 {
    font-size: 3em;
}

h3 {
    font-size: 2em;
}

h4 {
    font-size: 1.5em;
}

header {
    background-color: var(--niceThingsYellow1);
    margin: 0;
    padding: 15px;
    color: white;
    line-height: 1;
}

a {
    color: var(--niceThingsOrange3);
}

.big-button {
    float: right;
    display: block;
    height: 50px;
    width: 50px;
    margin: auto;
    margin-top: 0px;
    text-decoration: none;
    text-align: center;
    font-size: 3.5em;
    line-height: 1;
}

h4.eyebrow-treatment {
    font-size: 1em;
}

.eyebrow-treatment {
    color: #666;
}

.invoice-section {
    margin-bottom: 20px;
}

/* tables.css */

.content table {
    border-collapse: collapse;
    margin: 25px 0;
    width: 100%;
}

.content table thead tr th {
    background-color: var(--niceThingsYellow1);
    color: #ffffff;
    text-align: left;
    font-weight: 800;
}

.content table th, .content table td {
    padding: 12px 15px;
}

.content table tbody tr {
    background-color: #ffffff;
}

.content table tbody tr:nth-of-type(even) {
    background-color: #eeeeee;
}

.content table tbody tr:last-of-type {
    border-bottom: 2px solid var(--niceThingsYellow1);
}

tfoot td {
    font-weight: 600;
}

/* transactions.css */

.credit {
    color: #6D9232;
}

.debit {
    color: #B8391F;
}

/* invoice-cards.css */

.client-cards {
    display: flex;
    flex-flow: row wrap;
    margin: 0;
}

.client-card {
    width: 200px;
    height: 120px;
    background-color: var(--niceThingsYellow1);
    padding: 20px;
    margin: 10px 0px 10px 10px;
    border-radius: 20px;
    color: #222;
    text-align: right;
    font-weight: bold;

    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-end;
}

a.client-card {
    text-decoration: none;
}

a.client-card:hover {
    color: #555;
}

.client-card .client {

}

.client-card .amount {
    font-size: 2em;
}

.client-card .hours {

}

/* forms.css */

form.large-form {
    border-radius: 8px;
    margin: 0 auto 40px;
}

form.large-form label {
    font-size: 1em;
    color: #666;
}

form.centered-form {
    text-align: center;
}

.extra-bottom-spacing {
    margin-bottom: 60px;
}

.destructive[type="submit"], .destructive[type="button"] {
    background: var(--niceThingsRed1);
    border: 1px solid var(--niceThingsRed3);
    border-width: 0px 0px 3px;
}

.destructive[type="submit"]:hover, .destructive[type="button"]:hover {
    background: var(--niceThingsRed2);
    cursor: pointer;
}

form input,
form textarea,
form select {
    border-radius: 8px;
    font-size: 15px;
}

form.large-form input,
form.large-form textarea,
form.large-form select {
    background: rgba(255,255,255,.1);
    outline: 0;
    padding: 10px;
    background-color: #f4f7f8;
    color:#383c3f;
    -webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.03) inset;
    box-shadow: 0 1px 0 rgba(0,0,0,0.03) inset;
    margin-bottom: 20px;
}

form select{
    height: 35px;
}

form input[type="submit"],
form input[type="button"]
{
    background: var(--niceThingsYellow1);
    text-align: center;
    font-weight: 800;
    border: 1px solid var(--niceThingsYellow3);
    border-width: 0px 0px 3px;
    color: white;
    padding: 10px 20px;
}

form.large-form input[type="submit"],
form.large-form input[type="button"]
{
    font-size: 1.2em;
    position: relative;
    display: block;
    padding: 10px 10px;
}

form input[type="submit"]:hover,
form input[type="button"]:hover
{
    background: var(--niceThingsYellow2);
    cursor: pointer;
}

form.large-form label,
form.large-form input,
form.large-form fieldset {
    display: block;
}

form.large-form input:hidden {
    display: hidden;
}

form.large-form input:disabled {
    border: none;
}

form.large-form label,
form.large-form fieldset {
    display: block;
}

form.large-form input[type="submit"] {
    display: block;
}

form input::-webkit-calendar-picker-indicator {
  display: none;
}

.button {
    border-radius: 8px;
    padding: 10px 20px;
    color: white;
    background: var(--niceThingsYellow1);
    font-size: 1em;
    text-align: center;
    font-weight: 800;
    border: 1px solid var(--niceThingsYellow2);
    border-width: 0px 0px 3px;
    text-decoration: none;
}

.button:hover {
    color: white;
    background-color: var(--niceThingsYellow2)
}

/* pills.css */

.invoice-pill {
    font-weight: bold;
    padding: 5px 15px;
    border-radius: 30px;
    font-size: 0.95em;
}

.invoice-pill-paid {
    background: #d1efce;
    color: #10390a;
}

.invoice-pill-sent {
    background: #f9ecca;
    color: #3f2800;
}

.invoice-pill-overdue {
    background: #ffe0e0;
    color: #5a1017;
}

.invoice-pill-deferred {
    background: #ddd;
    color: #333;
}

.invoice-pill-initial {
    background: #eee;
    color: #333;
}

.invoice-pill-cancelled {
    background: #ddd;
    color: #333;
}

/* time.css */

.time-entry-week-overview {
    display: flex;
    margin-bottom: 20px;
}

.time-entry-week-overview .weekday, .time-entry-week-overview .week-summary {
    flex: 1;
    margin: 2px;
    text-align: center;
}

.time-entry-week-overview .weekday-header {
    background: var(--niceThingsYellow1);
    color: white;
    font-weight: bold;
    padding: 2px;
}

.time-entry-week-overview .weekday-header a {
    color: white;
    text-decoration: none;
    font-weight: bold;
    padding: 2px;
}

.time-entry-week-overview .current-day .weekday-header {
    background: var(--niceThingsYellow1);
    border-bottom: thin solid black;
    color: black;
    font-weight: bold;
    padding: 2px;
}

.time-entry-week-overview .summary-header {
    border-bottom: thin solid var(--niceThingsYellow2);
    color: var(--niceThingsYellow2);
    font-weight: bold;
    padding: 2px;
}

.harvest-tag {
    font-size: 0.5em;
    padding: 2px;
    border-radius: 8;
    font-weight: bold;
    display: inline-block;
    background: var(--niceThingsYellow1);
    text-transform: uppercase;
    margin: 0 auto;
}

/* tax.css */

#tax h3 {
    border-bottom: thin solid black;
    margin-bottom: 20px;
}

/* tablesort.css */

th[role=columnheader]:not(.no-sort) {
    cursor: pointer;
}

th[role=columnheader]:not(.no-sort):after {
    content: '';
    color: white;
    float: right;
    margin-top: 7px;
    border-width: 0 8px 8px;
    border-style: solid;
    border-color: white transparent;
    visibility: hidden;
    opacity: 0;
    -ms-user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

th[aria-sort=descending]:not(.no-sort):after {
    border-bottom: none;
    border-width: 8px 8px 0;
}

th[aria-sort]:not(.no-sort):after {
    visibility: visible;
    opacity: 0.4;
}

th[role=columnheader]:not(.no-sort):hover:after {
    visibility: visible;
    opacity: 1;
}

