* {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box; }

body, html {
  padding: 0px;
  margin: 0;
  background: #FFF; }

body, td, th, option, select, input, textarea {
  font-family: 'Lato', sans-serif;
  font-size: 14px;
  color: #262626; }

a {
  color: #262626;
  text-decoration: none; }

a.mail {
  unicode-bidi: bidi-override;
  direction: rtl; }

.header {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  background: #262626; }
  .header .logo {
    margin-right: 12px; }
    .header .logo a img {
      height: 30px; }
  .header .menu {
    display: flex;
    height: 50px; }
    .header .menu ul {
      display: flex;
      list-style: none;
      margin: 0;
      padding: 0; }
      .header .menu ul li a {
        display: flex;
        padding: 17px 20px;
        color: #FFF;
        border-right: 1px solid #000;
        font-weight: bold;
        text-transform: uppercase;
        font-size: 13px; }
      .header .menu ul li.active a {
        background: #ff8017; }
  .header .submenu {
    display: flex;
    width: 100%;
    background: #ff8017; }
    .header .submenu ul {
      display: flex;
      list-style: none;
      margin: 0;
      padding: 0 0 0 10px; }
      .header .submenu ul li a {
        display: flex;
        padding: 10px;
        color: #FFF;
        font-weight: bold;
        font-size: 13px; }
  .header a.mobile-open-menu-link {
    display: none; }
  .header div.time-report {
    display: flex;
    align-items: center;
    color: #FFF; }
    .header div.time-report span {
      font-size: 22px;
      margin-right: 8px; }
      .header div.time-report span.green {
        color: green; }
      .header div.time-report span.red {
        color: red; }
    .header div.time-report input[type=time] {
      margin-right: 4px;
      width: auto;
      padding: 4px;
      font-size: 12px; }
    .header div.time-report input[type=submit] {
      font-size: 12px;
      padding: 4px 8px; }
  @media only screen and (max-width: 1000px) {
    .header {
      padding: 12px; }
      .header .logo a img {
        height: 20px; }
      .header a.mobile-open-menu-link {
        display: flex;
        color: #ff8017;
        font-size: 24px; }
      .header div.menu,
      .header div.submenu {
        display: none; } }

div.mobile-menu {
  display: none; }

body.open-menu div.mobile-menu {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background: #262626;
  padding: 16px;
  flex-direction: column;
  align-items: flex-end; }
  body.open-menu div.mobile-menu a.mobile-close-menu-link {
    color: #FFF;
    font-size: 24px; }
  body.open-menu div.mobile-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%; }
    body.open-menu div.mobile-menu ul li {
      padding: 12px;
      border-bottom: 1px solid #000; }
      body.open-menu div.mobile-menu ul li a {
        color: #FFF;
        font-weight: bold;
        text-transform: uppercase; }
      body.open-menu div.mobile-menu ul li ul {
        margin: 8px 0 12px; }
        body.open-menu div.mobile-menu ul li ul li {
          border: 0; }
          body.open-menu div.mobile-menu ul li ul li a {
            color: #FFF;
            padding-left: 24px;
            text-transform: none; }

.footer {
  float: left;
  width: 100%;
  padding: 40px 0; }

.content {
  float: left;
  width: 100%;
  padding: 20px; }

.content .content-holder {
  padding: 20px 0; }

/* Meddelande */
div.flash {
  float: left;
  width: 100%;
  clear: left;
  margin: 20px 0 20px; }

div.flash span {
  float: left;
  width: 100%;
  background: #CC0000;
  color: #FFF;
  font-weight: bold;
  padding: 15px;
  font-size: 17px; }

div.flash .ok {
  background: green; }

/* form */
label {
  display: block;
  font-weight: bold;
  padding: 10px 0 3px;
  text-transform: uppercase;
  font-size: 11px;
  color: #262626; }

label span.req {
  display: inline;
  padding-left: 3px;
  color: #CC0000; }

label.checkbox {
  text-transform: none;
  font-size: 14px;
  font-weight: normal; }

label.checkbox input {
  display: inline; }

label.checkbox span {
  display: inline;
  padding-left: 3px; }

td label {
  display: inline;
  padding: 0;
  font-weight: normal; }

input[type=text],
input[type=password],
input[type=date],
input[type=time],
textarea {
  border: 1px solid #CCC;
  width: 300px;
  padding: 6px;
  border-radius: 2px; }

select {
  padding: 6px;
  border: 1px solid #CCC;
  border-radius: 2px; }

input[type=text].amount {
  width: 50px; }

input[type=text].price, input[type=text].cost {
  width: 60px; }

input.datepicker {
  width: 100px; }

input[type=time] {
  width: 80px; }

input.number {
  width: 55px; }

input.article_number {
  width: 100px; }

input.zipcode {
  float: left;
  width: 80px; }

input.city {
  float: left;
  width: 215px; }

input.prio {
  width: 40px; }

input.medium {
  width: 200px; }

textarea {
  height: 100px;
  width: 200px;
  height: 50px;
  min-height: 50px;
  resize: vertical; }

textarea.img_desc {
  height: 50px;
  width: 100%; }

input[type=submit],
input[type=button],
a.btn {
  display: inline-block;
  padding: 10px 20px;
  text-decoration: none;
  border: 0;
  text-transform: uppercase;
  background: #40494d;
  color: #FFF;
  font-weight: bold;
  cursor: pointer; }

input[type=submit]:hover,
input[type=button]:hover,
a.btn:hover {
  background: #ff8017;
  border-color: #ff8017;
  color: #FFF; }

a.btn:hover span {
  color: #FFF; }

a.btn-r {
  float: right; }

a.btn,
li.btn {
  text-transform: none;
  border: 1px solid #CCC;
  background: #f7f7f7;
  border-radius: 3px;
  color: #262626; }

a.btn span {
  float: left;
  margin-right: 7px;
  font-size: 19px; }

a.btn div {
  float: left; }

a.add-button,
a.remove-button {
  float: left; }

a.add-button span,
a.remove-button span {
  float: left;
  background: #000;
  font-size: 14px;
  width: 20px;
  height: 20px;
  padding-top: 3px;
  text-align: center;
  color: #FFF;
  border-radius: 10px; }

a.add-button span {
  background: #ea6a0e; }

.filter input[type=submit] {
  border-color: #999;
  background: #40494d; }

/* Standard lista */
table.list {
  border-collapse: collapse;
  margin-top: 20px; }

table.list th,
table.list td {
  padding: 8px 20px 8px 10px;
  border: 1px solid #CCC;
  text-align: left;
  vertical-align: top; }

table.list thead th {
  text-transform: uppercase;
  font-size: 13px;
  background: #262626;
  color: #FFF;
  border-color: #000;
  padding: 10px 20px 10px 10px; }

table.list thead th.order {
  padding: 0; }

table.list thead th a {
  float: left;
  color: #FFF;
  padding: 10px; }

table.list thead th a span {
  font-size: 18px;
  padding: 2px 0 0 2px;
  color: #666; }

table.list thead th.order-active a span {
  color: #FFF; }

table.list tbody tr:nth-child(odd) td {
  background: #fafafa; }

table.list tr.done td {
  background: #f2f2f2; }

table.list tbody tr:hover td {
  background: #f7f7f7; }

table.list .btn {
  padding: 3px 7px; }

table.list td.c, table.list th.c {
  text-align: center; }

table.list td.r, table.list th.r {
  text-align: right; }

table.list th.b-left, table.list td.b-left {
  border-left: 1px solid #CCC; }

table.list tfoot td {
  background: #666;
  border-color: #666;
  color: #FFF; }

table.list tfoot tr.bold td {
  font-weight: bold; }

table.list td.green {
  color: green; }

table.list td.red {
  color: red; }

table.list td.buttons {
  padding: 4px 10px; }

table.list td.buttons a.btn {
  background: #000;
  color: #FFF;
  border-color: #000; }

table.list td.buttons a.btn span {
  margin: 0; }

table.list td.buttons .delete {
  background-color: #cc0000 !important;
  bordeR: solid 1px #cc0000 !important; }

table.list .pagination {
  padding: 5px 0;
  border-bottom: 0;
  border-bottom: 1px solid #CCC; }

table.list .pagination tbody tr:nth-child(odd) td {
  border: 0; }

table.list .pagination table.info {
  float: left; }

table.list .pagination table.pages {
  float: right; }

table.list .pagination table.pages td {
  padding: 5px; }

/* Filter */
.box-filter {
  float: left;
  width: 100%;
  padding: 10px;
  border: 1px solid #CCC;
  background: #f7f7f7;
  margin: 20px 0; }

.box-filter .field {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px; }

.box-filter .field:last-of-type {
  margin-bottom: 0; }

.box-filter .field label {
  padding-top: 0;
  margin-bottom: 5px; }

.box-filter input[type=submit] {
  padding: 10px 20px;
  margin-top: 13px; }

/* LOGIN */
body.login .content {
  padding: 0; }

body.login .header {
  height: auto;
  text-align: center;
  padding: 20px;
  justify-content: center; }

div.login {
  width: 460px;
  margin: 20px auto 0;
  text-align: center; }

div.login .description {
  float: left;
  width: 100%;
  text-align: left;
  margin: 30px 0 20px; }

div.login .select-language {
  float: left;
  width: 100%;
  text-align: left;
  margin: 10px 0 20px;
  border: 1px solid #CCC;
  padding: 10px; }

div.login .login-box {
  float: left;
  text-align: left;
  width: 180px;
  margin-right: 10px; }

div.login .login-box-submit {
  width: 80px;
  padding-top: 30px;
  margin-right: 0; }

div.login .login-box input {
  width: 100%; }

div.login .login-box-submit input {
  width: auto; }

div.login a.forgot-password {
  float: left;
  clear: both;
  margin-top: 10px; }

div.login .info {
  float: left;
  width: 100%;
  border-top: 1px solid #CCC;
  text-align: center;
  margin-top: 30px;
  padding-top: 10px; }

div.login .forgot-password-form {
  float: left;
  width: 100%;
  display: none; }

/* Box */
.content .box {
  float: left;
  margin: 0 10px 10px 0;
  padding-bottom: 10px; }

.content .box h3 {
  margin: 0;
  background: #000;
  color: #ff8017;
  padding: 10px;
  font-size: 14px;
  text-transform: uppercase; }

.content .box .box-content {
  float: left;
  width: 100%;
  padding: 5px 10px 10px;
  border: 1px solid #CCC; }

.content .box div.field {
  float: left;
  clear: both; }

.content .box div.field-invoice_city,
.content .box div.field-delivery_city,
.content .box div.field-city {
  clear: none;
  padding-left: 0; }

.content .box div.field-invoice_zipcode,
.content .box div.field-delivery_zipcode,
.content .box div.field-zipcode {
  padding-right: 5px; }

.content .box div.field-checkbox {
  display: flex;
  align-items: center;
  margin-top: 10px;
  padding: 8px;
  border: 1px solid #CCC; }
  .content .box div.field-checkbox input {
    margin: 0 4px 0 0; }
  .content .box div.field-checkbox label {
    padding: 0; }

/* Order-sidan */
body.order h1.head {
  float: left;
  width: 100%;
  padding: 10px; }

body.order .select-customer {
  list-style: none;
  margin: 0;
  padding: 0; }

body.order .select-customer li {
  float: left;
  width: 100%;
  margin-bottom: 10px; }

body.order .select-customer li a {
  float: left;
  width: 100%;
  background: #262626;
  border-radius: 3px;
  padding: 10px;
  color: #FFF;
  border: 1px solid #000; }

body.order .select-customer li .select-delivery-address {
  display: none;
  float: left;
  width: 100%;
  background: #F5F5F5;
  padding: 20px; }

body.order .select-customer li .select-delivery-address h2 {
  margin: 0 0 10px;
  font-size: 14px; }

body.order .select-customer li .select-delivery-address ul {
  list-style: none;
  float: left;
  width: 100%;
  margin: 0;
  padding: 0; }

body.order .select-customer li .select-delivery-address ul li a {
  border-radius: 3px;
  background: #666; }

body.order table.order-rows thead th {
  padding: 10px 10px 10px 10px; }

body.order table.order-rows td {
  padding: 6px 10px 6px 10px; }

body.order textarea[name="note"] {
  width: 500px;
  height: 100px;
  max-width: 100%; }

/* Redigera kund */
body.customer-edit h2 {
  clear: both; }

body.customer-edit table.delivery-adresses input[type="text"] {
  width: 180px; }

body.customer-edit table.delivery-adresses input[type="text"].zipcode {
  width: 80px; }

body.customer-edit table.delivery-adresses input[type="text"].city {
  width: 160px; }

/* Materialbestallning */
body.material .box-filter input[type="submit"] {
  margin: 0; }

body.material form .hide-desktop + input[type="submit"] {
  margin-top: 10px; }

/* Tidsrapport */
body.time-add form {
  display: flex; }
body.time-add label.checkbox {
  display: flex;
  align-items: center;
  background: #F7F7F7;
  border: 1px solid #CCC;
  padding: 8px;
  margin-bottom: 4px; }
  body.time-add label.checkbox input {
    margin: 0 4px 0 0; }
@media only screen and (max-width: 500px) {
  body.time-add .box {
    display: flex;
    flex-wrap: wrap; }
    body.time-add .box .field {
      margin: 0 8px 8px 0; }
      body.time-add .box .field.field-addon_work_customer, body.time-add .box .field.field-addon_allowance, body.time-add .box .field.field-addon_other {
        width: 100%; }
        body.time-add .box .field.field-addon_work_customer input, body.time-add .box .field.field-addon_allowance input, body.time-add .box .field.field-addon_other input {
          width: 100%; }
      body.time-add .box .field.field-type {
        width: 100%; }
        body.time-add .box .field.field-type label {
          width: 100%; } }

body.time td.lock {
  padding: 8px 10px !important; }
  body.time td.lock span {
    color: #CCC; }
  body.time td.lock.locked span {
    color: #CD7F32; }
body.time form.print-form {
  display: flex;
  align-items: flex-end;
  border: 1px solid #CCC;
  background: #F7F7F7;
  padding: 16px; }
  body.time form.print-form div {
    margin-right: 16px; }
    body.time form.print-form div label {
      padding-top: 0; }

div.time-supported-by {
  display: flex;
  width: 100%;
  margin-top: 64px;
  align-items: flex-end; }
  div.time-supported-by img {
    height: 50px;
    margin-right: 24px; }

/* Popup */
div.shadow {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: none;
  align-items: center;
  justify-content: center; }

div.shadow .popup {
  background: #FFF;
  padding: 20px;
  max-height: 96%;
  min-width: 360px;
  overflow: auto;
  position: relative; }

div.shadow .popup a.close {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 16px; }

div.shadow .popup h3 {
  margin: 0 0 16px; }

div.shadow .popup ul {
  list-style: none;
  margin: 10px 0;
  padding: 0;
  width: 100%; }

div.shadow .popup ul li {
  width: 100%;
  border: 1px solid #CCC;
  background: #f7f7f7;
  margin-bottom: 3px;
  height: 50px;
  padding: 0 10px;
  border-radius: 3px;
  display: flex;
  flex-direction: column;
  justify-content: center; }

div.shadow .popup ul li .article-number {
  font-size: 11px; }

div.shadow .popup ul#sortable li {
  cursor: move; }

div.shadow .popup ul#sortable li.ui-state-highlight {
  border: 2px dashed #CCC; }

div.shadow .popup table.list {
  margin-bottom: 10px; }

div.shadow .popup table.list td,
div.shadow .popup table.list th {
  padding: 10px; }

div.shadow .popup table.list thead th {
  font-size: 12px; }

div.shadow .popup .note {
  margin-bottom: 20px; }

/* Ta bort ordertable om <796px */
@media only screen and (min-width: 796px) {
  .hide-desktop {
    display: none !important; }

  .order-table-flex [class*="delete"] span {
    display: block; } }
/* Responsiv XS */
@media only screen and (max-width: 795px) {
  .hide-mobile {
    display: none !important; }

  .list-table-dn {
    float: left;
    width: 100%;
    padding: 10px;
    border: 1px solid #CCC;
    background: #f7f7f7;
    margin: 10px 0; }

  .list-table-dn ul {
    padding: 0; }

  .list-table-dn ul li {
    list-style-type: none;
    width: auto; }

  .list-table-dn ul li:nth-child(odd) {
    padding-top: 7px; }

  .list-table-dn a {
    font-weight: bold; }

  .list-table-dn h3 {
    margin: 5px; }

  div.respxs {
    width: auto;
    float: none;
    margin: 0% 2%; }

  div.header.respxs {
    margin: 0; }

  div.list-table-dn li.buttons {
    padding-top: 5px; }

  div.list-table-dn li.buttons a.btn {
    background: #000;
    color: #FFF;
    border-color: #000; }

  div.list-table-dn li.buttons a.btn span {
    margin: 0; }

  div.list-content {
    display: none; }

  .showmore-btn {
    padding: 10px 20px;
    text-decoration: none;
    border: 0;
    text-transform: uppercase;
    background: #40494d;
    color: #FFF;
    font-weight: bold;
    cursor: pointer; }

  .icon-arrow-asc {
    display: none; }

  .icon-arrow-desc {
    display: none; }

  /* Table remake */
  table.flex-table {
    width: 100%;
    border-collapse: collapse; }

  table.flex-table tbody tr, table.flex-table tbody td {
    border: solid 1px #ccc;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0;
    padding: 0; }

  table.flex-table tbody tr {
    margin-bottom: 15px; }

  table.flex-table td {
    border: none;
    display: block;
    width: 100%;
    text-align: center; }

  body.order table.order-rows td {
    padding: 0 0 12px 0; }

  table.flex-table td[class*="sum"] {
    text-align: center !important; }

  table.flex-table td input:nth-of-type(1) {
    margin-top: 6px; }

  table.flex-table td textarea {
    margin: 10px 10px 0;
    width: 200px;
    height: 60px; }

  table.flex-table td input.description {
    margin-bottom: 6px; }

  table.flex-table td:nth-of-type(4),
  table.flex-table td:nth-of-type(5),
  table.flex-table td:nth-of-type(6),
  table.flex-table td:nth-of-type(7),
  table.flex-table td:nth-of-type(8),
  table.flex-table td:nth-of-type(9) {
    float: left;
    width: 33.333%; }

  tfoot.flex-table {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: 0; }

  tfoot.flex-table tr:first-of-type th:first-of-type {
    width: 100%; }

  tfoot.flex-table tr:first-of-type th:nth-of-type(2) {
    text-align: left !important; }

  tfoot.flex-table th {
    float: left;
    width: 50%;
    border: none;
    text-align: right; }

  tfoot.flex-table th:first-of-type {
    text-align: left !important; }

  tfoot.flex-table th:empty {
    display: none; }

  /* Ta bort table headers */
  table.flex-table thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px; }

  textarea {
    max-width: 100%; }

  /* Labels Customer section */
  tr.cust-table-flex td:nth-of-type(1):before {
    content: "Namn"; }

  tr.cust-table-flex td:nth-of-type(2):before {
    content: "Adress"; }

  tr.cust-table-flex td:nth-of-type(3):before {
    content: "Postnummer"; }

  tr.cust-table-flex td:nth-of-type(4):before {
    content: "Postort"; }

  tr.cust-table-flex td:nth-of-type(5):before {
    content: "Land"; }

  /* Labels Order section */
  tr.order-table-flex td:before {
    display: block;
    margin-bottom: 6px;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: bold;
    border-bottom: solid 1px #ccc;
    padding: 5px; }

  tr.order-table-flex [class*="save"]:before {
    content: ""; }

  tr.order-table-flex [class*="save"]:after {
    content: "Spara produkt";
    display: inline;
    color: black; }

  tr.order-table-flex td:nth-of-type(1):before {
    content: "Artikelnummer"; }

  tr.order-table-flex td:nth-of-type(2):before {
    content: "Beskrivning"; }

  tr.order-table-flex td:nth-of-type(3):before {
    content: "Notering"; }

  tr.order-table-flex td:nth-of-type(4):before {
    content: "Bredd"; }

  tr.order-table-flex td:nth-of-type(5):before {
    content: "Hojd"; }

  tr.order-table-flex td:nth-of-type(6):before {
    content: "Farg"; }

  tr.order-table-flex td:nth-of-type(7):before {
    content: "Antal"; }

  tr.order-table-flex td:nth-of-type(8):before {
    content: "Enhet"; }

  tr.order-table-flex td:nth-of-type(9):before {
    content: "Pris"; }

  tr.order-table-flex td:nth-of-type(10):before {
    content: "Summa"; }

  .order-table-flex td {
    background: #e6e6e6; }

  /* .order-table-flex td:nth-child(even) {background: lightgrey;} */ }
/* Ipad test */
@media only screen and (max-width: 1025px) {
  .flex-div {
    display: flex;
    flex-wrap: wrap; } }

/*# sourceMappingURL=style.css.map */