html * {
    margin: 0;
    /*padding: 0; SELECT NOT DISPLAYED CORRECTLY IN FIREFOX */
}

/* GENERAL */
/*
.spinner {
    padding: 5px;
    position: absolute;
    right: 0;
}
*/
.box-button { position:absolute;top:5px;right:5px; }
.box-status { padding: .5em; margin-right: 5px; }
.box-status.error,
.box-status.notice,
.box-status.success    { margin-bottom: 1em; border: 1px solid #ddd; }
.box-status.error      { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.box-status.notice     { background: #FFF6BF; color: #514721; border-color: #FFD324; }
.box-status.success    { background: #E6EFC2; color: #264409; border-color: #C6D880; }
.error a    { color: #8a1f11; }
.notice a   { color: #514721; }
.success a  { color: #264409; }
.highlight { font-weight: bold; background-color: #FBE3E4; }

/*.selected { color: #666; background-color: #fff2a8; border-left: 5px solid #a8d1ff;}*/
/*.unselected { color: #ccc;}*/
/*.unavailable { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4;}
.available { background: #E6EFC2; color: #264409; border-color: #C6D880; }*/
.unavailable { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4;}
.available { background: #a8d1ff; color: #264409; border-color: black; } /* border-color: #C6D880; */
.yui-gf .yui-u { margin-left:0px; width:75%; }

body {
    background: #fff;
    color: #333;
    /*font: 11px "lucida grande", verdana, arial, helvetica, sans-serif;*/
}
#grailsLogo {
    padding-left: 0px;
    margin:0;
}
#grailsAppName {
    font-size: 4em;
    font-weight: bold;
    font-family: 'verdana';
    letter-spacing: -1px;
    padding-left: 0px;
    vertical-align: middle;
}

a:link, a:visited, a:hover {
    color: #666;
    /*font-weight: bold;*/
    /*font-size: 0.9em;*/ /* removed because it's distracting */
    /*text-decoration: underline;*/
    text-decoration: none;	    /* removed because we do not want to see underline */
}
a:hover {
    text-decoration: underline;
}

a.button:link,a.button:visited {
    color:#333;
}
a.button:hover {
    color: white;
}

a.disabled {
    pointer-events: none;
    cursor: default;
}


h1 {
    font-weight: normal;
    font-size: 16px;
    /*margin: .8em 0 .3em 0;*/
}

/*
ul {
    padding-left: 5px;
}*/

input, select, textarea, button {
    /*
    background-color: #fcfcfc;
    border: 1px solid #ccc;
    font: 11px "lucida grande", verdana, arial, helvetica, sans-serif;
    */
    margin: 2px 0;
    padding: 2px 4px;
}

select {
    padding: 2px 2px 2px 0;
}
textarea {
    /*
    width: 250px;
    height: 150px;*/
    vertical-align: top;
}

input:focus, select:focus, textarea:focus {
    /*border: 1px solid #b2d1ff;*/
    /* Causing buttons to change background color ?? when in focus  */
}

.body {
    /*float: left;*/
    margin: 0px 0px 0px 0px;
}

/* NAVIGATION MENU */

.nav {
    /*background: #fff url(uTUm9I58SlusFJDWXBGYq8YFmK3UM53xLTLdEooTjVi.jpg) bottom repeat-x;*/
    background-color: #eee;
    border: 1px solid #ccc;
    border-style: solid none solid none;
    margin-top: 5px;
    padding: 7px 12px;
}


.linkButton {
    color: #333;
    padding: 10px 5px;
}
.linkButton a {
    padding: 2px 3px;
    padding-left: 20px;
}


.linkButton a.home {
    background: url(XZxwq2CdhKQxLth7CqP7LcbI3LaYjCwJKkxHLHDpe0x.png) center left no-repeat;
}
.linkButton a.list {
    background: url(I6P0esXy2qS3beZUBGfFXAxZYaM0hjVZ0zwBaaNTiR8.png) center left no-repeat;
}
.linkButton a.create {
    background: url(V6lM9VtbWbu4xVIRmbEy9b9fLKlnbnjkdqYpgr9UUla.png) center left no-repeat;
}

.linkButton a.ALL {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.NEW {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.OPEN {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.FULFILLED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.CANCELED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}

.linkButton a.order-status-PENDING {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.order-status-PLACED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.order-status-RECEIVED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}

.linkButton a.request-status-NEW {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-REQUESTED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-PENDING {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-PICKED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-OPEN {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-FULFILLED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-CANCELED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-PLACED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-RECEIVED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.request-status-SHIPPED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.shipment-status-PENDING {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.shipment-status-SHIPPED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.shipment-status-RECEIVED {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}


.linkButton a.report_low {
    background: url(j3TFbX1jH8NFFC0VSVgQXOrdmXlceCsdNRjoea0exkF.png) center left no-repeat;
}
.linkButton a.report_reorder {
    background: url(jE2ivMcsnsq0BRyPKVvZWYQpneRiLTrezNZE6iHVbNq.png) center left no-repeat;
}
.linkButton a.report_expiring {
    background: url(gm5Ic9u3AWo4N6OVRDE6hT22pom3sihCdr5zkBjqkXk.png) center left no-repeat;
}
.linkButton a.report_expired {
    background: url(HFFlY55D8Ul98STMpmoxqXV7hSLzDwXrClUGzm2zRf7.png) center left no-repeat;
}
.linkButton a.report_consumption {
    background: url(bJblM1ZLNE1xFHpfKskB8VBO0F9UoyiBs6WWOYY1Ztp.png) center left no-repeat;
}
.linkButton a.report_transactions {
    background: url(bYOnF8BVoJJVcUSQbcjxvXxhDDHiGflixk6c4OYwZEv.png) center left no-repeat;
}
.linkButton a.report_shipping {
    background: url(29xZZKk4B1ft5Qy1tDhKB3KJvMHD5lwXJV0sz7xO5wn.png) center left no-repeat;
}
.linkButton a.report_inventory {
    background: url(mwV2tjLUbRwVggZ3gYNnQNT64uecHreQWNV5WFwJgYw.png) center left no-repeat;
}
.linkButton a.settings {
    background: url(BBLDQGXivrT7cIJNWe3MpuUP4ykB7YW74eVdDqEu8SE.png) center left no-repeat;
}
.linkButton a.supported {
    background: url(cDNMc1YXm24kZHoH934s3xsfX9fEkUmSfCVwrNiW5Ls.png) center left no-repeat;
}
.linkButton a.formulary {
    background: url(LlcdY3s3DJpsl0ngs7DuF7F07A3SVb4KqTu3Ms0iPxT.png) center left no-repeat;
}
.linkButton a.stocked {
    background: url(xWWYZB4sQS4LMzX46KiTtksSW70ssC5x870lfkWLG8y.png) center left no-repeat;
}
.linkButton a.notSupported {
    background: url(94jOnnPuH8m8F4nuWnGyt9D1Oc3OX73DQg9l9jozhha.png) center left no-repeat;
}


/* MESSAGES AND ERRORS */

.message {
    background: #f3f8fc url(5r7Rwd8PayLGhpjX1Cu8uUF6AB9prDYFb0MemFibdy.png) 8px 50% no-repeat;
    border: 1px solid #b2d1ff;
    color: #006dba;
    margin: 5px 0 5px 0;
    padding: 5px 5px 5px 30px
}

div.errors {
    background: #fff3f3;
    border: 1px solid red;
    color: #cc0000;
    margin: 10px 0 5px 0;
    padding: 5px 0 5px 0;
}

div.errors ul {
    list-style: none;
    padding: 0;
}
div.errors li {
    background: url(X2My6nLGuGXO73LuKEeTYWgyGjihrVLVBKfMfLY17mq.png) 8px 0% no-repeat;
    line-height: 16px;
    padding-left: 30px;
}

td.errors select {
    border: 1px solid red;
}
td.errors input {
    border: 1px solid red;
}

/* TABLES */

table {
    /*border: 1px solid #ccc;*/		/* jmiranda: removed because it's annoying to have to disable the border */
    width: 100%;
}
tr {
    border: 0;
}
td, th {
    font: 11px "lucida grande", verdana, arial, helvetica, sans-serif;
    line-height: 12px;
    padding: 6px 6px;
    text-align: left;
    vertical-align: top;
}
th {
    /*background: #fff url(uTUm9I58SlusFJDWXBGYq8YFmK3UM53xLTLdEooTjVi.jpg);*/
    color: #666;
    font-size: 11px;
    font-weight: bold;
    line-height: 17px;
    padding: 2px 6px;
    border-top: 1px solid #f2f2f2;
}
th a:link, th a:visited, th a:hover {
    color: #333;
    display: block;
    font-size: 10px;
    text-decoration: none;
}
th.asc a, th.desc a {
    background-position: right;
    background-repeat: no-repeat;
}
th.asc a {
    background-image: url(RXl7rSoN1AVnxXlZT2CrwXA7PXpoSw226yjB1A1N2HZ.gif);
}
th.desc a {
    background-image: url(f3V8fyTt1I004HCWmfaK3dijJYB1pRuaCoNtuCWfmZt.gif);
}

.odd {
    background: #f7f7f7;
}
.even {
    background: #fff;
}

/* LIST */

.list table {
    border-collapse: collapse;
}
.list th, .list td {
    /*border-left: 1px solid #ddd;*/
}
.list tbody tr:hover {
    background: #b2d1ff;
}

.list tbody tr.none:hover {
    background: none;
}
.list tbody tr.unhighlight:hover {
    background: none;
}



/* PAGINATION */

.paginateButtons {
    background: #fff url(uTUm9I58SlusFJDWXBGYq8YFmK3UM53xLTLdEooTjVi.jpg) bottom repeat-x;
    border: 1px solid #ccc;
    border-top: 0;
    color: #666;
    font-size: 10px;
    overflow: hidden;
    padding: 10px 3px;
}
.paginateButtons a {
    background: #fff;
    border: 1px solid #ccc;
    border-color: #ccc #aaa #aaa #ccc;
    color: #666;
    margin: 0 3px;
    padding: 2px 6px;
}
.paginateButtons span {
    padding: 2px 3px;
}

/* DIALOG */

.dialog table {
    padding: 5px 0;
}

.prop {
    padding: 5px;
}
.prop .name {
    text-align: left;
    width: 25%;
    /*white-space: nowrap;*/ /* it makes the sidebar tables look really bad */
}
.prop .value {
    text-align: left;
    width: 75%;
}
/* allows table to be flush with its parent table cell */
.prop .table {
    padding: 0px;
}

/* ACTION BUTTONS

.buttons {
    background: #fff url(uTUm9I58SlusFJDWXBGYq8YFmK3UM53xLTLdEooTjVi.jpg) bottom repeat-x;
    border: 1px solid #ccc;
    color: #666;
    font-size: 10px;
    margin-top: 0px;
    overflow: hidden;
    padding: 0;
}

.buttons input {
    background: #fff;
    border: 0;
    color: #333;
    cursor: pointer;
    font-size: 10px;
    font-weight: bold;
    margin-left: 3px;
    overflow: visible;
    padding: 2px 6px;
}
.buttons input.delete {
    background: transparent url(ss6KmFAHwuHg1DyNPDkahZ1ZiycD7T96evRysdmaiEm.png) 5px 50% no-repeat;
    padding-left: 28px;
}
.buttons input.edit {
    background: transparent url(El0e01veMPBnf1OAeE8CxbYtoSWHtdzL7sWbN0u6SRa.png) 5px 50% no-repeat;
    padding-left: 28px;
}
.buttons input.save {
    background: transparent url(9jLQuJhY3Jlq4wV1AeE2l5sWVWUENNWa9XdeTwXJjrB.png) 5px 50% no-repeat;
    padding-left: 28px;
}
*/

/* more menu button icons */
.menuButton {
    padding-left: 0px;
}
.menuButton a {
    padding-left: 15px;
}
.linkButton a.alert {
    background: url(RkUSw1CEXilY07B3ecjLn4ZINzMRE60FxzUCQltgY9j.png) center left no-repeat;
}
.linkButton a.error {
    background: url(qE961wN2DUmgBw1bJS7LG5Zpa9rw02QLsRdt8Uv8jE.png) center left no-repeat;
}
.linkButton a.email {
    background: url(OXnMAzrdG8XVirxtV5MRxaZVuGAKhGLoTBbHPG36FbI.png) center left no-repeat;
}
.linkButton a.settings {
    background: url(usAszNsywmPD0yN9BWLuWd65vPfpNdSFHMJ7xVaNNje.png) center left no-repeat;
}
.linkButton a.shipment {
    background: url(29xZZKk4B1ft5Qy1tDhKB3KJvMHD5lwXJV0sz7xO5wn.png) center left no-repeat;
}
.linkButton a.drugRoute {
    background: url(yYfV9pJlhSD11pTphcIQm8H0FE5SYWGy7lFTA1VWuqa.png) center left no-repeat;
}
.linkButton a.drugClass {
    background: url(LlcdY3s3DJpsl0ngs7DuF7F07A3SVb4KqTu3Ms0iPxT.png) center left no-repeat;
}
.linkButton a.warehouse {
    background: url(vOL8lhh2uPpgl7pupKBONSWiKkxElibMh9C21rvQE2L.png) center left no-repeat;
}
.linkButton a.site {
    background: url(Dxv4dGT70fJb3whNLKp0FVRzkE5bIwTfSZXvLYjqvh7.png) center left no-repeat;
}
.linkButton a.location {
    background: url(vOL8lhh2uPpgl7pupKBONSWiKkxElibMh9C21rvQE2L.png) center left no-repeat;
}
.linkButton a.locationType {
    background: url(heEsbT5vtqx8Jg7HdsRr4P8l0yulekdzzDN2Wnqt0y8.png) center left no-repeat;
}
.linkButton a.inventory {
    background: url(T3C6n8XyrC4bhT55baOVsxu1XJWLHDPCoQrUBT6YC22.png) center left no-repeat;
}
.linkButton a.eventType {
    background: url(5HyZiU1xgJgSchuu1AKoUkatCQZoQzNI49W3fpCJEMp.png) center left no-repeat;
}
.linkButton a.import {
    background: url(TNcdLtKU7FojXXZMKyHtU2QayJi4K8DC0y1epCca3sH.png) center left no-repeat;
}
.linkButton a.menu {
    background: url(moVSM9y9DkONqJKGrEQmSvA7e2pVszKCoQTv6cMoZe8.png) center left no-repeat;
}
.linkButton a.account {
    background: url(YvjvLJlJaDhBK5Q1R59rvuAvvnhYCJUrMVgQai472PB.png) center left no-repeat;
}
.linkButton a.main {
    background: url(YvjvLJlJaDhBK5Q1R59rvuAvvnhYCJUrMVgQai472PB.png) center left no-repeat;
}
.linkButton a.auth {
    background: url(YvjvLJlJaDhBK5Q1R59rvuAvvnhYCJUrMVgQai472PB.png) center left no-repeat;
}
.linkButton a.user {
    background: url(jyUuPo65V6fZ5KthAcmuylPmqLeNBIzkSYEjO5m9MNq.png) center left no-repeat;
}
.linkButton a.role {
    background: url(2jrvJq3F7BA1S3LVZAMLrZFXmvQ51FmFSiRbDbYl0Ew.png) center left no-repeat;
}
.linkButton a.admins {
    background: url(JCQePKUEwW5g2Li2wtKD5D5W88ZJdiylp8dVBcB86y0.png) center left no-repeat;
}
.linkButton a.group {
    background: url(pL6ExQGZuEzSXG3uGQcx9uf2UJ4N43XY2PiAISSxd2Q.png) center left no-repeat;
}
.linkButton a.people {
    background: url(pL6ExQGZuEzSXG3uGQcx9uf2UJ4N43XY2PiAISSxd2Q.png) center left no-repeat;
}

.linkButton a.admin {
    background: url(iTnZDnbCnFqaPYu6ORyEnic9z6Vx4eKNKajhpiXLhw.png) center left no-repeat;
}
.linkButton a.transaction {
    background: url(YvjvLJlJaDhBK5Q1R59rvuAvvnhYCJUrMVgQai472PB.png) center left no-repeat;
}
.linkButton a.stockCard {
    background: url(T3C6n8XyrC4bhT55baOVsxu1XJWLHDPCoQrUBT6YC22.png) center left no-repeat;
}
.linkButton a.recordInventory {
    background: url(Tc29MJYoNEgS0vyhPoxPBD04uQfSluQpZ6AfBfLKmqK.png) center left no-repeat;
}
.linkButton a.country {
    background: url(Dxv4dGT70fJb3whNLKp0FVRzkE5bIwTfSZXvLYjqvh7.png) center left no-repeat;
}
.linkButton a.inventorylineitem {
    background: url(resource:/images/icons/package.png) center left no-repeat;
}
.linkButton a.product {
    background: url(mwV2tjLUbRwVggZ3gYNnQNT64uecHreQWNV5WFwJgYw.png) center left no-repeat;
}
.linkButton a.order {
    background: url(NCTghFpVMIkEmz7ACnIlWK4lUVyCCT0PshjTm6Sz1X4.png) center left no-repeat;
}
.linkButton a.transactionentry {
    background: url(NCTghFpVMIkEmz7ACnIlWK4lUVyCCT0PshjTm6Sz1X4.png) center left no-repeat;
}
.linkButton a.documentupload {
    background: url(YvjvLJlJaDhBK5Q1R59rvuAvvnhYCJUrMVgQai472PB.png) center left no-repeat;
}
.linkButton a.building {
    background: url(vOL8lhh2uPpgl7pupKBONSWiKkxElibMh9C21rvQE2L.png) center left no-repeat;
}
.linkButton a.shipper {
    background: url(29xZZKk4B1ft5Qy1tDhKB3KJvMHD5lwXJV0sz7xO5wn.png) center left no-repeat;
}
.linkButton a.shipperService {
    background: url(Dxv4dGT70fJb3whNLKp0FVRzkE5bIwTfSZXvLYjqvh7.png) center left no-repeat;
}
.linkButton a.browse {
    background: url(XjpWqwlLOSlj4qcuAZ0lo2Mq1V2IvojqYBEJb4A4EHt.png) center left no-repeat;
}
.linkButton a.dashboard {
    background: url(xz5qUzext9LdYPSZ9JIRwWNec355bQVqwRfc0n56Jpm.png) center left no-repeat;
}
.linkButton a.metadata {
    background: url(LZZARVOajRQjCKOZjyafSrFVwjKl3mN34WSrWQSd7HQ.png) center left no-repeat;
}
.linkButton a.bullet {
    background: url(O4p1wvQC9MzYYxSRRe3yI1JtgW0HfejgxJBcRuZGKcp.png) center left no-repeat;
}
.linkButton a.invalid {
    background: url(ZR0j6KJ2vurnMa0ZXR6qYbnGd5eMplH8ZyfxF3qVoVB.png) center left no-repeat;
}
.linkButton a.new {
    background: url(V6lM9VtbWbu4xVIRmbEy9b9fLKlnbnjkdqYpgr9UUla.png) center left no-repeat;
}
.linkButton a.edit {
    background: url(H8K9Mqc6vA37r1XIWzlsyDyANZxDOb69JAUP9xhxLjw.png) center left no-repeat;
}
.linkButton a.browse {
    background: url(q5cGNhpLZ2uo2unVW6sn4FI2N8jjlsVXLPxyFPB2Cd1.png) center left no-repeat;
}
.linkButton a.view {
    background: url(q5cGNhpLZ2uo2unVW6sn4FI2N8jjlsVXLPxyFPB2Cd1.png) center left no-repeat;
}
.linkButton a.delete {
    background: url(ZkvUw6b7PrI8Pma3KmlIB2A1CSEDHmmf0sJQq3h9vSf.png) center left no-repeat;
}
.linkButton a.trash {
    background: url(3DaPXkn9vLJUM08GGGFNJARzMJ7jt9UCIRriUYsZKeF.png) center left no-repeat;
}
.linkButton a.export {
    background: url(Ui8s2m53tM71bQAgehM9P2s3GrJ09mufsEgcO6LsJQn.png) center left no-repeat;
}
.linkButton a.indent {
    background: url(yaLXZ6lS1YNzeZrqtXF8znwOPoZblk2xlMaq6IMqrS7.gif) center left no-repeat;
}

/* FORMS
-------------------------------------------------------------- */

/* --------------------------------------------------------------

   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms

   Usage:
   * For text fields, use class .large or .text

-------------------------------------------------------------- */


label       { font-weight: normal; white-space: nowrap; }
fieldset    { padding:0em; margin: 0 0 .2em 0; border: 2px solid lightgrey; }
legend      { font-weight: normal; font-size:1.2em;  margin-left: 10px; margin-right: 10px; }
/*
legend span {
	position: absolute;
	margin-top: -1em;
}*/

/* Form fields
-------------------------------------------------------------- */

input[type=text],
input[type=password],
input.text, input.large,
textarea, select {
    background-color:#fff;
    border:1px solid #bbb;
}
input[type=text]:focus,
input[type=password]:focus,
input.text:focus, input.large:focus, span.large:focus,
textarea:focus, select:focus {
    border-color:#666;
}

input[type=text],
input[type=password],
input.text, input.large, span.large,
textarea, select {
    margin:0;
}


textarea, input.large {
    width: 100%;
}


/*
input[type=submit] {
	background-color: #ccc;
	height: 200px;
}*/

input.text, input.large, span.large   { padding:5px; }
textarea      { padding:5px; }

input[type=checkbox], input[type=radio],
input.checkbox, input.radio {
    position:relative; top:.25em;
}

input[readonly="readonly"] {
    background-color: lightgrey;
}

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


/* Success, notice and error boxes
-------------------------------------------------------------- */

.error,
.notice,
.success    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }
.error      { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.notice     { background: #FFF6BF; color: #514721; border-color: #FFD324; }
.success    { background: #E6EFC2; color: #264409; border-color: #C6D880; }
.error a    { color: #8a1f11; }
.notice a   { color: #514721; }
.success a  { color: #264409; }



/* BUTTONS
-------------------------------------------------------------- */

/*
select, input, textarea {
	-moz-border-radius: 1px;
	border-radius: 1px;
	-moz-box-shadow: 5px 5px 5px #ccc;
  	-webkit-box-shadow: 5px 5px 5px #ccc;
  	box-shadow: 5px 5px 5px #ccc;
}
*/


/* FOOTER
-------------------------------------------------------------- */

/* Fix for footer creep
----------------------------------------------------------*/




/* WIZARD
-------------------------------------------------------------- */

/* = STEPS CONTAINER
----------------------------*/
.wizard-steps {
    margin:0px 10px 0px 10px;
    padding:0px;
    position: relative;
    clear:both;
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bold;
}
.wizard-steps div {
    position:relative;
}
/* = STEP NUMBERS
----------------------------*/
.wizard-steps span {
    display: block;
    float: left;
    font-size: 10px;
    text-align:center;
    width:15px;
    margin: 2px 5px 0px 0px;
    line-height:15px;
    color: #ccc;
    background: #FFF;
    border: 2px solid #CCC;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px;
}
/* = DEFAULT STEPS
----------------------------*/
.wizard-steps a {
    position:relative;
    display:block;
    width:auto;
    height:24px;
    margin-right: 18px;
    padding:0px 10px 0px 10px;
    float: left;
    font-size:11px;
    line-height:24px;
    color:#666;
    background: #F0EEE3;
    text-decoration:none;
    text-shadow:1px 1px 1px rgba(255,255,255, 0.8);
}
.wizard-steps a:before {
    width:0px;
    height:0px;
    border-top: 12px solid #F0EEE3;
    border-bottom: 12px solid #F0EEE3;
    border-left:12px solid transparent;
    position: absolute;
    content: "";
    top: 0px;
    left: -12px;
}
.wizard-steps a:after {
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left:12px solid #F0EEE3;
    position: absolute;
    content: "";
    top: 0px;
    right: -12px;
}

/* = COMPLETED STEPS
----------------------------*/

.wizard-steps .completed-step a {
    color:#163038;
    background: #A3C1C9;
}
.wizard-steps .completed-step a:before {
    border-top: 12px solid #A3C1C9;
    border-bottom: 12px solid #A3C1C9;
}
.wizard-steps .completed-step a:after {
    border-left: 12px solid #A3C1C9;
}
.wizard-steps .completed-step span {
    border: 2px solid #163038;
    color: #163038;
    text-shadow:none;
}
/* = ACTIVE STEPS
----------------------------*/
.wizard-steps .active-step a {
    color:#A3C1C9;
    background: #163038;
    text-shadow:1px 1px 1px rgba(0,0,0, 0.8);
}
.wizard-steps .active-step a:before {
    border-top: 12px solid #163038;
    border-bottom: 12px solid #163038;
}
.wizard-steps .active-step a:after {
    border-left: 12px solid #163038;
}
.wizard-steps .active-step span {
    color: #163038;
    -webkit-box-shadow:0px 0px 2px rgba(0,0,0, 0.8);
    -moz-box-shadow:0px 0px 2px rgba(0,0,0, 0.8);
    box-shadow:0px 0px 2px rgba(0,0,0, 0.8);
    text-shadow:none;
    border: 2px solid #A3C1C9;
}
/* = HOVER STATES
----------------------------*/
.wizard-steps .completed-step:hover a, .wizard-steps .active-step:hover a {
    color:#fff;
    background: #8F061E;
    text-shadow:1px 1px 1px rgba(0,0,0, 0.8);
}
.wizard-steps .completed-step:hover span, .wizard-steps .active-step:hover span {
    color:#8F061E;
}
.wizard-steps .completed-step:hover a:before, .wizard-steps .active-step:hover a:before {
    border-top: 12px solid #8F061E;
    border-bottom: 12px solid #8F061E;
}
.wizard-steps .completed-step:hover a:after, .wizard-steps .active-step:hover a:after {
    border-left: 12px solid #8F061E;
}


/* Custom css
-------------------------------------------------------------*/
/* used to remove the 10px margin that yui adds by default */
#doc3 {
    margin:auto;
}
label.error {
    display: block;
}
.hidden {
    display: none;
}
.ui-state-highlight {
    font-weight: bold;
    color: black;
}
.ui-datepicker-trigger {
    position: relative; left: -16px; top: -1px;
}
.buttons {
    padding-top: 10px;
    /*border-top: 3px solid lightgrey;*/
    text-align: center;
    padding: 10px;
}

button.action-btn, button.previous, button.next {

}

.sorthandle {
    background-image:url(nxyonQ8Q0NBUTUGw19OylvFoCRPNKt3jern1FOWmP4N.png);
    cursor:move;
    display:inline-block;
    height:100%;
    margin-bottom:-6px;
    min-height:24px;
    width:8px;
}



.button {
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 2px;
    margin: 5px;
    border: 1px solid #aaa;
}
.category-selector {
    padding: 1px;

}

.action-btn {

}
#banner {
    padding: 0px;
}
.black-top {
    border-top: 3px solid lightgrey;
}
.capitalize {
    text-transform: capitalize;
}
.uppercase {
    text-transform: uppercase;
}

.red {
    background-color: red;
    color: white;
    height: 2em;
}
.blue {
    background-color: blue;
    color: white;
    height: 2em;
}

/*
.edit {
    background-image: url('/openboxes/images/icons/silk/pencil.png') no-repeat right center;
}
*/
.box {
    border: 1px solid lightgrey;
    margin: 5px;
    background-color: #fcfcfc;
    padding: 0px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.box-barcode, .box-status {
    padding:5px;
    border: 1px solid lightgrey;
    margin: 0px;
    background-color: #fcfcfc;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.box-white {
    border: 1px solid lightgrey;
    margin: 1px;
    background-color: white;
    padding: 7px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.box-slim {
    border: 1px solid lightgrey;
    margin: 5px;
    padding: 10px;
    background-color: #f5f5f5;
    text-align:center;
}

.wizard-box {
    border: 0px solid lightgrey;
    margin: 1px;
    background-color: white;
    padding: 7px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    height: 25px;
}


.padded {
    padding: 25px;
}
.smpad {
    padding: 5px;
}

.hidden {
    display: none;
}

.total {
    /*background-color: #f7f7f7;*/
}
.start {
    border-right: 3px solid lightgrey;
}
.end {
    border-left: 3px solid lightgrey;
}
.border-right {
    border-right: 1px solid lightgrey;
}
.border-left {
    border-left: 1px solid lightgrey;
}
.border-top {
    border-top: 1px solid lightgrey;
}

.credit { color: green; }
.debit {
    color: red;
}
.discrepancy { color:red; }
.debit:before {
    content: '(';
}
.debit:after {
    content: ')';
}

.transaction-type-debit { }
.transaction-type-credit { }


.nowrap {
    white-space: nowrap;
}

/* Action Menu Items */
.actions .action-menu-info a:hover {
    cursor: pointer;
}
.actions .action-menu-item {
    border: 0px solid black;
    margin: 0px;
    padding: 0px;
}
.actions .action-menu-item a {
    display: block;
    padding: 5px;
    font-weight: normal;
    color: #666;
    font-size: 0.9em;
    font: 11px "lucida grande", verdana, arial, helvetica, sans-serif;
    line-height: 12px;
    text-align: left;
}
.actions .action-menu-item a:hover {
    display: block;
    background-color: lightgrey;
    padding: 5px;
    text-decoration: none;
}

.megaButton a,
.megaButton a:visited {
    text-decoration: none;
    padding: 10px;
    display: block;
    color: #333;
}

.megaButton:hover {
    background-color: lightgrey;
}


.mm-content-base { padding: 0px; margin: 0px; }

/* Flow Header */
.currentState { font-weight: bold; background-color: #eee; color: blue; }
.circle {
    display:inline;
    padding-left:4px;
    padding-right:4px;
    color: white;
    background: lightgrey;
    -moz-border-radius:100px;
    -webkit-border-radius:100px;
}
.count {
    display: block;
    float: left;
    font-size: 10px;
    font-weight: bold;
    text-align:center;
    width:25px;
    margin: 2px 5px 0px 0px;
    line-height:25px;
    color: #ccc;
    background: #FFF;
    border: 2px solid #CCC;
    -webkit-border-radius:20px;
    -moz-border-radius:20px;
    border-radius:20px;
}
.count.active {
    background-color: #f3961c;
    color: white;
}


.circle a {
    font-size:9px;
    text-decoration:none;
    color: white;
    position:relative; top:-2px;
}
.currentState > .circle { background-color: blue; }
.currentState > .circle a { font-weight: bold; }

.numberCircle {
    -webkit-border-radius: 999px;
    -moz-border-radius: 999px;
    border-radius: 999px;
    width: 12px;
    height: 12px;
    padding: 4px;
    background: lightyellow;
    border: 1px solid #666;
    color: #666;
    text-align: center;

    font: 10px Arial, sans-serif
}


/* Product Details box */
/*#product-details-box { width: 260px;}*/
.summary {
    padding: 5px 5px 5px 5px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #aaa;
}
.summary-actions {
    padding: 1px;

}

#product-details-box span.name {   }
#product-details-box span.value { font-size: 1.0em; }
#product-details-box span.name:after { content:":" }
#product-details-box th { color: lightgrey; }
#product-details-box fieldset table td { padding: 6px; }
.product-details { height: 45px; line-height: 2px; }
/*
.product-details .label { width: 80px; }

.product-details .value { width: 150px; }
*/
.product-details .button { width: 20px; }
/* Text Alignment classes */
.right { text-align: right; }
.left { text-align: left; }
.center { text-align: center; }

/* Vertical Alignment classes */
.top { vertical-align: top; }
.bottom { vertical-align: bottom; }
.middle { vertical-align: middle; }

/* temporarily hide the nav bar until we figure out whether we want to keep it or not */
.nav { display: none; }

li.ui-menu-item { text-align: left; font-weight: bold; }
h3 {
    color: #666;
    font-size: 1.2em;
    vertical-align: middle;
    padding: 5px 0px 2px;
    margin: 0px;
    margin-bottom: 5px;
    /*color: #008000;*//*green */
}
h3.ui-state-active { background-color: #f7f7f7; }  /* #F8F7EF */

.body {
    /*margin-right: 5px;*/
    /*padding: 0px 0 10px 0;*/

}

/* Added to fix an issue with being able to select actions from the action menu at the bottom of pages */
/* Fixed the action menu (when menu runs off page). */

body {
    text-align: left;
    padding-bottom: 50px;
    font-family: "Lucida Grande", arial, verdana;
}


#content {
    /*padding: 5px 35px 5px 5px;*/
    padding: 0px;
}

#dashboard {
    margin: 0px;
}
#productDetails {
    width: 250px;
}
.actionsMenu {
    text-align: left;
    padding: 5px;
}
.actionsMenu a {
    padding-left: 2px;
}
.actionsMenu ul li {
    display: inline;
    padding-right: 15px;
}

.widget-large { border: 1px solid lightgrey; margin: 5px; }
.widget-small { border: 1px solid lightgrey;  margin: 5px; }
.widget-header { background-color: #FFF; margin: 1px; font-weight: bold; font-size: 110%;}
.widget-content { margin: 5px; }
.widget-content tr { height: 30px; }
.widget-content td,th { vertical-align: middle; }
img {
    vertical-align: middle;
}

a:hover {
    /*font-weight: bold;*/

}
.fade {
    color: #aaa;
}
.empty {
    line-height: 100px;
    color: #aaa;
}

#chooseLocation {
    width: 800px;
    position: absolute;
    top: 100px;
    left: 50%;
    margin-left: -400px;
}
#chooseLocationSelect {
    max-height: 400px;
    overflow: auto;
    margin-bottom: 5px
}

#loginForm {
    width:500px;
    position: absolute;
    top: 20%;
    left: 50%;
    margin-left: -250px;
}

#loginContainer {
    margin: 50px auto;
    width: 640px;
}

#loginFormBox {
    border: 1px solid lightgrey;
    padding: 20px;
}

.loginField {
    font-weight: bold;

}

#signupForm {
    width:700px;
    position: absolute;
    top: 5%;
    left: 50%;
    margin-left: -350px;
}


label, input, td, th {
    /*font-size: 10pt;*/
}

th {
    border-top: 0px;
    border-bottom: 3px solid lightgrey;
    /*background-color: white;*/
}

th.no-border-bottom {
    border-bottom: 0px;
}

tfoot th, tfoot td {
    border-top: 2px solid lightgrey;
    border-bottom: 0px;
}


.toggle-button {
    cursor: hand;
}
.toggleable {
    display: none;
}


/* Shipment summary add padding around To/From addresses */
#summary td {
    padding: 15px;
}

.tab {
    padding: 15px;
}
.tabOuter {

    background-color: #eee;
}

/* IMPORTANT: not sure why this works, but mis-aligns the menu */


table.withoutBorder {
    border: 0px solid #ccc;
    width: 100%
}

table.container {
    width: 100%;
}

table#listOutgoing {
    border: 0px;
}

table#listOutgoing td {
    border: 0px;
}

table#listOutgoing th {
}

table.small {
    /*width: 0%;*/
    display: inline;

}


.five {
    width: 5%;
}
.tenth {
    width: 10%;
}
.quarter {
    width: 25%;
}
.full {
    width: 100%;
}
.right {
    text-align: right;
}
.left {
    text-align: left;
}
.center {
    text-align: center;
}

.dialog td {
    padding: 10px;
}

.small {
    font-size:.7em;
}

.large {
    font-size:1.1em;
}

.menu {
    padding: 0px;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    border-top: 1px solid #eee;
}
.menu .menu-heading {
    font-size: 1.25em;
    line-height: 2em;
    vertical-align: middle;
    padding: 0px 0px 2px 25px;
    display: block;
    background-color: #fafafa /*#F8F7EF*/;
}
.menu .menu-subheading {
    vertical-align: middle;
    padding: 2px 0px 2px 15px;
    display: block;
    font-weight: bold;
}
.menu .menu-section {
    padding-top: 5px;
    padding-right: 0px;
    padding-bottom: 0px;
}
.menu .menu-section ul {
    padding-top: 0px;
    padding-bottom: 5px;
}
input.button {
    /*vertical-align: middle;*/
    /*border: 0px;*/
    /*margin: 0px;*/
}

.menu .menu-section ul li {
    /*display: block;
   padding: 0px 0px 2px 0px;
    cursor: pointer;*/
}
.menu .menuSection a {
    font-weight: normal;
    text-decoration: none;
}
.menu .menuSection a:hover {
    text-decoration: underline;
    font-weight: normal;
}
.menu .menuSection a:visited {
    text-decoration: none;
    font-weight: normal;
}
.ui-widget-content a {
    color: #666;
}
.ui-widget-content a:hover {
    text-decoration: underline;
}

.nav {
    margin: 0px;
    margin-bottom: 1px;
    padding: 10px;
    background-color: #F7F7F7;
}
.buttonBar {
    background-color: white;
    padding: 10px;
    text-align: left;
}

.button-bar {
    background-color: white;
    padding: 10px;
    text-align: left;
}

#resultSummary {
    font-size: 9pt;
}
label {
    margin-right: 10px;
    color: #666;
    font-weight: bold;
}
label.required {
    color: red;
}
label.optional {
    color: #AAA;
}
label.clear {
    display: block;
}

/* TODO figure out what this was meant for */
h2 {
    top: 0;
    position: relative;
    padding-left: 10px;
    font-size: 15px;
    font-weight: 400;
    color: #555;
    line-height: 18px;
    text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.5);




    position: relative;
    height: 40px;
    line-height: 40px;
    background: #E9E9E9;
    background: -moz-linear-gradient(top, #fafafa 0%, #e9e9e9 100%);
    /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fafafa), color-stop(100%, #e9e9e9));
    /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top, #fafafa 0%, #e9e9e9 100%);
    /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top, #fafafa 0%, #e9e9e9 100%);
    /* Opera11.10+ */

    background: -ms-linear-gradient(top, #fafafa 0%, #e9e9e9 100%);
    /* IE10+ */

    background: linear-gradient(top, #fafafa 0%, #e9e9e9 100%);
    /* W3C */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#FAFAFA', endColorstr='#E9E9E9')";
    border: 1px solid #D5D5D5;

    -webkit-background-clip: padding-box;
}


.category-header {
    font-size: 1.2em;
    text-align: left;
    background-color: #f7f7f7;
    border-top: 1px solid lightgrey;
    vertical-align: middle;
}


/*
tr.hasRelated {
	border-top: 4px solid #E5ECF9;
	border-left: 4px solid #E5ECF9;
	border-right: 4px solid #E5ECF9;
	border-bottom:4px solid #E5ECF9;
}
*/

tr.hideRelated {
}

tr.showRelated {
    background-color: #E5ECF9;
    border-top: 4px solid #E5ECF9;
    border-left: 4px solid #E5ECF9;
    border-right: 4px solid #E5ECF9;
    border-bottom:4px solid #E5ECF9;
}

tr.hideRelated td { }
tr.showRelated td { font-weight: bold;}


tr.expanded {
    background-color: #E5ECF9;
}

tr.isRelated {
    border-left: 4px solid #E5ECF9;
    border-right: 4px solid #E5ECF9;
}


tr.lastRelated {
    border-bottom-color:#E5ECF9;
    border-bottom-style:solid;
    border-bottom-width:4px;
}



h4 {
    font-size: 1.2em;
    padding: 10px;
}

/*
h2 {
	margin-top: 10px;
	margin-bottom: 5px;
	font-size: 1.2em;
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	background-color: #EBF1F7;
	font-size: 135%;
	line-height: 2;
	padding: 0 0 0 10px;
}
*/

/*
.chzn-select, .chzn-select-deselect { width: 95%; }
*/
.chzn-container {
    width: 100% !important;
}
.logo {
    font-size: 2em;
    font-weight: bold;
    line-height: 30px;
    font-family: "Trebuchet MS",Trebuchet,Calibri,Tahoma,Segoe;
}
.logo a, .logo a:hover, .logo a:visited {
    color: #666;
    text-decoration:none;
    vertical-align:middle;
}


.title {
    font-size: 1.5em;
    line-height: 1.6em;
    font-weight: bold;
    color: #666;
}

.buttons {
    margin-top: 1px;
}

/* TODO figure out if we need to keep this */
#pageBody {
    margin-left: 280px;
    margin-right: 20px;
    padding: 1px;
}

#pageTitle {
    /*border-top: 1px solid lightgrey;
    background-color: #f0f0f0;
    background-color: #525D76;*/
    border-bottom: 1px dotted #525D76;
    /*margin-bottom: 10px;

    padding: 5px;
    color: white;
    */
}

.page-header {
    margin: 10px 0px 0px 25px;
    vertical-align: middle;

}

.page-actions {
    vertical-align: middle;
    float: left;
    width: 55px;
}

.page-title {
    margin-left: 15px;
}


.section {
    /*
    padding-left: 10px;
    padding-bottom: 10px; */
}



/* stole from blueprint screen.css */
hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:.1em;margin:0 0 0em 0em;border:none;}
hr.space {background:#fff;color:#fff;}


/* Login information in banner
-------------------------------------------------------------*/
/* 	NOTE: I cannot get the login info to move down to the "bottom",
	so I was using absolute positioning at one point (might be gone now)  */

#hd {
    vertical-align: bottom;
    padding: 5px;
    margin: 0px;
    /*
    border-bottom: 1px solid lightgrey;
    background-color: white;
    */
}


ul.treeList {
    list-style-type: square;
}
ul.treeList li ul li {
    padding-left: 15px;
}

#loggedIn {
    text-align: right;
    margin: 0px;
    font-size: 1.2em;
    border: 0px solid #000;
    /*padding: 5px 10px 10px 15px;*/
}


#loggedIn ul {
    list-style:none;
    margin: 0;
    padding: 0;
}
#loggedIn ul li  {
    display: inline;
    margin: 0 0px;
}

.pageTitle {
    margin:  10px 0 0 15px;
}

/* breadcrumb
-------------------------------------------------------------*/
.breadcrumb {
    font: 11px Arial, Helvetica, sans-serif;
    background-image:url('rWXE5Hmpih3aq4xaWWU8iwy7kXf9gczwukfjsn0UzKP.png');
    background-repeat:repeat-x;
    height:30px;
    line-height:30px;
    color:#9b9b9b;
    border-bottom:solid 1px #cacaca;
    width:100%;
    overflow:hidden;
    margin:0px;
    padding:0px;
}

.breadcrumb li {
    list-style-type:none;
    float:left;
    padding-left:10px;
}

.breadcrumb a {
    height:30px;
    display:block;
    background-image:url('RcwsgNi9mIi5t67p6a9GR9QgffdVK6zEBByoV6WKjXY.png');
    background-repeat:no-repeat;
    background-position:right;
    padding-right: 15px;
    text-decoration: none;
    color:#454545;
}

.home {
    border: none;
    margin: 8px 0px;
}

.breadcrumb a:hover {
    /*color:#35acc5;*/
    text-decoration: underline;
}


/* Bubble with an isoceles triangle
------------------------------------------ */

.triangle-isosceles {
    position:relative;
    padding:15px;
    margin:1em 0 3em;
    color:#000;
    background:#f3961c;

    /* css3 */
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
    background:-moz-linear-gradient(top, #f9d835, #f3961c);
    background:linear-gradient(top, #f9d835, #f3961c);
}

/* creates triangle */
.triangle-isosceles:after {
    content:"";
    display:block; /* reduce the damage in FF3.0 */
    position:absolute;
    bottom:-15px;
    left:50px;
    width:0;
    border-width:15px 15px 0;
    border-style:solid;
    border-color:#f3961c transparent;
}

/* megamenu
-------------------------------------------------------------*/
.megamenu a:hover {

}

ul.megamenu a.mm-item-link:link, ul.megamenu a.mm-item-link:visited {
    padding: 7px 15px;
}

ul.megamenu {
    padding: 0;
    margin: 0;
}





/* not sure if these are needed any longer, so we should look into getting rid of these
-------------------------------------------------------------*/
/*
#footer {
    position:absolute;
    vertical-align: middle;
    border-top: 1px solid #aaa;
    bottom: 0px;
    margin-top: 150px;
    padding-top: 5px;
    width:100%;
    text-align: center;
    height: 30px;
    background: #fff;
}
*/
#footer {
    position: relative;
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 12px;
    line-height: 1.5;
    color: #777;
    border-top: 1px solid #eee;
}

#header {
    vertical-align: middle;
    padding: 2px;

}




/*
-------------------------------------------------------------*/

div.message {
    /*font-size: 125%*/
}

div.errors {
    margin: 10px 0 5px 0;
    padding: 5px 0 5px 0;
    /*font-size: 125%*/
}



div#dashboard li {
    margin-top: 10px;
}


.listcontainer {
    margin-bottom: 1em;
    /*overflow: hidden;*/

}

.list {
    list-style-type: none;
    /*
    margin: 10px;
    padding: 10px;*/
}

.list li {
    border-left: 1px solid #000;
    float: left;
    padding: 5px 10px 5px 10px;
    /*margin: 0 .5em 0 -.5em;*/
    /*padding: 0 .75em 0 .75em;*/
}

.list li.first {
    border-left: 0px;
}

/*
.list .active {
    font-weight: bold;
    background-color: #ccc;
}
*/
.list li {
    background-color: #eee;
}

.prop-multi {
    padding-left: 100px;
}

.prop {
    border-top: 1px dotted #ccc;
}

.prop .first {
    border-top: 0px;
}

.prop .name {
    width: 25%;
    background-color: #F7F7F7;
    text-align: right;
}

.prop .label {
    width: 45%;
}

.label label:after {
    content: ':';
}

.prop .value {
    text-align:left;
    /*width: 30%;*/
    background-color: white;
    vertical-align: top;
    line-height: 1.5em;
}
.active	{ color: green; }
.inactive { color: red; }

label { display: inline; text-decoration: none;}
label.block { display: block;}
fieldset .prop { margin: 10px; }
.radio { padding-left: 10px; }
.progressbar { width: 250px; height: 20px; }
#progressbar {  padding: 10px; margin: 10px; }
#progressbar .step { border: 1px solid #aaa; background-color: whitesmoke; padding: 10px;}
#progressbar .caption { width: 50px; margin: 0 auto; }​
.step.selected { font-weight: bold; text-decoration: underline; background-color: #f7f7f7 /*#F8F7EF*/; }
span.right { float: left; }
span.left { width: 10%;  float: left; text-align: center; }

.actions { cursor: pointer; position: absolute; z-index:999; background-color: #f5f5f5; border: 1px solid lightgrey; padding: 0px; display: none; min-width: 200px; }
.action-menu { cursor: pointer; }
.action-menu { padding: 0; }
.action-menu-root { margin: 0px; }
.action-menu-item { margin: 0px; padding: 3px; }

.document-list-item { margin: 1px; }

.details { cursor: pointer; position: absolute; z-index:999; background-color: white; border: 1px solid lightgrey; padding: 10px; display: none; }

.selected {
    font-weight: bold;
}
select{ padding: 3px; }
.tabSelected {
    text-align: center;
    background-color: white;
    border: 1px solid black;
    border-bottom: hidden;
}
.tabDefault {
    text-align: center;
    background-color: #f0f0f0;
    border: 1px solid black;
    border-bottom: 1px solid black;
    border-top: 1px solid black;
    border-right: 1px solid black;
    border-left: 1px solid black;
}
.tabSpacer {
    width: 3px;
    border-top: 0px;
    border-bottom: 1px solid black;
}

.verticalTabSelected {
    text-align: left;
    background-color: white;
    border: 1px solid #CCC;
}

.verticalTabDefault {
    text-align: left;
    background-color: #f7f7f7;
    border: 1px solid #CCC;
}

.data td, .data th {
    vertical-align: middle;
}
.data th {
    border: 0px;
}
.categoryBreadcrumb {
    font-weight: bold;
    padding: 10px;
    text-align: left;
}
.clear-all {
    padding: 5px;
    margin-left: 20px;
}

.filterRow {
    font-size: 13px;
    padding: 5px;
    margin: 5px;
    white-space:nowrap;
    background-color: #F7F7F7; /*#D8D8D8*/
}
.filterTab {
    border: 1px solid lightgrey;
    padding: 5px;
    margin-left:5px;
}

.filterTab a {
    padding: 0 2px 0 2px;
    margin: 0px;
}


.paddingRow {
    padding:2px;
    border-top:none; border-right:none; border-left:none;
    background-color:white;
}
.filterSelected {
    background-color:white;
    border-bottom:none;
}
.checked {
    background-color: #FFCC66;
}
.checkbox {
    border: 1px solid black;
}
.scrollTable {
    border-collapse:collapse;
}
.searchable {
    font-size: 16px;

}

img.photo {
    width: 36px;
    height: 36px;
}
img.photo_medium {
    width: 6em;
    height: 7.5em;
}
img.photo_small {
    width: 4em;
    height: 5em;
}

img.photo_tiny {
    width: 16px;
    height: 16px;
}

.readonly {
    color: grey;
}

.template-image {
    text-align: center
}

.template-name {
    text-align: center;
    font-size: 13px;
}


.template-form div {
    padding: 5px;
}

.template-form label {
    display: inline-block;
    width: 150px;
    text-align: right;
}

/* =============================================================================
   jquery tabs
   ========================================================================== */

/**
 * jquery tabs

.ui-tabs { position: relative; padding: .2em; zoom: 1; }
.ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; }
.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; }
.ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; }
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; }
.ui-tabs .ui-tabs-hide { display: none !important; }
.ui-tabs .ui-tabs-panel { padding: 0; }

 */

.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 0em 0em; background: none; }

#transactionLogTabs {
    background: transparent;
    border: none;
}
#transactionLogTabs > .ui-widget-header {
    background: transparent;
    border: none;
    border-bottom: 1px solid #c0c0c0;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}
/*
#transactionLogTabs .ui-state-default {
	background: transparent;
	border: none;
}
#transactionLogTabs .ui-state-active {
	background: transparent url(cQ2UOpDWFJpeuZwlFV80Ddnr5RzK3GpISpmryOYA3xp.png) no-repeat bottom center;
	border: none;
}
*/
.tabs .ui-state-default a {
    color: #c0c0c0;
}
.tabs .ui-state-active a {
    color: #459E00;
}

.tabs {
    background: transparent;
    border: none;
}


.tabs > .ui-widget-header {
    background: transparent;
    border: none;
    border-bottom: 1px solid #c0c0c0;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}


/*
.tabs .ui-state-default {
	background: transparent;
	border: none;
}
.tabs .ui-state-active {
	background: transparent url(cQ2UOpDWFJpeuZwlFV80Ddnr5RzK3GpISpmryOYA3xp.png) no-repeat bottom center;
	border: none;
}
*/
.tabs .ui-state-default a {
    color: #c0c0c0;
}
.tabs .ui-state-active a {
    color: #459E00;

}

.tabs .list, .tabs .tableScroll {
    border-bottom: 1px solid lightgrey;

}

/* Image in Text Box */
.globalSearch {
    vertical-align: middle;
    background:#FFFFFF url(q5cGNhpLZ2uo2unVW6sn4FI2N8jjlsVXLPxyFPB2Cd1.png) no-repeat 5px 5px;
    padding:4px 4px 4px 24px;
    border:1px solid #CCCCCC;
    font-size: 16px;
    border: 1px solid #ccc;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    width: 400px;
}

.tag {
    border: 1px solid #a5d24a;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    display: block;
    float: left;
    padding: 5px;
    white-space: nowrap;
    text-wrap:none;
    text-decoration:none;
    background: #cde69c;
    color: #638421;
    margin-right: 5px;
    margin-bottom:5px;
    font-family: helvetica;
    font-size:13px;
}
.tag a { font-weight: normal; color: #82ad2b; text-decoration:none; font-size: 11px; text-wrap: none; }
.tag-danger { color: #a94442; background-color: #f2dede; border-color: #ebccd1; }
.tag-success { color: #3c763d; background-color: #dff0d8; border-color: #d6e9c6; }
.tag-info { color: #31708f; background-color: #d9edf7; border-color: #bce8f1; }
.tag-warning { color: #8a6d3b; background-color: #fcf8e3; border-color: #faebcc; }



/*span.lotNumber { 1px solid #a5d24a; -moz-border-radius:2px; -webkit-border-radius:2px; display: block; color: black; font-weight: bold; margin-right: 5px; margin-bottom:5px;font-family: helvetica;  font-size:13px; }*/
.lotNumber { font-family: "Courier New"; vertical-align: middle; text-transform: uppercase; }
.binLocation { font-family: "Courier New"; vertical-align: middle; text-transform: uppercase; }
.barcode { font-family: "Courier New"; vertical-align: middle; text-transform: uppercase; letter-spacing: .1em; font-weight: normal; font-size: 11px; line-height: 20px}
.barcode-data { text-align: center; }
.genericName { text-transform: uppercase; }
#more { background-color: #ddd; padding: 10px; }

/*generic float*/
div.left{
    float: left;
}
div.right{
    float: right;
}
div.clear {
    clear: both;
}

/* =============================================================================
    jquery ui customization
   ========================================================================== */

.ui-buttonset { margin: 7px; }
.ui-buttonset .ui-button { margin-left: 1px; margin-right: -.3px; padding-left: 5px; padding-right: 5px; }


/* =============================================================================
   requisition.css
   ========================================================================== */

#requisition-header{
    /*padding: 0.5em;
    margin-left: 0.5em;
    margin-bottom: 2.0em*/
}

#requisition-header .title {
    font-size: 1.5em;
    font-weight: bold;
    line-height: 1em;
    float: left;
}

#requisition-header .status, #requisition-header .time-stamp{
    float: right;
    font-size: 1.0em;
    margin-left: 1.5em;
}

.ui-autocomplete { position: absolute; cursor: default;z-index:9999 !important;}

/*requisition item search auto complete*/
.ui-autocomplete span.product-group{
    font-style: italic;
}

.list-header {
    padding-left: 10px;

}


.ui_datepicker{
    background-image: url(5HyZiU1xgJgSchuu1AKoUkatCQZoQzNI49W3fpCJEMp.png);
    background-repeat: no-repeat;
    background-position: right;
}



/*fix ui-validation error message styling issue*/
.ui-validation label.error{
    display: inline;
    color: #EA5200;
    border: 0px;
    background: url(X2My6nLGuGXO73LuKEeTYWgyGjihrVLVBKfMfLY17mq.png) no-repeat center left;
    padding-left: 16px;
    padding-bottom: 2px;
    padding-top: 2px;
    font-weight: bold;
}

.ui-validation-items label.error{
    display: block;
}

.ui-validation input.error, .ui-validation  select.error{
    padding: 2px;
    background-color: white;
    border: 2px solid #EA5200;
}


/*process requisition item */
.ui-accordion .ui-accordion-content { padding: 0; margin: 0; }
.accordion-header {
    padding: 10px;
    background: #FCFCFC;
    color: #1C94C4;
}

.accordion-header.ui-state-active {
    background: #0099FF;
    color: white;
}


.accordion-header .row-index {
    width: 5%;
    float: left;
}

.accordion-header .product-name {
    width: 25%;
    float: left;
}



.accordion-header .status {
    width: 25%;
    float: right;
}

.accordion-header .quantity {
    width: 15%;
    float: left;
}

.accordion-header .quantityPicked {
    width: 15%;
    float: left;
}

.accordion-header .quantityRemaining {
    width: 15%;
    float: left;
}

/*
.requisition-status {
    width: 16px;
    height: 16px;
}
*/

.substitution {
    width: 16px;
    height: 16px;
}
.substitution.ok {
    background: url(zRPw2yt008IEq91FJIy7p3cJzgmcEIIvNQjn3Y0nUf8.png) no-repeat;
}


.requisition-status.Complete {
    background: url(ZMWFDDyrNZySNns3T12WYw4zOrhzbst3TzFTBN1Gx8w.png) no-repeat;
}

.requisition-status.Incomplete {
    background: url(u2cUV0nB2O2dmA59CjBPykJdcNLXCuimVABAMz17fP6.png) no-repeat;
}

.requisition-status.PartiallyComplete {
    background: url(PaLXIzckt38OeGOAMRkmBQjCxJuGHwPdyIJk5BOMacG.png) no-repeat;
}

.accordion-content {
    text-align: center;
}

.accordion-content .requisitionItemPicklist {
    /*width: 80%;*/
    padding: 5px;
    /*border: 1px solid #eeeeee;*/
    margin: 5px;
}

.accordion-content  .picklist-field{
    margin-top: 3px;
}

.accordion-content .picklist-header {
    background-color: #BEE7F7;
    padding: 5px;
    font-weight: bold;
}

.accordion-content .product-name{
    width: 30%;
    float: left;
}
.accordion-content .lot{
    width: 15%;
    float: left;
}

.accordion-content .expiration-date{
    width: 15%;
    float: left;
}

.accordion-content .quantity-onhand{
    width: 15%;
    float: left;
}

.accordion-content .quantity-picked{
    width: 25%;
    float: left;
}

.accordion-content .quantity-picked input{
    text-align: center;
    float: left;
}

#picklist{
    width: 100%;
}

#picked-item-list {
    margin-top: 2em;
}

#requisition-status-key{
    margin-top: 2em;
}

#requisition-status-key div {
    margin: 10px;
}

#requisitionForm .footer{
    margin: 10px;
}

.wide {
    width: 100%;
}
fieldset legend{
    padding: 5px;
}

.picking-item.odd{
    background: #eeeeee;
}

.picking-item{
    margin: 5px;
    vertical-align: middle;
}

blockquote {
    /*font: 14px/22px normal helvetica, sans-serif;*/
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
    padding-left: 15px;
    border-left: 3px solid #ccc;
}

.modified { color: red; }
.beta { background-color: #ffd351; display: inline-block; padding: 2px 5px 2px 5px; text-transform: uppercase; border-radius: 3px; color: #594300; font-weight: bold; line-height:99%; }
.tooltip {
    position: absolute;
    width: 100px;
    height: 20px;
    line-height: 20px;
    padding: 10px;
    font-size: 14px;
    text-align: center;
    color: rgb(113, 157, 171);
    background: rgb(255, 255, 255);
    border: 4px solid rgb(255, 255, 255);
    border-radius: 5px;
    text-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 1px;
    box-shadow: rgba(0, 0, 0, 0.0980392) 1px 1px 2px 0px;
}

.unselectable {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

table.zebra tbody > tr:nth-child(even)        { background-color: #f7f7f7; }
table.zebra tbody > tr:nth-child(odd)        { background-color: #fff; }


/*
#requisition-items tbody > tr:nth-child(even)        { background-color: #f7f7f7; }
#requisition-items tbody > tr:nth-child(odd)        { background-color: #fff; }
#requisition-items td { padding: 2px; margin: 0}
#requisition-items input { border: 0}
#requisition-items tbody > tr:nth-child(odd) input      { background-color: #fff; }
#requisition-items tbody > tr:nth-child(even) input      { background-color: #f7f7f7; }
*/

table.requisition { border-collapse: collapse; }
table.requisition td, table.requisition th { padding: 10px; border-right: 1px solid lightgrey; }

.disabled {
    pointer-events: none;
    cursor: default;
}

.status { text-transform: uppercase; }

#requisition-items td input[type="text"] {
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
}
fieldset { padding: 5px; }


.canceled, .canceled a {
    color: #aaa;
    font-style: italic;
}

span.canceled, div.canceled, td.canceled {
    text-decoration: line-through;
    color: #aaa;
   }

.requisition-number {
    background-color: #f7f7f7;
    color: black;
    font-size: 1.3em;
    padding: 1px;
    border: 1px solid lightgrey;
    margin: 1px;
    font: bold;
    border-radius: 0.2em;

}



/* ------------------------------------------
 * CSS3 GITHUB BUTTONS (Nicolas Gallagher)
 * Licensed under Unlicense
 * http://github.com/necolas/css3-github-buttons
 * --------------------------------------- */


/* =============================================================================
   Base Button
   ========================================================================== */

.button {
    position: relative;
    overflow: visible;
    display: inline-block;
    padding: 0.5em 1em;
    border: 1px solid #d4d4d4;
    margin: 0;
    text-decoration: none;
    text-align: center;
    text-shadow: 1px 1px 0 #fff;
    font:11px/normal sans-serif;
    color: #333;
    white-space: nowrap;
    cursor: pointer;
    outline: none;
    background-color: #ececec;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f4f4f4), to(#ececec));
    background-image: -moz-linear-gradient(#f4f4f4, #ececec);
    background-image: -ms-linear-gradient(#f4f4f4, #ececec);
    background-image: -o-linear-gradient(#f4f4f4, #ececec);
    background-image: linear-gradient(#f4f4f4, #ececec);
    /*-moz-background-clip: padding;  for Firefox 3.6 */
    background-clip: padding-box;
    border-radius: 0.2em;
    /* IE hacks */
    zoom: 1;
    *display: inline;
}

.button:hover,
.button:focus,
.button:active,
.button.active {
    border-color: #3072b3;
    border-bottom-color: #2a65a0;
    text-decoration: none;
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
    color: #fff;
    background-color: #3c8dde;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#599bdc), to(#3072b3));
    background-image: -moz-linear-gradient(#599bdc, #3072b3);
    background-image: -o-linear-gradient(#599bdc, #3072b3);
    background-image: linear-gradient(#599bdc, #3072b3);
}

.button:active,
.button.active {
    border-color: #2a65a0;
    border-bottom-color: #3884cd;
    background-color: #3072b3;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3072b3), to(#599bdc));
    background-image: -moz-linear-gradient(#3072b3, #599bdc);
    background-image: -ms-linear-gradient(#3072b3, #599bdc);
    background-image: -o-linear-gradient(#3072b3, #599bdc);
    background-image: linear-gradient(#3072b3, #599bdc);
}

/* overrides extra padding on button elements in Firefox */
.button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

/* =============================================================================
   Button icons
   ========================================================================== */

.button.icon:before {
    content: "";
    position: relative;
    top: 1px;
    float:left;
    width: 12px;
    height: 12px;
    margin: 0 0.75em 0 -0.25em;
    background: url(wVVwg8ZP9752lU4wTsIde6DBVtHBG2mNKegKcjH7aK.png) 0 99px no-repeat;
}

.button.arrowup.icon:before { background-position: 0 0; }
.button.arrowup.icon:hover:before,
.button.arrowup.icon:focus:before,
.button.arrowup.icon:active:before { background-position: -12px 0; }

.button.arrowdown.icon:before { background-position: 0 -12px; }
.button.arrowdown.icon:hover:before,
.button.arrowdown.icon:focus:before,
.button.arrowdown.icon:active:before { background-position: -12px -12px; }

.button.arrowleft.icon:before { background-position: 0 -24px; }
.button.arrowleft.icon:hover:before,
.button.arrowleft.icon:focus:before,
.button.arrowleft.icon:active:before { background-position: -12px -24px; }

.button.arrowright.icon:before { float:right; margin: 0 -0.25em 0 0.5em; background-position: 0 -36px; }
.button.arrowright.icon:hover:before,
.button.arrowright.icon:focus:before,
.button.arrowright.icon:active:before { background-position: -12px -36px; }

.button.approve.icon:before { background-position: 0 -48px; }
.button.approve.icon:hover:before,
.button.approve.icon:focus:before,
.button.approve.icon:active:before { background-position: -12px -48px; }

.button.add.icon:before { background-position: 0 -288px; }
.button.add.icon:hover:before,
.button.add.icon:focus:before,
.button.add.icon:active:before { background-position: -12px -288px; }

.button.remove.icon:before { background-position: 0 -60px; }
.button.remove.icon:hover:before,
.button.remove.icon:focus:before,
.button.remove.icon:active:before { background-position: -12px -60px; }

.button.log.icon:before { background-position: 0 -72px; }
.button.log.icon:hover:before,
.button.log.icon:focus:before,
.button.log.icon:active:before { background-position: -12px -72px; }

.button.calendar.icon:before { background-position: 0 -84px; }
.button.calendar.icon:hover:before,
.button.calendar.icon:focus:before,
.button.calendar.icon:active:before { background-position: -12px -84px; }

.button.chat.icon:before { background-position: 0 -96px; }
.button.chat.icon:hover:before,
.button.chat.icon:focus:before,
.button.chat.icon:active:before { background-position: -12px -96px; }

.button.clock.icon:before { background-position: 0 -108px; }
.button.clock.icon:hover:before,
.button.clock.icon:focus:before,
.button.clock.icon:active:before { background-position: -12px -108px; }

.button.settings.icon:before { background-position: 0 -120px; }
.button.settings.icon:hover:before,
.button.settings.icon:focus:before,
.button.settings.icon:active:before { background-position: -12px -120px; }

.button.comment.icon:before { background-position: 0 -132px; }
.button.comment.icon:hover:before,
.button.comment.icon:focus:before,
.button.comment.icon:active:before { background-position: -12px -132px; }

.button.fork.icon:before { background-position: 0 -144px; }
.button.fork.icon:hover:before,
.button.fork.icon:focus:before,
.button.fork.icon:active:before { background-position: -12px -144px; }

.button.like.icon:before { background-position: 0 -156px; }
.button.like.icon:hover:before,
.button.like.icon:focus:before,
.button.like.icon:active:before { background-position: -12px -156px; }

.button.favorite.icon:before { background-position: 0 -348px; }
.button.favorite.icon:hover:before,
.button.favorite.icon:focus:before,
.button.favorite.icon:active:before { background-position: -12px -348px; }

.button.home.icon:before { background-position: 0 -168px; }
.button.home.icon:hover:before,
.button.home.icon:focus:before,
.button.home.icon:active:before { background-position: -12px -168px; }

.button.key.icon:before { background-position: 0 -180px; }
.button.key.icon:hover:before,
.button.key.icon:focus:before,
.button.key.icon:active:before { background-position: -12px -180px; }

.button.lock.icon:before { background-position: 0 -192px; }
.button.lock.icon:hover:before,
.button.lock.icon:focus:before,
.button.lock.icon:active:before { background-position: -12px -192px; }

.button.unlock.icon:before { background-position: 0 -204px; }
.button.unlock.icon:hover:before,
.button.unlock.icon:focus:before,
.button.unlock.icon:active:before { background-position: -12px -204px; }

.button.loop.icon:before { background-position: 0 -216px; }
.button.loop.icon:hover:before,
.button.loop.icon:focus:before,
.button.loop.icon:active:before { background-position: -12px -216px; }

.button.search.icon:before { background-position: 0 -228px; }
.button.search.icon:hover:before,
.button.search.icon:focus:before,
.button.search.icon:active:before { background-position: -12px -228px; }

.button.mail.icon:before { background-position: 0 -240px; }
.button.mail.icon:hover:before,
.button.mail.icon:focus:before,
.button.mail.icon:active:before { background-position: -12px -240px; }

.button.move.icon:before { background-position: 0 -252px; }
.button.move.icon:hover:before,
.button.move.icon:focus:before,
.button.move.icon:active:before { background-position: -12px -252px; }

.button.edit.icon:before { background-position: 0 -264px; }
.button.edit.icon:hover:before,
.button.edit.icon:focus:before,
.button.edit.icon:active:before { background-position: -12px -264px; }

.button.pin.icon:before { background-position: 0 -276px; }
.button.pin.icon:hover:before,
.button.pin.icon:focus:before,
.button.pin.icon:active:before { background-position: -12px -276px; }

.button.reload.icon:before { background-position: 0 -300px; }
.button.reload.icon:hover:before,
.button.reload.icon:focus:before,
.button.reload.icon:active:before { background-position: -12px -300px; }

.button.rss.icon:before { background-position: 0 -312px; }
.button.rss.icon:hover:before,
.button.rss.icon:focus:before,
.button.rss.icon:active:before { background-position: -12px -312px; }

.button.tag.icon:before { background-position: 0 -324px; }
.button.tag.icon:hover:before,
.button.tag.icon:focus:before,
.button.tag.icon:active:before { background-position: -12px -324px; }

.button.trash.icon:before { background-position: 0 -336px; }
.button.trash.icon:hover:before,
.button.trash.icon:focus:before,
.button.trash.icon:active:before { background-position: -12px -336px; }

.button.user.icon:before { background-position: 0 -360px; }
.button.user.icon:hover:before,
.button.user.icon:focus:before,
.button.user.icon:active:before { background-position: -12px -360px; }


/* =============================================================================
   Button extensions
   ========================================================================== */

/* Primary button
   ========================================================================== */

.button.primary {
    font-weight: bold;
}

/* Danger button
   ========================================================================== */

.button.danger {
    color: #900;
}

.button.danger:hover,
.button.danger:focus,
.button.danger:active {
    border-color: #b53f3a;
    border-bottom-color: #a0302a;
    color: #fff;
    background-color: #dc5f59;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#dc5f59), to(#b33630));
    background-image: -moz-linear-gradient(#dc5f59, #b33630);
    background-image: -ms-linear-gradient(#dc5f59, #b33630);
    background-image: -o-linear-gradient(#dc5f59, #b33630);
    background-image: linear-gradient(#dc5f59, #b33630);
}

.button.danger:active,
.button.danger.active {
    border-color: #a0302a;
    border-bottom-color: #bf4843;
    background-color: #b33630;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b33630), to(#dc5f59));
    background-image: -moz-linear-gradient(#b33630, #dc5f59);
    background-image: -ms-linear-gradient(#b33630, #dc5f59);
    background-image: -o-linear-gradient(#b33630, #dc5f59);
    background-image: linear-gradient(#b33630, #dc5f59);
}

/* Pill button
   ========================================================================== */

.button.pill {
    border-radius: 50em;
}

/* Disabled button
   ========================================================================== */

.button.disable {
    opacity: 0.5;
}

/* Big button
   ========================================================================== */

.button.big {
    font-size: 14px;
}

.button.big.icon:before {
    top: 0;
}


/* =============================================================================
   Button groups
   ========================================================================== */

/* Standard group
   ========================================================================== */

.button-group {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0;
    /* IE hacks */
    zoom: 1;
    *display: inline;
}

.button + .button,
.button + .button-group,
.button-group + .button,
.button-group + .button-group {
    margin-left: 15px;
}

.button-group li {
    float: left;
    padding: 0;
    margin: 0;
}

.button-group .button {
    float: left;
    margin-left: -1px;
}

.button-group > .button:not(:first-child):not(:last-child),
.button-group li:not(:first-child):not(:last-child) .button {
    border-radius: 0;
}

.button-group > .button:first-child,
.button-group li:first-child .button {
    margin-left: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.button-group > .button:last-child,
.button-group li:last-child > .button {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Minor group
   ========================================================================== */

.button-group.minor-group .button {
    border: 1px solid #d4d4d4;
    text-shadow: none;
    background-image: none;
    background-color: #fff;
}

.button-group.minor-group .button:hover,
.button-group.minor-group .button:focus {
    background-color: #599bdc;
}

.button-group.minor-group .button:active,
.button-group.minor-group .button.active {
    background-color: #3072b3;
}

.button-group.minor-group .button.icon:before {
    opacity: 0.8;
}

/* =============================================================================
   Button container (mixing buttons and groups, e.g., nav bar)
   ========================================================================== */

.button-container .button,
.button-container .button-group {
    vertical-align: top;
}



/* =============================================================================
   Tag Cloud
   ========================================================================== */

#tagcloud a:hover { text-decoration: underline; }

select {
    text-overflow: ellipsis;
}


/* =============================================================================
   Filter list
   ========================================================================== */


ul.filter-list {
    list-style: none;
    padding: 0;
}
.filter-list-item, .filter { margin: 10px;  }
.filter-list-item {
    padding: 0 5px 0 0;
}
.filter-list-item input {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


/* =============================================================================
   Form Field list
   ========================================================================== */



/* =============================================================================
   wizard.css
   ========================================================================== */


/* =============================================================================
    Vertical Tabs
   ========================================================================== */

/*
.ui-tabs-vertical { width: 55em; }
.ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 12em; }
.ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; }
.ui-tabs-vertical .ui-tabs-nav li a { display:block; }
.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; }
.ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: right; width: 40em;}
*/

/*.ui-tabs-vertical { width: 55em; }*/
.ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 15em; }
.ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0; }
.ui-tabs-vertical .ui-tabs-nav li a { display:block; }
.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; }
.ui-tabs-vertical .ui-tabs-panel { padding: 1em; float: right; width: 35em;}


/* =============================================================================
    Footable CSS
   ========================================================================== */

.footable > tbody > tr > td, .footable > thead > tr > th {
    border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
    padding: 10px;
    text-align: left;
}

/* =============================================================================
    Data Table CSS
   ========================================================================== */

table.dataTable tbody tr.odd { background-color: #f7f7f7;; }
table.dataTable tbody tr.even { background-color: #fff; }

table.dataTable tbody tr.odd td.sorting_1 { background-color: #f7f7f7;; }
table.dataTable tbody tr.even td.sorting_1 { background-color: #fff; }

table.dataTable tbody tr.odd td.sorting_2 { background-color: #f7f7f7;; }
table.dataTable tbody tr.even td.sorting_2 { background-color: #fff; }
#dataTable_processing { height: 60px; }

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

.childContainer .tag {
    margin-left: 25px;
}

.new-container {
    border-top: 2px solid #ddd;
}

.packing-unit {
   background-color: #f7f7f7;

}

.dont-break-out {

    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;

    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;

    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;

}

.received, .issued {
    background-color: #00c100;
    color: black;
}
.partially_received, .picked {
    background-color: #aee37d;
    color: black;
}

.pending, .edited, .created {
    background-color: #ffff80;
    color: black;
}

.placed {
    background-color: #8080ff;
    color: black;
}

.approved, .verified , .checked{
    background-color: #ff8000;
    color: black;
}

.closed {
    background-color: #d98477;
    color: black;
}

.expired {
    background-color: #d98477;
    color: black;
}