Uno-Dan

Untitled

Nov 27th, 2020
1,047
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @import url('styles/reset.css');
  2.  
  3. /*  
  4. Theme Name: MettaTea
  5. Theme URI:
  6. Author: Dan Huckson
  7. Author URI:
  8. Description: A custom theme for Lotto Draws.
  9. Version: 1.0
  10. License:  
  11. -------------------------------------------------------------- */
  12.  
  13. /*- TEMPORARY ----------------------------------------------------------------*/
  14.  
  15. nav.login {
  16.     padding: 0.5em 2em;
  17. }
  18. nav.login .logo {
  19.     float: left;
  20.     line-height: 2em;
  21. }
  22. nav.login ul {
  23.     float: right;
  24. }
  25. nav.login ul li {
  26.     line-height: 1.75em;
  27.     display: inline-block;
  28. }
  29. nav.login ul input {
  30.     line-height: 1.7em;
  31. }
  32. nav.login ul button {
  33.    
  34.     line-height: 1.8em;
  35. }
  36.  
  37. #branding {
  38.     font-family: 'Lato', sans-serif;
  39.     top: 0;
  40.     position: fixed;
  41.     font-family: 'Lato', sans-serif;
  42.     background: #ffffff;
  43. }
  44. #branding a {
  45.     color: #0c5971;
  46.     text-decoration: none;
  47.     display: inline-block;
  48.     margin: 0.4em 1em;
  49. }
  50. #branding h1 {
  51.     height: 100%;
  52.     border-right: solid 0.1em #0c5971;
  53.     font-size: 12pt;
  54. }
  55.  
  56. .logo a {
  57.     font-size: 18pt;
  58.     text-decoration: none;
  59.     color: #0c5971;
  60. }
  61. .site-description {
  62.     display: none;
  63. }
  64.  
  65. #sidebar {
  66.     width: 20%;
  67.     padding-left: 1em;
  68.     padding-bottom: 1em;
  69.     position:absolute;
  70.     background: #c9dce8;
  71.     border-right: solid 2px #0c5971;
  72.     border-bottom: solid 2px #0c5971;
  73. }
  74. #sidebar h2 {
  75.     color: #0c5971;
  76.     text-align: center;
  77.     padding: 0.5em 0;
  78. }
  79. #sidebar ul {
  80.     margin-top: 1.5em;
  81.     margin: 0.5em auto;
  82.     display: inline-block;
  83.     white-space: nowrap;
  84. }
  85. #sidebar ul li {
  86.     display: inline-block;
  87.     white-space: nowrap;
  88. }
  89. #sidebar button {
  90.     width: 5em;
  91.     color: #ffffff;  
  92.     border-color: #0c5971;  
  93.     background: #0c5971;
  94. }
  95. #sidebar section {
  96.     font-size: 10pt;
  97.     margin-right: 1em;
  98. }
  99. #sidebar section>div {
  100.     margin: 0 auto;
  101. }
  102. #sidebar section>.title {
  103.     background: #0c5971;
  104.     font-size: 1.5em;
  105. }
  106. #sidebar section>.title i {
  107.     float: right;
  108.     color: #ffffff;
  109.     margin: 0.3em;
  110. }
  111. #sidebar section>.title h2 {
  112.     color: #ffffff;
  113. }
  114. #sidebar .collapsible {
  115.     display: none;
  116.     border: solid 3px #0c5971;
  117.     background: #ffffff;
  118.     padding: 0 0.5em;
  119. }
  120. #sidebar>.title {
  121.     font-size: 1.5em;
  122.     padding: 0 0;
  123.     white-space: nowrap;
  124. }
  125. #sidebar>.title .menu {
  126.     color: #0c5971;
  127.     float: right;
  128.     padding: 0.5em 0;
  129.     display: inline-block;
  130.     margin-right: 0.5em;
  131. }
  132. .sidebar.wrap {
  133.     float:left;
  134.     overflow: hidden;
  135. }
  136.  
  137. .logo a:hover,
  138. #primary button:hover,
  139. #primary select:hover,
  140. #primary input[type=checkbox]:hover,
  141. #search_results tr:hover,
  142. #sidebar section>.title:hover
  143. #sidebar>.title .menu:hover {
  144.     cursor: pointer;
  145. }
  146.  
  147. .login h2 {
  148.     font-size: 22pt;
  149.     font-weight: 700;
  150.     float: left;
  151. }
  152. .login p {
  153.     float: left;
  154.     width:55%;
  155.     font-size: 16pt;
  156.     margin-top: 1em;
  157.     line-height: 1.25em;
  158.     margin-left: 2em;
  159. }
  160. .login figure {
  161.     padding-top: 4em;
  162.     float: right;
  163. }
  164.  
  165. /*- COMMON -------------------------------------------------------------------*/
  166. main:before,
  167. .clearfix:after,
  168. .form aside:after,
  169. .form section>.group:after,
  170. .row:after,
  171. nav.login:after,
  172. #reports_page .actions:after,
  173. #search_results .actions:after,
  174. #content .table.wrap>.actions ul:after,
  175. #primary:after {  
  176.     float: none;
  177.     clear: both;
  178.     height: 0px;
  179.     content: "";
  180.     display: block;
  181.     visibility: hidden;
  182. }
  183.  
  184. * {
  185.     font-size: 11pt;
  186.     font-weight: 400;
  187.     letter-spacing: 0.04em;
  188.     font-family: 'Lato', sans-serif;
  189. }
  190.  
  191. body {
  192.     min-width: 360px;
  193. }
  194. main {
  195.     width: 100%;
  196.     margin-top: 1.95em;
  197. }
  198. header {
  199. }
  200. footer {
  201.     color: #ffffff;
  202.     background: #0c5971;
  203.     padding: 0.75em;
  204.     font-family: 'Lato', sans-serif;
  205.     left: 0;
  206.     width: 100%;
  207.     bottom: 0;
  208.     position: fixed;
  209.     height: 1em;
  210. }
  211. article {
  212.     width: 80%;
  213.     margin: 0 auto;
  214. }
  215. button {
  216.     border-radius: 0.3em !important;
  217. }
  218. button.bs1 {
  219.     width: 5em;
  220.     color: #ffffff;  
  221.     border-color: #0c5971;  
  222.     background: #0c5971;
  223.     line-height: 1.75em;
  224. }
  225. button.bs2 {
  226.     line-height: 1.5em !important;
  227.     margin: 0 0.25em;
  228. }
  229. button.bs3 {
  230.     line-height: 1.2em !important;
  231.     margin: 0 0.25em;
  232.     font-size: 0.9em;
  233.     padding: 0.25em 0.5em;
  234. }
  235.  
  236. .the-content {
  237.     width: 100%;
  238.     background: #ffffff;
  239. }
  240.  
  241. table {
  242.     width: 100%;
  243.     background: #ffffff;
  244. }
  245. table th,
  246. table td {
  247.     padding: 0 1em;
  248.     letter-spacing: 0.06em;
  249. }
  250.  
  251. table tr th:last-child,
  252. table tr td:last-child {
  253.     width: 100%;
  254. }
  255.  
  256. table td {
  257.     text-align: left;
  258.     line-height: 2em;
  259.     border: solid 1px #0c5971;
  260.     white-space: nowrap;
  261. }
  262. table th {
  263.     color: #ffffff;
  264.     text-align: center;
  265.     line-height: 2em;
  266.     border-right: solid 1px #ffffff;
  267.     border-bottom: solid 1px #ffffff;
  268.     white-space: nowrap;
  269. }
  270. table th:last-child {
  271.     text-align: left;
  272. }
  273.  
  274. .table.wrap .scrollable {
  275.     max-width: 100%;
  276.     overflow: auto;
  277. }
  278. .table.wrap #bulk_action {
  279.     color: #ffffff;
  280.     height: 2em;
  281.     border: solid 0.2em #ffffff;
  282.     border-radius: 0.25em;
  283. }
  284. .table.wrap tfoot tr {
  285.     cursor: default !important;
  286.     color: #0c5971;
  287.     font-weight: 700;
  288.     background-color: #b4ffcd !important;
  289. }
  290.  
  291. #menu-primary-menu li {
  292.     display: inline-block;
  293.     padding-left:2em;
  294. }
  295.  
  296. #nav-primary {
  297.     left: 0;
  298.     width: 100%;
  299.     top: 0;
  300.     left: 9.5em;
  301.     position: fixed;
  302.     font-family: 'Lato', sans-serif;
  303.     background: #ffffff;
  304. }
  305. #nav-primary li {
  306.     display: inline-block;
  307. }
  308. #nav-primary a {
  309.     /*color: #0c5971;*/
  310.     text-decoration: none;
  311.     font-size: 12pt;
  312.     font-weight: 700;
  313.     letter-spacing: 0.05em;
  314.     display: inline-block;
  315.     padding: 0.4em 0.5em;
  316. }
  317. #nav-primary a:hover {
  318.     color: #ffffff;
  319.     /*background: #0c5971;*/
  320. }
  321.  
  322. /*- FORMS --------------------------------------------------------------------*/
  323. /*----------------------------------------------------------------------------*/
  324. /*- FORM COMMON --------------------------------------------------------------*/
  325.  
  326. .form {
  327.     position:absolute;
  328.     height: auto;
  329.     top: 50%;
  330.     left: 50%;
  331.     border: 3px solid #0c5971;
  332.     border-top: 3px solid #ffffff;
  333.     transform: translate(-50%, -50%);
  334.     display: none;
  335.     background: #c9dce8;
  336.     max-height: 100%;
  337.     z-index: 1000;
  338. }
  339. .form>.title {
  340.     width: 100%;
  341.     color: #ffffff;
  342.     font-size: 13pt;
  343.     text-align: center;
  344.     background: #0c5971;
  345. }
  346. .form>.title span {
  347.     color: #ffffff;
  348.     padding: 0.5em 0;
  349.     display: inline-block;
  350. }
  351.  
  352. .form hr {
  353.     margin-top: 1em;
  354.     border-color: #0c5971;
  355. }
  356.  
  357. .form i.view {
  358.     font-size: 1.25em;
  359.     margin-left: 0.25em;
  360. }
  361. .form ul {
  362.     float: right;
  363. }
  364. .form ul li {
  365.     display: inline-block;
  366.     white-space: nowrap;
  367. }
  368. .form ul li button {
  369.     width: 5em;
  370. }
  371.  
  372. .form label {
  373.     color: #0c5971;
  374.     width: auto;
  375.     font-weight: 700;
  376.     text-align: right;
  377.     margin-right: 0.5em;
  378.     display: inline-block;
  379. }
  380. .form button {
  381.     color: #ffffff;  
  382.     border-color: #0c5971;  
  383.     background: #0c5971;
  384.     border-radius: 0.5em !important;
  385. }
  386. .form button.add {
  387.     white-space: nowrap;
  388.     margin-left: 0.5em;
  389.     width: 5.5em;
  390. }
  391. .form button.view {
  392.     width: 5.5em;
  393. }
  394. .form aside {
  395.     font-weight: 700;
  396.     font-size: 1.1em;
  397.     padding: 0.5em;
  398.     background: #ffffff;
  399.     display: none;
  400. }
  401. .form aside i {
  402.     float: right;
  403.     cursor: pointer;
  404. }
  405. .form aside dd {
  406.     float: left;
  407. }
  408. .form aside dd span {
  409.     color: #107999;
  410. }
  411. .form aside.error {
  412.     color: #b52b2b;
  413.     border: solid 2px #b52b2b;
  414. }
  415. .form aside.success {
  416.     color: #4e8b52;
  417.     border:solid 2px #4e8b52;
  418. }
  419. .form aside.warning {
  420.     color: #b57022;
  421.     border:solid 2px #b57022;
  422. }
  423.  
  424. .form .actions {
  425.     margin-top: 0.5em;
  426. }
  427.  
  428. .form table tbody td:first-child {
  429.     text-align: right
  430. }
  431.  
  432. .form img.waiting {
  433.     display: none;    
  434.     position:absolute;
  435.     top:50%;
  436.     left:50%;
  437.     z-index: 1000;
  438. }
  439.  
  440. .form .field {
  441.     float: left;
  442.     margin-top: 0.75em;
  443. }
  444.  
  445. .form .field input:focus,
  446. .form .field select:focus,
  447. .form .field textarea:focus {
  448.     outline: none !important;
  449.     border-color: #0c5971;
  450.     box-shadow: 0 0 10px #0c5971;
  451. }
  452.  
  453. .form .field input {
  454.     color: #0c5971;
  455.     line-height: 1.5em;
  456.     border-radius: 0.25em !important;
  457.     border-color: #0c5971;
  458.     outline-color: #0c5971;
  459.     padding: 0 0.25em;
  460. }
  461. .form .field input[type=text], .form textarea, form select {
  462.     border: solid 2px #0c5971;
  463. }
  464.  
  465. .form .field select {
  466.     color: #0c5971;
  467.     border-color: #0c5971;  
  468.     outline-color: #0c5971;
  469.     padding: 0.2em 0.25em;
  470.     background: #ffffff;
  471.     border-radius: 0.25em !important;
  472. }
  473. .form .field select[name=location_id] {
  474.     max-width: 12em;
  475. }
  476. .form .field select[name=zone_id] {
  477.     max-width: 15em;
  478. }
  479.  
  480. .form .content {
  481.     width: 100%;
  482.     max-width: 58em;
  483.     max-height: 15em;
  484.     overflow: auto;
  485. }
  486.  
  487. .form .field.notes {
  488.     float: none;
  489.     clear: both;
  490.     width: 100%;
  491.     margin: 0;
  492.     margin-top: 1em;
  493. }
  494. .form .field.notes label {
  495.     width: 3em;
  496.     display: inline-block;
  497. }
  498. .form .field.notes textarea {
  499.     width: 99%;
  500.     max-width: 100%;
  501.     margin-top: 0.5em;
  502.     color: #0c5971;
  503.     line-height: 1.5em;
  504.     display: none;
  505.     overflow: auto;
  506. }
  507.  
  508. .form .field.contact input {
  509.     width: 15em;
  510. }
  511. .form .field.branch input {
  512.     width: 15em;
  513. }
  514. .form .field.customer input {
  515.     width: 15em;
  516. }
  517. .form .field.address input {
  518.     width: 28em;
  519. }
  520. .form .field.unit input {
  521.     width: 5em;
  522. }
  523. .form .field.postcode input {
  524.     width: 6em;
  525. }
  526.  
  527. .form form>section {
  528.     padding: 1em;
  529. }
  530.  
  531. .form .fa-eye {
  532.     color: #0c5971;
  533. }
  534. .form .fa-eye:hover {
  535.     cursor: pointer;
  536.     color: #14931d;
  537. }
  538.  
  539. .form .field.clear_form {
  540.     cursor: pointer;
  541.     float: right;
  542. }
  543.  
  544. .form .field.clear_form:hover {
  545.     cursor: pointer;
  546.     background: #ffffff;
  547. }
  548.  
  549. /*- FORM CONTACTS ------------------------------------------------------------*/
  550.  
  551. .form.contacts {
  552.     border: 3px solid #36213a;
  553.     background: #dddadd;
  554.     border-top-color: #ffffff;
  555. }
  556. .form.contacts>.title {
  557.     background: #36213a;
  558. }
  559.  
  560. .form.contacts label {
  561.     color: #36213a;
  562. }
  563. .form.contacts button {
  564.     background: #36213a;
  565.     border-color: #36213a;  
  566. }
  567. .form.contacts button:hover {
  568.     background: #5f3a66;
  569. }
  570.  
  571. .form.contacts .field input:focus,
  572. .form.contacts .field select:focus,
  573. .form.contacts .field textarea:focus {
  574.     border-color: #36213a;
  575.     box-shadow: 0 0 10px #36213a;
  576. }
  577.  
  578. .form.contacts .field select {
  579.     color: #36213a;
  580.     border-color: #36213a;  
  581.     outline-color: #36213a;
  582. }
  583. .form.contacts .field input {
  584.     color: #36213a;
  585.     border-color: #36213a;
  586.     outline-color: #36213a;
  587. }
  588. .form.contacts .field input[type=text], .form textarea, form select {
  589.     border: solid 2px #36213a;
  590. }
  591. .form.contacts .field textarea {
  592.     color: #36213a;
  593. }
  594.  
  595. .form.contacts .field input[type=text] {
  596.     width: 12em;
  597. }
  598. .form.contacts .field.email input {
  599.     width: 22em;
  600. }
  601. .form.contacts .field.email input {
  602.     width: 22em;
  603. }
  604. .form.contacts .field.address input {
  605.     width: 31.1em;
  606. }
  607. .form.contacts .field.postcode input {
  608.     width: 6em;
  609. }
  610. .form.contacts .field.unit input {
  611.     width: 6em;
  612. }
  613.  
  614. .form.contacts .group label {
  615.     margin-left: 0;
  616. }
  617. .form.contacts .group.row1 label {
  618.     width: 6em;
  619. }
  620.  
  621. .form.contacts label[for=last_name],
  622. .form.contacts label[for=email_address],
  623. .form.contacts label[for=phone2] {
  624.     margin-left: 1em;
  625. }
  626. .form.contacts label[for=zone_id],
  627. .form.contacts label[for=location_id],
  628. .form.contacts label[for=status_id] {
  629.     margin-left: 2em;
  630. }
  631. .form.contacts label[for=unit] {
  632.     margin-left: 1.6em;
  633. }
  634. .form.contacts label[for=country_id],
  635. .form.contacts label[for=address],
  636. .form.contacts label[for=postcode] {
  637.     width: 6em;
  638. }
  639.  
  640. .form.contacts #contact_roles {
  641.     clear: both;
  642.     display: block;
  643.     float: left;
  644.     margin-top: 0.75em;
  645. }
  646. .form.contacts #contact_roles li {
  647.     color: #36213a;
  648.     border-radius: 0.25em;
  649.     border: solid 2px #36213a;
  650.     padding: 0.25em;
  651.     background: #ffffff;
  652.     margin-left: 0.5em;
  653.     vertical-align: middle;
  654.     display: inline-block;
  655. }
  656.  
  657. .form.contacts hr {
  658.     border-color: #36213a;
  659. }
  660.  
  661. /*- FORM CUSTOMERS -----------------------------------------------------------*/
  662.  
  663. .form.customers {
  664.     background: #e0eaf3;
  665.     border-color: #083b4a;
  666.     border-top-color: #ffffff;
  667. }
  668. .form.customers hr {
  669.     border-color: #083b4a;
  670. }
  671. .form.customers button,
  672. .form.customers .title {
  673.     background: #083b4a;
  674. }
  675. .form.customers table thead th { background: #2e6371}
  676. .form.customers .title label {
  677.     color: #ffffff;
  678.     font-weight: 400;
  679. }
  680.  
  681. .form.customers button.add_branch {
  682.     display: none;
  683. }
  684. .form.customers button:hover {
  685.     background: #2f6473;
  686. }
  687.  
  688. .form.customers label {
  689.     color: #083b4a;
  690. }
  691.  
  692. .form.customers .field input:focus,
  693. .form.customers .field select:focus,
  694. .form.customers .field textarea:focus {
  695.     border-color: #083b4a;
  696.     box-shadow: 0 0 10px #083b4a;
  697. }
  698. .form.customers .field input {
  699.     color: #002f00;
  700.     border-color: #083b4a;
  701.     outline-color: #083b4a;
  702. }
  703. .form.customers input[type=text], textarea, select {
  704.     border: solid 2px #083b4a;
  705. }
  706.  
  707. .form.customers .field select {
  708.     color: #002f00;
  709.     border-color: #083b4a;  
  710.     outline-color: #083b4a;
  711. }
  712. .form.customers table tbody th {
  713.     background: red !important;
  714. }
  715. .form.customers table tbody td {
  716.     color: #002f00;
  717.     border: solid 1px #083b4a;
  718. }
  719.  
  720. .form.customers label[for=type_id],
  721. .form.customers label[for=status_id] {
  722.     margin-left: 2em;
  723. }
  724. .form.customers label[for=branches] {
  725.     margin-bottom: 1em;
  726. }
  727.  
  728. body.customers .wrapper .form .table.wrap table.branches th {
  729.     background: #2e6371;
  730. }
  731.  
  732. /*- FORM BRANCHES ------------------------------------------------------------*/
  733.  
  734. .form.branches {
  735.     background: #f1fff1;
  736.     border-color: #003a00;
  737.     border-top-color: #ffffff;
  738. }
  739. .form.branches hr {
  740.     border-color: #003a00;
  741. }
  742. .form.branches button,
  743. .form.branches .title {
  744.     background: #003a00;
  745. }
  746. .form.branches table thead th { background: #326d32}
  747. .form.branches .title label {
  748.     color: #ffffff;
  749.     font-weight: 400;
  750. }
  751.  
  752. .form.branches button:hover {
  753.     background: #006d00;
  754. }
  755.  
  756. .form.branches label {
  757.     color: #003a00;
  758. }
  759.  
  760. .form.branches .field input:focus,
  761. .form.branches .field select:focus,
  762. .form.branches .field textarea:focus {
  763.     border-color: #003a00;
  764.     box-shadow: 0 0 10px #003a00;
  765. }
  766. .form.branches .field input {
  767.     color: #002f00;
  768.     border-color: #003a00;
  769.     outline-color: #003a00;
  770. }
  771. .form.branches .field input[type=text], .form textarea, form select {
  772.     border: solid 2px #003a00;
  773. }
  774.  
  775. .form.branches .field select {
  776.     color: #002f00;
  777.     border-color: #003a00;  
  778.     outline-color: #003a00;
  779. }
  780. .form.branches table tbody th {
  781. }
  782. .form.branches table tbody td {
  783.     color: #002f00;
  784.     border: solid 1px #003a00;
  785. }
  786. .form.branches label[for=customer],
  787. .form.branches label[for=status_id] {
  788.     width: 5em;
  789. }
  790. .form.branches label[for=country_id],
  791. .form.branches label[for=address],
  792. .form.branches label[for=postcode] {
  793.     width: 6em;
  794. }
  795. .form.branches label[for=agent_id],
  796. .form.branches label[for=branch],
  797. .form.branches label[for=zone_id],
  798. .form.branches label[for=location_id],
  799. .form.branches label[for=unit]  {
  800.     margin-left: 2em;
  801. }
  802. .form.branches label[for=contacts] {
  803.     margin-bottom: 1em;
  804. }
  805.  
  806. .form.branches input[name=branch] {
  807.     width: 25em;
  808. }
  809.  
  810. /*- FORM ORDERS --------------------------------------------------------------*/
  811.  
  812. .form.orders {
  813.     background: #d1d1d1;
  814.     border-color: #262626;
  815.     border-top-color: #ffffff;
  816. }
  817. .form.orders hr {
  818.     border-color: #262626;
  819. }
  820. .form.orders button,
  821. .form.orders .title {
  822.     background: #262626;
  823. }
  824. .form.orders table thead th { background: #326d32}
  825. .form.orders .title label {
  826.     color: #ffffff;
  827.     font-weight: 400;
  828. }
  829. .form.orders label {
  830.     color: #262626;
  831. }
  832.  
  833. .form.orders .field input:focus,
  834. .form.orders .field select:focus,
  835. .form.orders .field textarea:focus {
  836.     border-color: #262626;
  837.     box-shadow: 0 0 10px #262626;
  838. }
  839.  
  840. .form.orders button {
  841.     border-color: #262626;
  842. }
  843. .form.orders input {
  844.     color: #004343;
  845.     border-color: #262626;
  846.     outline-color: #262626;
  847. }
  848. .form.orders input[type=text], textarea, select {
  849.     color: #262626 !important;
  850.     border: solid 2px #262626 !important;
  851. }
  852.  
  853. .form.orders table tbody td {
  854.     color: #262626;
  855.     border: solid 1px #262626;
  856. }
  857.  
  858. .form.orders .fa-eye {
  859.     color: #262626 !important;
  860. }
  861.  
  862.  
  863. .form.orders label[for=customers],
  864. .form.orders label[for=order_date],
  865. .form.orders label[for=order_number] {
  866.     width: 6em;
  867. }
  868.  
  869. .form.orders label[for=freight] {
  870.     width: 6.6em;
  871. }
  872.  
  873. .form.orders label[for=products],
  874. .form.orders label[for=quantity],
  875. .form.orders label[for=price] {
  876.     width: 5em;
  877. }
  878.  
  879. .form.orders label[for=branch] {
  880.     margin-left: 2.5em;
  881. }
  882. .form.orders label[for=discount],
  883. .form.orders label[for=ship_date],
  884. .form.orders label[for=bill_date],
  885. .form.orders label[for=order_fulfilled],
  886. .form.orders label[for=order_paid],
  887. .form.orders label[for=sales_tax],
  888. .form.orders label[for=total] {
  889.     margin-left: 2em;
  890. }
  891.  
  892. .form.orders label[for=order_paid],
  893. .form.orders label[for=order_fulfilled] {
  894.     padding-top: 0.35em;
  895. }
  896.  
  897. .form.orders input[type=date] {
  898.     width: 7em;
  899. }
  900. .form.orders input[type=checkbox] {
  901.     width: 1.1em !important;
  902.     height: 1.1em !important;
  903.     margin: 0;
  904.     padding: 0;
  905.     display: inline-block;
  906.     vertical-align: middle;
  907. }
  908.  
  909. .form.orders input[name=product] {
  910.     width: 16em;
  911. }
  912. .form.orders input[name=discount] {
  913.     width: 6em;
  914. }
  915. .form.orders input[name=sales_tax] {
  916.     width: 7em;
  917. }
  918. .form.orders input[name=branch] {
  919.     width: 24em;
  920. }
  921.  
  922. .form.orders tr.summary  {
  923.     color: #0c5971;
  924.     font-weight: 700;
  925.     background: #a6cfac !important;
  926.    
  927. }
  928.  
  929. .form.orders .field.order_number img {
  930.     float: right;
  931.     margin-left: 1em;
  932. }
  933.  
  934. /*- FORM PRODUCTS ------------------------------------------------------------*/
  935.  
  936. .form.products {
  937.     background: #f9ebe6;
  938.     border-color: #005454;
  939.     border-top-color: #ffffff;
  940. }
  941. .form.products hr {
  942.     border-color: #005454;
  943. }
  944. .form.products button,
  945. .form.products .title {
  946.     background: #005454;
  947. }
  948. .form.products table thead th { background: #326d32}
  949. .form.products .title label {
  950.     color: #ffffff;
  951.     font-weight: 400;
  952. }
  953. .form.products label {
  954.     color: #005454;
  955. }
  956.  
  957. .form.products .field input:focus,
  958. .form.products .field select:focus,
  959. .form.products .field textarea:focus {
  960.     border-color: #005454;
  961.     box-shadow: 0 0 10px #005454;
  962. }
  963.  
  964. .form.products button {
  965.     border-color: #005454;
  966. }
  967. .form.products input {
  968.     color: #004343;
  969.     border-color: #005454;
  970.     outline-color: #005454;
  971. }
  972. .form.products input[type=text], .form textarea, form select {
  973.     border: solid 2px #005454;
  974. }
  975.  
  976. .form.products table tbody td {
  977.     color: #002f00;
  978.     border: solid 1px #005454;
  979. }
  980.  
  981. .form.products input[name=unit_price],
  982. .form.products input[name=discount] {
  983.     width: 5.5em;
  984. }
  985. .form.products input[name=unit_type],
  986. .form.products input[name=unit_size],
  987. .form.products input[name=unit_weight] {
  988.     width: 6em;
  989. }
  990. .form.products input[name=units_on_order],
  991. .form.products input[name=quantity_per_unit] {
  992.     width: 11.25em;
  993. }
  994. .form.products input[name=units_in_stock],
  995. .form.products input[name=reorder_level] {
  996.     width: 11.25em;
  997. }
  998. .form.products label[for=unit_type],
  999. .form.products label[for=unit_size] {
  1000.     width: 5em;
  1001. }
  1002. .form.products label[for=unit_weight] {
  1003.     width: 7em;
  1004. }
  1005. .form.products label[for=unit_price],
  1006. .form.products label[for=discount] {
  1007.     width: 6.75em;
  1008. }
  1009.  
  1010.  
  1011. .form.products label {
  1012.     width: 9em;
  1013.     display: inline-block;
  1014.     text-align: right;
  1015.     font-weight: 700;
  1016.     margin-right: 0.5em;
  1017.    
  1018. }
  1019. .form.products label[for=name] {
  1020.     width: 3em;
  1021. }
  1022. .form.products input[name=name] {
  1023.     width: 16em;
  1024. }
  1025. .form.products label[for=description] {
  1026.     width: 7em;
  1027. }
  1028. .form.products input[name=description] {
  1029.     width: 24.75em;
  1030. }
  1031. .form.products label[for=notes] {
  1032.     width: auto;
  1033. }
  1034.  
  1035. .form.products .col.left {
  1036.     float: left;
  1037. }
  1038. .form.products .col.left .row>div:first-child label {
  1039.     width: 7em;
  1040. }
  1041. .form.products .col.right {
  1042.     float: right;
  1043. }
  1044.  
  1045. .form.products .col.right img {
  1046.     border: solid 1px #005454;
  1047.     width: 200px;
  1048.     height: 200px;
  1049.     border-color: #005454;
  1050.     box-shadow: 0 0 10px #005454;
  1051.     border-radius: 0.3em;
  1052. }
  1053.  
  1054. .form.products .row .field.add_image {
  1055.     float: none;
  1056.     width: 100%;
  1057. }
  1058. .form.products .row .field.add_image button {
  1059.     float: right;
  1060.     margin-top: 1em;
  1061. }
  1062. .form.products .field.description img {
  1063.     float: right;
  1064.     margin-left: 1em;
  1065. }
  1066.  
  1067. /*- FORM SEARCH RESULTS ------------------------------------------------------*/
  1068.  
  1069. .form.search_results {
  1070.     background: #0c5971;
  1071. }
  1072. .form.search_results section {
  1073.     padding: 0;
  1074. }
  1075. .form.search_results button {
  1076.     margin: 0.4em;
  1077. }
  1078. .form.search_results .actions {
  1079.     margin: 0;
  1080. }
  1081. .form.search_results .content {
  1082.     height: 20em;
  1083.     background: #ffffff;
  1084.     overflow: auto;
  1085.     border-bottom: solid 1px #0c5971;
  1086. }
  1087. .form.search_results .actions ul {
  1088.     width: 100%;
  1089.     background: #ffffff;
  1090. }
  1091. .form.search_results .actions li {
  1092.     display: inline-block;
  1093.     float: right;
  1094. }
  1095. .form.search_results .actions li:first-child {
  1096.     float: left;
  1097. }
  1098. .form.search_results .actions li:first-child button.bs1 {
  1099.     width: 7em;
  1100. }
  1101.  
  1102. /*- FORM CONFIRM -------------------------------------------------------------*/
  1103.  
  1104. .form.confirm {
  1105.     /*width: 50em;*/
  1106.     background: #fff5f5;
  1107.     border-color: #7a0002;
  1108.     border-top-color: #ffffff;
  1109. }
  1110. .form.confirm hr {
  1111.     border-color: #7a0002;
  1112. }
  1113. .form.confirm label[for=branches] {
  1114.     margin-top: 1em;
  1115.     color: #7a0002;
  1116. }
  1117. .form.confirm label[for=message] {
  1118.     color: #7a0002;
  1119. }
  1120. .form.confirm .title {
  1121.     font-weight: 700;
  1122.     letter-spacing: 0.2em;
  1123.     background: #7a0002;
  1124. }
  1125. .form.confirm label[for=contacts] {
  1126.     margin-top: 1em;
  1127.     color: #7a0002;
  1128. }
  1129. .form.confirm table {
  1130.     margin-top: 0.5em;
  1131. }
  1132. .form.confirm table th {
  1133.     background: #7a0002 !important;
  1134.    
  1135. }
  1136. .form.confirm table td {
  1137.     color: #1a0000;
  1138.     border-color: #7a0002;
  1139.    
  1140. }
  1141. .form.confirm button.delete,
  1142. .form.confirm button.cancel {
  1143.     background: #7a0002;
  1144.     border-color: #7a0002;
  1145. }
  1146.  
  1147.  
  1148. /*- PAGES --------------------------------------------------------------------*/
  1149. /*----------------------------------------------------------------------------*/
  1150. /*- PAGE COMMON --------------------------------------------------------------*/
  1151.  
  1152. table.page .fa-arrow-up,
  1153. table.page .fa-arrow-down {
  1154.     margin-left: 0.5em;
  1155.     padding-right: 100%;
  1156. }
  1157. table.page .fa-arrow-up {
  1158.     display: none;
  1159. }
  1160.  
  1161. table.page thead tr:last-child th,
  1162. table.page tbody tr:hover {
  1163.     cursor: pointer;
  1164. }
  1165.  
  1166. table.page th:last-child {
  1167.     border-right: none !important;
  1168. }
  1169.  
  1170. table.page td:first-child {
  1171.     text-align: right;
  1172.     max-width: 5em;
  1173. }
  1174. table.page td:last-child {
  1175.     border-right: none !important;
  1176. }
  1177.  
  1178. .actions.page {
  1179.     position: fixed;
  1180.     width: 100%;
  1181.     left: 0;
  1182.     top: 1.9em;
  1183.     padding-bottom: 1.5em;
  1184.     height: 4em;
  1185. }
  1186. .wrapper>section .table.wrap .scrollable {
  1187.     position: fixed;
  1188.     width: 100%;
  1189.     left: 0;
  1190.     top: 5em;
  1191.     overflow: auto;
  1192. }
  1193.  
  1194. #nav-primary li:nth-child(1):hover {
  1195.     background: #0c5971;
  1196. }
  1197. #nav-primary li:nth-child(2):hover {
  1198.     background: #36213a;
  1199. }
  1200. #nav-primary li:nth-child(3):hover {
  1201.     background: #083b4a;
  1202. }
  1203. #nav-primary li:nth-child(4):hover {
  1204.     background: #262626;
  1205. }
  1206. #nav-primary li:nth-child(5):hover {
  1207.     background: #005454;
  1208. }
  1209.  
  1210. #nav-primary a:hover,
  1211. #nav-primary .current-menu-item a {
  1212.     color: #ffffff !important;
  1213. }
  1214.  
  1215. .actions.page {
  1216.     background: #0d6079;
  1217.     line-height: 3em;
  1218.     padding: 0 1em;
  1219. }
  1220. .actions.page button {
  1221.     color: #ffffff;
  1222.     background: #0c5971;
  1223.     border: solid 0.1em #ffffff;
  1224. }
  1225.  
  1226. .actions.page li {
  1227.     float: left;
  1228. }
  1229. .actions.page li button {
  1230.     vertical-align: middle;
  1231. }
  1232. .actions.page li select {
  1233.     border-radius: 0.5em;
  1234.     font-size: 0.8em;
  1235.     padding: 0.5em;
  1236.     color: #0c5971;
  1237.     letter-spacing: 0.1em;
  1238.     border: solid 0.2em #107999;
  1239. }
  1240. .actions.page li select option {
  1241.     line-height: 2em;
  1242.     letter-spacing: 0.1em;
  1243. }
  1244. .actions.page li.search {
  1245.     float: right;
  1246.     padding-right: 2em;
  1247. }
  1248. .actions.page li.search input {
  1249.     height: 1.5em;
  1250.     width: 12em;
  1251.     padding: 0  0.3em 0.1em 0.3em;
  1252.     border-radius: 0.3em;
  1253.     border: solid 0.2em #107999;
  1254. }
  1255.  
  1256.  
  1257. /*- PAGE CONTACTS -----------------------------------------------------------*/
  1258.  
  1259. table.contacts.page th {
  1260.     background: #5e4863;
  1261. }
  1262. table.contacts.page td {
  1263.     color: #201423;
  1264. }
  1265.  
  1266. body.contacts #branding a {
  1267.     color: #36213a;
  1268. }
  1269.  
  1270. body.contacts #nav-primary a {
  1271.     color: #36213a;
  1272. }
  1273. body.contacts #nav-primary .current-menu-item {
  1274.     background: #36213a;
  1275. }
  1276.  
  1277. body.contacts .actions.page {
  1278.     background: #36213a;
  1279. }
  1280. body.contacts .actions.page li select {
  1281.     color: #201423;
  1282.     border: solid 0.2em #85518f;
  1283. }
  1284. body.contacts .actions.page li.search input {
  1285.     border: solid 0.2em #85518f;
  1286. }
  1287. body.contacts .actions.page button {
  1288.     background: #36213a;
  1289. }
  1290. body.contacts .actions.page button:hover {
  1291.     background: #5d3864 !important;
  1292. }
  1293.  
  1294. body.contacts footer {
  1295.     background: #36213a;
  1296. }
  1297.  
  1298. /*- PAGE CUSTOMERS -----------------------------------------------------------*/
  1299.  
  1300. table.customers.page th {
  1301.     background: #2e6371;
  1302. }
  1303. table.customers.page td {
  1304.     color: #062e39;
  1305. }
  1306.  
  1307. body.customers #branding a {
  1308.     color: #083b4a;
  1309. }
  1310.  
  1311. body.customers #nav-primary a {
  1312.     color: #083b4a;
  1313. }
  1314. body.customers #nav-primary .current-menu-item {
  1315.     background: #083b4a;
  1316. }
  1317.  
  1318. body.customers .actions.page {
  1319.     background: #083b4a;
  1320. }
  1321. body.customers .actions.page li select {
  1322.     color: #062e39;
  1323.     border: solid 0.2em #2f6473;
  1324. }
  1325. body.customers .actions.page li.search input {
  1326.     border: solid 0.2em #2f6473;
  1327. }
  1328. body.customers .actions.page button {
  1329.     background: #083b4a;
  1330. }
  1331. body.customers .actions.page button:hover {
  1332.     background: #2f6473 !important;
  1333. }
  1334.  
  1335. body.customers tr.details {
  1336.     display: none;
  1337.     background: #ffffff !important;
  1338.     padding: 0 !important;
  1339.     margin: 0 !important;
  1340. }
  1341. body.customers tr.details>td {
  1342.     padding: 0 !important;
  1343.     margin: 0 !important;
  1344. }
  1345.  
  1346. table.branches.page,
  1347. table.branches.page .table.wrap {
  1348.     display: none;
  1349. }
  1350. table.branches.page {
  1351.     border-bottom: solid 0.5em #326d32;
  1352. }
  1353. table.branches.page th {
  1354.     background: #326d32;
  1355. }
  1356.  
  1357. body.customers footer {
  1358.     background: #083b4a;
  1359. }
  1360.  
  1361. /*- PAGE ORDERS --------------------------------------------------------------*/
  1362.  
  1363. body.orders table.orders.page th {
  1364.     background: #474747;
  1365. }
  1366. body.orders table.orders.page td {
  1367.     color: #201423;
  1368. }
  1369.  
  1370. body.orders #branding a {
  1371.     color: #262626;
  1372. }
  1373. body.orders #nav-primary a {
  1374.     color: #262626;
  1375. }
  1376. body.orders #nav-primary .current-menu-item {
  1377.     background: #262626;
  1378. }
  1379.  
  1380. body.orders .actions.page {
  1381.     background: #262626;
  1382. }
  1383. body.orders .actions.page li select {
  1384.     color: #201423;
  1385.     border: solid 0.2em #474747;
  1386. }
  1387. body.orders .actions.page li.search input {
  1388.     border: solid 0.2em #474747;
  1389. }
  1390. body.orders .actions.page button {
  1391.     background: #262626;
  1392. }
  1393. body.orders .actions.page button:hover {
  1394.     background: #4c4c4c !important;
  1395. }
  1396.  
  1397. body.orders footer {
  1398.     background: #262626;
  1399. }
  1400.  
  1401. /*- PAGE PRODUCTS -----------------------------------------------------------*/
  1402.  
  1403. table.products.page th {
  1404.     background: #006f6f;
  1405. }
  1406. table.products.page td {
  1407.     color: #062e39;
  1408. }
  1409.  
  1410. body.products #branding a {
  1411.     color: #005454;
  1412. }
  1413.  
  1414. body.products #nav-primary a {
  1415.     color: #005454;
  1416. }
  1417. body.products #nav-primary .current-menu-item {
  1418.     background: #005454;
  1419. }
  1420.  
  1421. body.products .actions.page {
  1422.     background: #005454;
  1423. }
  1424. body.products .actions.page li select {
  1425.     color: #006f6f;
  1426.     border: solid 0.2em #006f6f;
  1427. }
  1428. body.products .actions.page li.search input {
  1429.     border: solid 0.2em #006f6f;
  1430. }
  1431. body.products .actions.page button {
  1432.     background: #005454;
  1433. }
  1434. body.products .actions.page button:hover {
  1435.     background: #006f6f !important;
  1436. }
  1437.  
  1438. body.products footer {
  1439.     background: #005454;
  1440. }
  1441.  
  1442. /*- PAGE REPORTS -------------------------------------------------------------*/
  1443.  
  1444.  
  1445. body.reports #nav-primary a {
  1446.     color: #0c5971;
  1447. }
  1448. body.reports #nav-primary .current-menu-item {
  1449.     background: #0c5971;
  1450. }
  1451.  
  1452. body.reports h2 {
  1453.     color: #ffffff;
  1454.     background: #0c5971;
  1455.     text-align: center;
  1456.     padding: 0.25em;
  1457. }
  1458.  
  1459. body.reports .title {
  1460.     font-size: 1.5em;
  1461.     position: fixed;
  1462.     width: 100%;
  1463.     left: 0;
  1464.     top: 1.3em;
  1465. }
  1466.  
  1467. #reports_page .sales.title h2 {
  1468.     font-size: 1.3em;
  1469. }
  1470.  
  1471. #reports_page .table.wrap>.actions {
  1472.     background: #ffffff;
  1473. }
  1474. #reports_page .actions {
  1475.     margin: 0.2em 0;
  1476. }
  1477. #reports_page .actions input {
  1478.     height: 1.2em;
  1479.     margin: 0.2em 0;
  1480. }
  1481. #reports_page .actions select {
  1482.     height: 1.6em;
  1483.     margin: 0.2em 0;
  1484. }
  1485.  
  1486. #reports_page .actions .field {
  1487.     float: left;
  1488. }
  1489. #reports_page .actions .field label {
  1490.     color: #0c5971;
  1491.     font-weight: 700;
  1492.     margin-left: 1em;
  1493. }
  1494. #reports_page .actions .field.do_report button {
  1495.     margin-top: 0.2em;
  1496.     margin-left: 1em;
  1497. }
  1498.  
  1499. #reports_page table.sales tr td:first-child {
  1500.     text-align: right;
  1501. }
  1502.  
  1503. #reports_page table.sales tr td:nth-child(5),
  1504. #reports_page table.sales tr td:nth-child(13),
  1505. #reports_page table.sales tr td:nth-child(14) {
  1506.     text-align: center;    
  1507. }
  1508.  
  1509. /*- PAGE REPORTS -------------------------------------------------------------*/
  1510.  
  1511. .wrapper>section>.title {
  1512.     position: fixed;
  1513.     width: 100%;
  1514.     left: 0;
  1515.     top: 1.3em;
  1516.     height: 4em;
  1517.    
  1518. }
  1519. .wrapper>section>.content {
  1520.     position: fixed;
  1521.     width: 100%;
  1522.     left: 0;
  1523.     top: 4.2em;
  1524.     overflow: auto;
  1525.     height: 85%;
  1526. }
RAW Paste Data