/* Site framework */

body {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
}

body.login {
    border-top: 20px solid #333645;
    background: url(../images/background.png) fixed center;
    background-size: cover;
}

.container_16 {
    margin-left: auto;
    margin-right: auto;
    width: 1200px;
}

.container_16 .grid_1 {
    width: 55px;
}

.container_16 .grid_2 {
    width: 130px;
}

.container_16 .grid_3 {
    width: 205px;
}

.container_16 .grid_4 {
    width: 280px;
}

.container_16 .grid_5 {
    width: 355px;
}

.container_16 .grid_6 {
    width: 430px;
}

.container_16 .grid_7 {
    width: 505px;
}

.container_16 .grid_8 {
    width: 580px;
}

.container_16 .grid_9 {
    width: 655px;
}

.container_16 .grid_10 {
    width: 730px;
}

.container_16 .grid_11 {
    width: 805px;
}

.container_16 .grid_12 {
    width: 880px;
}

.container_16 .grid_13 {
    width: 955px;
}

.container_16 .grid_14 {
    width: 1030px;
}

.container_16 .grid_15 {
    width: 1105px;
}

.container_16 .grid_16 {
    width: 1180px;
}

.login_form {
    height: 340px;
    position: absolute;
    top: calc(50% - 200px);
    left: calc(50% - 300px);
    width: 600px;
    color: #333645;
    font-size: 17px;
    font-weight: bold;
}

.login_form>div {
    background: #fff;
    box-shadow: 0 0 3px #d6d6d6;
    padding: 20px;
    margin: 10px 0;
}

.login_form input[type=text],
.login_form input[type=password] {
    box-sizing: border-box;
    width: 100%;
    height: 40px;
    font-size: 17px;
    color: #9d9c9c;
    padding: 0 10px 0 40px;
    margin: 10px 0;
    border: 1px solid #ebebeb;
    background: url(../images/email.png) no-repeat 10px center;
}

.login_form input[type=password] {
    background-image: url(../images/key.png);
}

.login_form input[type=submit] {
    border: 0;
    border-radius: 3px;
    background: #cc496b;
    padding: 0 20px;
    float: right;
    color: #fff;
    margin: 10px 0;
    line-height: 40px;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
}

.login_form a {
    font-size: 12px;
    font-weight: normal;
}

.login_error {
    line-height: 40px;
    font-size: 15px;
    color: #990000;
    text-align: center;
}

.login_footer {
    position: fixed;
    bottom: 0;
    left: 0;
    height: 90px;
    background: #333645;
    width: 100%;
}

.content_wrap {
    min-height: 200px;
    background: url(../images/background.png) fixed center;
    background-size: cover;
}

.admin_panel+.header_wrap {
    margin-top: 31px;
}


/* Header */

.header_wrap {}

.logo {
    margin: 20px 0 10px 0;
    display: block;
}

.member_menu {
    text-align: right;
    color: #1b1464;
    margin: 30px 0;
    font-size: 0;
    line-height: 0;
}

.member_menu a {
    display: inline-block;
    margin-left: 30px;
    font-size: 12px;
    line-height: 30px;
    padding-left: 40px;
    background: url(../images/user.png) no-repeat left center;
    color: #3a95d7;
    text-transform: uppercase;
}

.member_menu a.logout {
    background-image: url(../images/logout.png);
    color: #d36582;
}


/* Menus */

.menu_wrap {
    background: #333645;
}

.menu_wrap ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0;
    line-height: 0;
}

.menu_wrap ul li {
    padding: 0;
    margin: 0;
    font-size: 15px;
    line-height: 70px;
    font-weight: bold;
    display: inline-block;
    border-right: 1px solid #575d78;
}

.menu_wrap ul li a {
    color: #fff;
    text-transform: uppercase;
    display: block;
    padding: 0 45px;
}

.menu_wrap ul li:hover a {
    background: #3e4153;
}

.menu_wrap ul li a.active {
    background: #2bba3a;
}

.menu_wrap ul li:last-child {
    border: 0;
}

.footermenu {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0;
    line-height: 0;
    text-align: center;
}

.footermenu li {
    margin: 0;
    padding: 0;
    display: inline-block;
    line-height: 26px;
}

.footermenu li a {
    display: block;
    margin: 0;
    padding: 0 5px 0 0;
    font-size: 12px;
    color: #fff;
}

.footermenu li a:after {
    content: '|';
    padding: 0 0 0 5px;
}

.footermenu li:last-child a:after {
    content: '';
    padding: 0;
}

.footermenu li a:hover {
    text-decoration: underline;
}


/* Footer */

.footer_wrap {
    background: #333645;
    padding: 40px 0;
    line-height: 26px;
    text-align: center;
    color: #fff;
    font-size: 12px;
}


/* Contact Forms */

.customform {
    font: 12px arial;
    color: #333;
}

.customform .fullwrap {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.customform .linewrap {
    float: left;
    width: 100%;
    margin-bottom: 10px;
}

.customform .linewrap .leftwrap {
    float: left;
    width: 30%;
    height: 30px;
}

.customform .linewrap .leftwrap label {
    display: block;
    text-align: right;
    padding-right: 10px;
}

.customform .linewrap .rightwrap {
    float: left;
    width: 70%;
}

.customform .linewrap .textareawrap textarea {
    width: 95%;
    height: 120px;
    font: 13px Trebuchet MS;
    color: #000;
}

.customform .linewrap .textinputwrap input {
    width: 95%;
    font: 13px Trebuchet MS;
    color: #000;
}

.customform .linewrap .dropdownwrap select {
    width: 100%;
    font: 13px Trebuchet MS;
    color: #000;
}

.customform .infowrap {
    margin: 10px 0;
    font-weight: bold;
}


/* Fonts */

a {
    text-decoration: none;
    color: #01aaef;
}

html {
    overflow-y: scroll;
}

h1 {
    display: block;
    font-size: 24px;
    color: #333645;
    margin: 0 0;
    padding: 0;
    line-height: 40px;
}

h2 {
    display: block;
    font-size: 22px;
    color: #333645;
    margin: 0 0;
    padding: 0;
    line-height: 30px;
}

h3 {
    display: block;
    font-size: 20px;
    color: #333645;
    margin: 0 0;
    padding: 0;
    line-height: 30px;
    font-weight: normal;
}

h4 {
    display: block;
    font-size: 18px;
    color: #333645;
    margin: 0 0;
    padding: 0;
    line-height: 20px;
    font-weight: normal;
}

h5 {
    display: block;
    font-size: 14px;
    color: #333645;
    margin: 0 0;
    padding: 0;
    line-height: 20px;
}

h6 {
    display: block;
    font-size: 14px;
    color: #333645;
    margin: 0 0;
    padding: 0;
    line-height: 20px;
}

p {
    padding: 5px 0 20px 0;
    font-size: 14px;
    color: #3a3a38;
    line-height: 24px;
}

ul {
    list-style-position: outside;
    padding: 5px 0 20px 20px;
    font-size: 14px;
    color: #3a3a38;
    list-style-type: disc;
    line-height: 24px;
}

ul li {
    padding: 0 0 15px 0;
    line-height: 20px;
}

ol {
    list-style-position: outside;
    padding: 5px 0 20px 20px;
    font-size: 14px;
    color: #3a3a38;
    list-style-type: circle;
    line-height: 24px;
}

ol li {
    padding: 0 0 5px 0;
}

hr {
    color: #dadbdc;
    background: #dadbdc;
    height: 1px;
    border: 0;
    margin-bottom: 20px;
}

.hidden {
    display: none;
}


/* Contact Forms */

.cf_line {
    clear: both;
    line-height: 30px;
}

.cf_label {
    float: left;
    width: 48%;
    margin: 0 1%;
}

.cf_field {
    float: left;
    width: 48%;
    margin: 0 1%;
}

.cf_field textarea,
.cf_field select,
.cf_field input[type=text] {
    width: 98%;
}

.cf_field textarea {
    height: 60px;
    resize: none;
}

.cf_submit,
.ff_submit {
    text-align: center;
    margin: 10px 0;
}

.cf_submit a,
.ff_submit a {
    font-size: 1.2em;
    color: #fff;
    background: #394cc1;
    border-radius: 5px;
    line-height: 30px;
    margin: 0 auto;
    display: inline-block;
    padding: 0 20px;
    text-decoration: none;
    background: #3344af;
    /* Old browsers */
    background: -moz-linear-gradient(top, #3344af 0%, #505fb6 50%, #6973b5 100%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3344af), color-stop(50%, #505fb6), color-stop(100%, #6973b5));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #3344af 0%, #505fb6 50%, #6973b5 100%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #3344af 0%, #505fb6 50%, #6973b5 100%);
    /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #3344af 0%, #505fb6 50%, #6973b5 100%);
    /* IE10+ */
    background: linear-gradient(to bottom, #3344af 0%, #505fb6 50%, #6973b5 100%);
    /* W3C */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#3344af', endColorstr='#6973b5', GradientType=0);
    /* IE6-9 */
}


/*Fading Gallery*/

.caroufredsel_wrapper {
    padding-bottom: 20px;
}

div[type=fading_gallery] a {
    position: relative;
}

div[type=fading_gallery] .banner,
div.fg_gallery .banner {
    position: absolute;
    bottom: 0;
    padding: 0px 5px;
    width: 100%;
    background: rgba(0, 105, 0, 0.9);
}


/*Full Screen Gallery*/

div.fullscreenwrap {
    margin: 0 auto 10px !important;
    top: 0px !important;
}

div.fullscreenfade {
    margin: 0 auto;
    display: block;
}

div.fullscreenfade div.slide {
    float: left;
    position: relative;
}

div.fullscreenfade div.slide .banner {
    background: rgba(255, 255, 255, 0.6);
    padding: 20px 0;
    position: absolute;
    bottom: 0;
    width: 100%;
}

div.fullscreenfade div.slide .frame {
    margin: 0 auto;
    width: 940px;
}

.dashboard,
.settings {
    font-size: 0;
    line-height: 0;
    margin-bottom: 60px;
}

.dashbox {
    width: 380px;
    border: 1px solid #ebe9e9;
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 20px;
    color: #020014;
    padding: 180px 20px 20px;
    text-align: center;
    text-transform: uppercase;
    line-height: 40px;
    display: inline-block;
    margin: 20px 20px 10px 0;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center 60px
}

.dashbox:nth-child(3n) {
    margin-right: 0;
}

.dashbox:hover {
    background-color: #fff;
    border-color: #d7d4d4;
}

.dashbox.routes {
    background-image: url(../images/routes.png);
}

.dashbox.routes:hover {
    background-image: url(../images/routes-on.png);
}

.dashbox.sales {
    background-image: url(../images/sales.png);
}

.dashbox.sales:hover {
    background-image: url(../images/sales-on.png);
}

.dashbox.purchases {
    background-image: url(../images/purchases.png);
}

.dashbox.purchases:hover {
    background-image: url(../images/purchases-on.png);
}

.dashbox.cycles {
    background-image: url(../images/cycles.png);
}

.dashbox.cycles:hover {
    background-image: url(../images/cycles-on.png);
}

.dashbox.users {
    background-image: url(../images/users.png);
}

.dashbox.users:hover {
    background-image: url(../images/users-on.png);
}

.dashbox.periods {
    background-image: url(../images/periods.png);
}

.dashbox.periods:hover {
    background-image: url(../images/periods-on.png);
}

.dashbox.settings {
    background-image: url(../images/settings.png);
}

.dashbox.settings:hover {
    background-image: url(../images/settings-on.png);
}

.dashbox.customers {
    background-image: url(../images/customers.png);
}

.dashbox.customers:hover {
    background-image: url(../images/customers-on.png);
}

.dashbox.suppliers {
    background-image: url(../images/suppliers.png);
}

.dashbox.suppliers:hover {
    background-image: url(../images/suppliers-on.png);
}

.dashbox.currencies {
    background-image: url(../images/currencies.png);
}

.dashbox.currencies:hover {
    background-image: url(../images/currencies-on.png);
}

.dashbox.offers {
    background-image: url(../images/offers.png);
}

.dashbox.offers:hover {
    background-image: url(../images/offers-on.png);
}

.dashbox.bands {
    background-image: url(../images/bands.png);
}

.dashbox.bands:hover {
    background-image: url(../images/bands-on.png);
}

.dashbox.categories {
    background-image: url(../images/categories.png);
}

.dashbox.categories:hover {
    background-image: url(../images/categories-on.png);
}

.dashbox.templates {
    background-image: url(../images/templates.png);
}

.dashbox.templates:hover {
    background-image: url(../images/templates-on.png);
}

.dashbox.alerts {
    background-image: url(../images/alerts.png);
}

.dashbox.alerts:hover {
    background-image: url(../images/alerts-on.png);
}

.dashbox.products {
    background-image: url(../images/products.png);
}

.dashbox.products:hover {
    background-image: url(../images/products-on.png);
}

.dashbox.reports {
    background-image: url(../images/reports.png);
}

.dashbox.reports:hover {
    background-image: url(../images/reports-on.png);
}

.dashbox.my-details {
    background-image: url(../images/my-details.png);
}

.dashbox.my-details:hover {
    background-image: url(../images/my-details-on.png);
}

.dashbox.custom-fields {
    background-image: url(../images/custom-fields.png);
}

.dashbox.custom-fields:hover {
    background-image: url(../images/custom-fields-on.png);
}

.breadcrumbs {
    list-style: none;
    padding: 0;
    margin: 0 0 10px;
    font-size: 0;
    line-height: 0;
    border-bottom: 1px dashed #d4d4d7;
}

.breadcrumbs li {
    display: inline-block;
    padding: 0;
    margin: 0 5px 0 0;
    color: #8f9091;
    font-size: 12px;
    line-height: 40px;
    text-transform: uppercase;
}

.breadcrumbs li a:after {
    content: ' >';
}

.addButton,
.Button,
.addNonButton {
    float: right;
    display: block;
    border: 1px solid #2bba3a;
    border-radius: 2px;
    line-height: 38px;
    margin: 0 0 0 10px;
    padding: 0 20px;
    color: #2bba3a;
    font-weight: bold;
    font-size: 15px;
    box-sizing: border-box;
}

.Button {
    border-color: #2d7fbb;
    color: #2d7fbb
}

.addNonButton {
    float: left;
    border-color: #2d7fbb;
    color: #2d7fbb
}

.exportButton {
    float: right;
    width: 30px;
    height: 30px;
    margin: 5px;
    background: url(../images/download.png) no-repeat center;
    display: block;
}

.sendButton {
    float: right;
    padding-right: 35px;
    width: auto;
    font-size: 14px;
    color: #8f9091;
    height: 30px;
    margin: 5px;
    background: url(../images/send.png) no-repeat right center;
    display: block;
    line-height: 30px;
}

.viewTable {
    margin: 10px 0;
}

.tableHeader {
    font-size: 0;
    line-height: 0;
    border: 1px solid #d8d6d6;
    background: #f2f0f0
}

.tableHeader>div,
.tableBody>div>div {
    display: inline-block;
    vertical-align: top;
    border-right: 1px solid #d8d6d6;
    line-height: 54px;
    font-weight: bold;
    color: #333645;
    font-size: 14px;
    padding: 0 5px;
    box-sizing: border-box;
    height: 54px;
    overflow: hidden;
}

.tableHeader>div:last-child,
.tableBody>div>div:last-child {
    border-right: 0;
}

.tableBody {
    border: 1px solid #ebe9e9;
    border-width: 0 1px 1px;
}

.tableBody>div>div {
    font-size: 14px;
    color: #333645;
    font-weight: normal;
}

.tableBody>div {
    font-size: 0;
    line-height: 0;
    border-bottom: 1px dashed #d6d7da;
    background: #ffffff;
}

.tableBody>div:nth-child(even) {
    background: #fcfbfb;
}

.tableBody>div:last-child {
    border-bottom: 0;
}

.tableBody img {
    vertical-align: middle;
}

.tableHeader>div.sortable {
    cursor: pointer;
}

.viewPager {
    clear: both;
    margin: 10px 0;
}

.cycles .tableHeader>div:first-child,
.cycles .tableBody>div>div:first-child {
    width: 10px;
    text-align: center;
    font-weight: bold;
    padding: 0;
}

.cycles .tableBody>div>div:first-child {
    cursor: move;
    background: #fdfdfd;
}

.cycles .tableHeader>div:nth-child(2),
.cycles .tableBody>div>div:nth-child(2) {
    width: 428px;
}

.cycles .tableHeader>div:nth-child(3),
.cycles .tableBody>div>div:nth-child(3) {
    width: 110px;
}

.cycles .tableHeader>div:nth-child(4),
.cycles .tableBody>div>div:nth-child(4) {
    width: 140px;
}

.cycles .tableHeader>div:nth-child(5),
.cycles .tableBody>div>div:nth-child(5) {
    width: 198px;
}

.cycles .tableHeader>div:nth-child(6),
.cycles .tableBody>div>div:nth-child(6) {
    width: 140px;
}

.cycles .tableHeader>div:nth-child(7),
.cycles .tableBody>div>div:nth-child(7) {
    width: 100px;
}

.cycles .tableHeader>div:nth-child(8),
.cycles .tableBody>div>div:nth-child(8) {
    width: 50px;
    text-align: center;
}

.routes .tableHeader>div:first-child,
.routes .tableBody>div>div:first-child {
    width: 558px;
}

.routes .tableHeader>div:nth-child(2),
.routes .tableBody>div>div:nth-child(2) {
    width: 110px;
}

.routes .tableHeader>div:nth-child(3),
.routes .tableBody>div>div:nth-child(3) {
    width: 150px;
}

.routes .tableHeader>div:nth-child(4),
.routes .tableBody>div>div:nth-child(4) {
    width: 150px;
}

.routes .tableHeader>div:nth-child(5),
.routes .tableBody>div>div:nth-child(5) {
    width: 80px;
}

.routes .tableHeader>div:nth-child(6),
.routes .tableBody>div>div:nth-child(6) {
    width: 80px;
}

.routes .tableHeader>div:nth-child(7),
.routes .tableBody>div>div:nth-child(7) {
    width: 50px;
    text-align: center;
}

.customers .tableBody>div>div,
.customers {
    position: relative;
}

.customers .tableHeader>div:first-child,
.customers .tableBody>div>div:first-child {
    width: 80px;
}

.customers .tableHeader>div:nth-child(2),
.customers .tableBody>div>div:nth-child(2) {
    width: 360px;
}

.customers .tableHeader>div:nth-child(3),
.customers .tableBody>div>div:nth-child(3) {
    width: 150px;
}

.customers .tableHeader>div:nth-child(4),
.customers .tableBody>div>div:nth-child(4) {
    width: 150px;
}

.customers .tableHeader>div:nth-child(5),
.customers .tableBody>div>div:nth-child(5) {
    width: 138px;
}

.customers .tableHeader>div:nth-child(6),
.customers .tableBody>div>div:nth-child(6) {
    width: 150px;
}

.customers .tableHeader>div:nth-child(7),
.customers .tableBody>div>div:nth-child(7) {
    width: 100px;
}

.customers .tableHeader>div:nth-child(8),
.customers .tableBody>div>div:nth-child(8) {
    width: 50px;
    text-align: center;
}

.suppliers .tableBody>div>div,
.suppliers {
    position: relative;
}

.suppliers .tableHeader>div:first-child,
.suppliers .tableBody>div>div:first-child {
    width: 80px;
}

.suppliers .tableHeader>div:nth-child(2),
.suppliers .tableBody>div>div:nth-child(2) {
    width: 210px;
}

.suppliers .tableHeader>div:nth-child(3),
.suppliers .tableBody>div>div:nth-child(3) {
    width: 210px;
}

.suppliers .tableHeader>div:nth-child(4),
.suppliers .tableBody>div>div:nth-child(4) {
    width: 240px;
}

.suppliers .tableHeader>div:nth-child(5),
.suppliers .tableBody>div>div:nth-child(5) {
    width: 138px;
}

.suppliers .tableHeader>div:nth-child(6),
.suppliers .tableBody>div>div:nth-child(6) {
    width: 150px;
}

.suppliers .tableHeader>div:nth-child(7),
.suppliers .tableBody>div>div:nth-child(7) {
    width: 100px;
}

.suppliers .tableHeader>div:nth-child(8),
.suppliers .tableBody>div>div:nth-child(8) {
    width: 50px;
    text-align: center;
}

.bands .tableHeader>div:nth-child(1),
.bands .tableBody>div>div:nth-child(1) {
    width: 978px;
}

.bands .tableHeader>div:nth-child(2),
.bands .tableBody>div>div:nth-child(2) {
    width: 150px;
}

.bands .tableHeader>div:nth-child(3),
.bands .tableBody>div>div:nth-child(3) {
    width: 50px;
    text-align: center;
}

.periods .tableHeader>div:nth-child(1),
.periods .tableBody>div>div:nth-child(1) {
    width: 828px;
}

.periods .tableHeader>div:nth-child(2),
.periods .tableBody>div>div:nth-child(2),
.periods .tableHeader>div:nth-child(3),
.periods .tableBody>div>div:nth-child(3) {
    width: 150px;
}

.periods .tableHeader>div:nth-child(4),
.periods .tableBody>div>div:nth-child(4) {
    width: 50px;
    text-align: center;
}

.templates .tableHeader>div:nth-child(1),
.templates .tableBody>div>div:nth-child(1) {
    width: 558px;
}

.templates .tableHeader>div:nth-child(2),
.templates .tableBody>div>div:nth-child(2) {
    width: 570px;
}

.templates .tableHeader>div:nth-child(3),
.templates .tableBody>div>div:nth-child(3) {
    width: 50px;
    text-align: center;
}

.correspondence .tableHeader>div:nth-child(1),
.correspondence .tableBody>div>div:nth-child(1) {
    width: 180px !important;
}

.correspondence .tableHeader>div:nth-child(2),
.correspondence .tableBody>div>div:nth-child(2) {
    width: 790px !important;
}

.correspondence .tableHeader>div:nth-child(3),
.correspondence .tableBody>div>div:nth-child(3) {
    width: 120px !important;
}

.correspondence.contained .tableHeader>div:nth-child(2),
.correspondence.contained .tableBody>div>div:nth-child(2) {
    width: 150px !important;
}

.correspondence.contained .tableHeader>div:nth-child(3),
.correspondence.contained .tableBody>div>div:nth-child(3) {
    width: 600px !important;
}

.correspondence.contained .tableHeader>div:nth-child(4),
.correspondence.contained .tableBody>div>div:nth-child(4) {
    width: 120px !important;
}

.fields .tableHeader>div:nth-child(1),
.fields .tableBody>div>div:nth-child(1) {
    width: 688px;
}

.fields .tableHeader>div:nth-child(2),
.fields .tableBody>div>div:nth-child(2) {
    width: 220px;
}

.fields .tableHeader>div:nth-child(3),
.fields .tableBody>div>div:nth-child(3) {
    width: 220px;
}

.fields .tableHeader>div:nth-child(4),
.fields .tableBody>div>div:nth-child(4) {
    width: 50px;
    text-align: center;
}

.categories .tableHeader>div:nth-child(1),
.categories .tableBody>div>div:nth-child(1) {
    width: 948px;
}

.categories .tableHeader>div:nth-child(2),
.categories .tableBody>div>div:nth-child(2) {
    width: 150px;
}

.categories .tableHeader>div:nth-child(3),
.categories .tableBody>div>div:nth-child(3) {
    width: 80px;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: space-evenly;
}

.currencies .tableHeader>div:nth-child(1),
.currencies .tableBody>div>div:nth-child(1) {
    width: 828px;
}

.currencies .tableHeader>div:nth-child(2),
.currencies .tableBody>div>div:nth-child(2) {
    width: 150px;
}

.currencies .tableHeader>div:nth-child(3),
.currencies .tableBody>div>div:nth-child(3) {
    width: 150px;
}

.currencies .tableHeader>div:nth-child(4),
.currencies .tableBody>div>div:nth-child(4) {
    width: 50px;
    text-align: center;
}

.purchases .tableHeader>div:nth-child(1),
.purchases .tableBody>div>div:nth-child(1) {
    width: 120px;
}

.purchases .tableHeader>div:nth-child(2),
.purchases .tableBody>div>div:nth-child(2) {
    width: 438px;
}

.purchases .tableHeader>div:nth-child(3),
.purchases .tableBody>div>div:nth-child(3) {
    width: 110px;
}

.purchases .tableHeader>div:nth-child(4),
.purchases .tableBody>div>div:nth-child(4) {
    width: 140px;
}

.purchases .tableHeader>div:nth-child(5),
.purchases .tableBody>div>div:nth-child(5) {
    width: 100px;
}

.purchases .tableHeader>div:nth-child(6),
.purchases .tableBody>div>div:nth-child(6) {
    width: 120px;
}

.purchases .tableHeader>div:nth-child(7),
.purchases .tableBody>div>div:nth-child(7) {
    width: 100px;
}

.purchases .tableHeader>div:nth-child(8),
.purchases .tableBody>div>div:nth-child(8) {
    width: 50px;
    text-align: center;
}

.sales .tableHeader>div:nth-child(1),
.sales .tableBody>div>div:nth-child(1) {
    width: 120px;
}

.sales .tableHeader>div:nth-child(2),
.sales .tableBody>div>div:nth-child(2) {
    width: 438px;
}

.sales .tableHeader>div:nth-child(3),
.sales .tableBody>div>div:nth-child(3) {
    width: 110px;
}

.sales .tableHeader>div:nth-child(4),
.sales .tableBody>div>div:nth-child(4) {
    width: 140px;
}

.sales .tableHeader>div:nth-child(5),
.sales .tableBody>div>div:nth-child(5) {
    width: 100px;
}

.sales .tableHeader>div:nth-child(6),
.sales .tableBody>div>div:nth-child(6) {
    width: 120px;
}

.sales .tableHeader>div:nth-child(7),
.sales .tableBody>div>div:nth-child(7) {
    width: 100px;
}

.sales .tableHeader>div:nth-child(8),
.sales .tableBody>div>div:nth-child(8) {
    width: 50px;
    text-align: center;
}

.sales .products .tableBody {}

.sales .products .tableBody>div {
    display: flex;
}

.sales .products .tableHeader {
    display: flex;
}

.sales .products .tableHeader>div {
    box-sizing: border-box;
}

.sales .products .tableBody>div>div {
    height: auto;
    padding: 10px 5px;
    font-size: 12px;
    line-height: 20px;
    box-sizing: border-box;
}

.sales .products .tableBody>div>div input {
    margin: 2px 0;
}

.sales .products .tableBody>div>div:first-child,
.sales .products .tableHeader>div:first-child {
    width: 10px;
    text-align: center;
    font-weight: bold;
    padding: 0;
}

.sales .products .tableBody>div>div:first-child {
    cursor: move;
    background: #fdfdfd;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
}

.sales .products .tableHeader>div:nth-child(2),
.sales .products .tableBody>div>div:nth-child(2) {
    width: 250px;
    max-width: 250px;
}

.sales .products .tableBody>div>div:nth-child(2) {
    color: #333645;
}

.sales .products .tableBody>div>div:nth-child(2)>div:nth-child(2) {
    font-weight: bold;
}

.sales .products .tableBody>div>div:nth-child(3)>input {
    width: 70px !important;
    margin-right: 5px;
    font-size: 16px;
}

.sales .products .tableBody>div>div:nth-child(3)>div:nth-child(3) {
    line-height: 30px;
}

.sales .products .tableBody>div>div:nth-child(3)>div:nth-child(4) {
    clear: left;
}

.sales .products .tableBody>div>div:nth-child(4)>div:nth-child(1),
.sales .products .tableBody>div>div:nth-child(3)>div:nth-child(2) {
    float: left;
    margin-right: 10px;
}

.sales .products .tableBody>div>div:nth-child(4)>input {
    width: 70px !important;
    margin: 2px 5px;
    font-size: 16px;
}

.sales .products .tableBody>div>div:nth-child(4)>div:nth-child(3),
.sales .products .tableBody>div>div:nth-child(3)>div:nth-child(5) {
    float: left;
}

.sales .products .tableBody>div>div:nth-child(4)>div:nth-child(3) {
    clear: left;
    line-height: 30px;
    font-weight: bold;
}

.sales .products .tableBody>div>div:nth-child(4)>div:nth-child(5) {
    font-style: italic;
    line-height: 12px;
    padding: 2px 0;
}

.sales .products .tableHeader>div:nth-child(3),
.sales .products .tableBody>div>div:nth-child(3) {
    width: 150px;
    max-width: 150px;
}

.sales .products .tableHeader>div:nth-child(4),
.sales .products .tableBody>div>div:nth-child(4) {
    width: 220px;
    max-width: 220px;
}

.sales .products .tableHeader>div:nth-child(5),
.sales .products .tableBody>div>div:nth-child(5) {
    width: 150px;
    max-width: 150px;
}

.sales .products .tableBody>div>div:nth-child(5)>div:nth-child(2),
.sales .products .tableBody>div>div:nth-child(6)>div:nth-child(2) {
    font-weight: bold;
}

.sales .products .tableHeader>div:nth-child(6),
.sales .products .tableBody>div>div:nth-child(6) {
    width: 130px;
    max-width: 130px;
}

.sales .products .tableHeader>div:nth-child(7),
.sales .products .tableBody>div>div:nth-child(7) {
    width: 90px;
    max-width: 90px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    font-weight: bold;
}

.sales .products .tableHeader>div:nth-child(8),
.sales .products .tableBody>div>div:nth-child(8) {
    width: 80px;
    max-width: 80px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    font-weight: bold;
}

.sales .products .tableHeader>div:nth-child(9),
.sales .products .tableBody>div>div:nth-child(9) {
    width: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sales .products .tableHeader>div:nth-child(10),
.sales .products .tableBody>div>div:nth-child(10),
.sales .products .tableHeader>div:nth-child(11),
.sales .products .tableBody>div>div:nth-child(11) {
    width: 50px;
    text-align: center;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
}

.sales .products .tableBody>div>div:nth-child(5),
.sales .products .tableBody>div>div:nth-child(6) {
    position: relative;
}

.sales .products .tableBody>div.linePriority {
    background: #ffa1a1 !important;
}

.viewHistory {
    display: none;
    position: absolute;
    right: 2px;
    top: 20px;
    width: 15px;
    height: 15px;
    background: url(../images/viewhistory.png) no-repeat;
}

.viewHist>div:not(.clear) {
    width: 50%;
    float: left;
}

.historyLookup {
    display: block;
    width: 15px;
    height: 15px;
    background: url(../images/viewhistory.png) no-repeat;
}


/*
.purchases .products .tableHeader > div:nth-child(4), .purchases .products .tableHeader > div:nth-child(5), .purchases .products .tableHeader > div:nth-child(7), .purchases .products .tableHeader > div:nth-child(8), .purchases .products .tableBody > div > div:nth-child(4), .purchases .products .tableBody > div >div:nth-child(5), .purchases .products .tableBody > div> div:nth-child(7), .purchases .products .tableBody > div > div:nth-child(8){width: 65px; text-align: left;}
.purchases .products .tableHeader > div:nth-child(2), .purchases .products .tableBody > div > div:nth-child(2) {width: 100px;}
.purchases .products .tableHeader > div:nth-child(3), .purchases .products .tableBody > div > div:nth-child(3), .purchases .products .tableHeader > div:nth-child(10), .purchases .products .tableBody > div > div:nth-child(10) {width: 70px;}
.purchases .products .tableHeader > div:nth-child(9), .purchases .products .tableBody > div > div:nth-child(9) {width: 70px;}
.purchases .products .tableHeader > div:nth-child(11), .purchases .products .tableBody > div > div:nth-child(11) {width: 90px;}
.purchases .products .tableHeader > div:nth-child(1), .purchases .products .tableHeader > div:nth-child(6), .purchases .products .tableHeader > div:nth-child(12), .purchases .products .tableBody > div > div:nth-child(1), .purchases .products .tableBody > div > div:nth-child(6), .purchases .products .tableBody > div > div:nth-child(12) {width: 75px;}
.purchases .products .tableHeader > div:nth-child(7), .purchases .products .tableHeader > div:nth-child(6), .purchases .products .tableHeader > div:nth-child(8), .purchases .products .tableHeader > div:nth-child(9), .purchases .products .tableHeader > div:nth-child(10), .purchases .products .tableHeader > div:nth-child(11) {line-height: 22px; padding: 5px 10px;}
.purchases .products .tableHeader > div:nth-child(13), .purchases .products .tableBody > div > div:nth-child(13) {width: 50px; text-align: center;}
.purchases .products .tableBody > div > div:nth-child(5), .purchases .products .tableBody > div > div:nth-child(8) {position: relative;}

.purchases .products .tableBody {display: table;}
.purchases .products .tableBody > div {display: table-row;}
.purchases .products .tableBody > div > div { display: table-cell; word-wrap: break-word;}
.purchases .products .tableHeader > div:nth-child(1), .purchases .products .tableBody > div > div:nth-child(1) {width: 80px; max-width: 80px;}
.purchases .products .tableHeader > div:nth-child(2), .purchases .products .tableBody > div > div:nth-child(2) {width: 118px;}
.purchases .products .tableBody > div > div:nth-child(2) {height: auto;}
.purchases .products .tableHeader > div:nth-child(4), .purchases .products .tableBody > div > div:nth-child(4) {width: 90px !important;}
.purchases .products .tableHeader > div:nth-child(3), .purchases .products .tableBody > div > div:nth-child(3) {width: 60px !important;}
.purchases .products .tableHeader > div:nth-child(11), .purchases .products .tableBody > div > div:nth-child(11), .purchases .products .tableHeader > div:nth-child(12), .purchases .products .tableBody > div > div:nth-child(12) {width: 90px !important;}
.purchases .products .tableHeader > div:nth-child(6), .purchases .products .tableBody > div > div:nth-child(6), .purchases .products .tableHeader > div:nth-child(7), .purchases .products .tableBody > div > div:nth-child(7) {width: 70px !important;}
.purchases .products .tableHeader > div:nth-child(n+5):nth-child(-n+12), .purchases .products .tableBody > div > div:nth-child(n+5):nth-child(-n+12) {width: 80px; text-align: left;}
.purchases .products .tableHeader > div:nth-child(13), .purchases .products .tableBody > div > div:nth-child(13),.purchases .products .tableHeader > div:nth-child(14), .purchases .products .tableBody > div > div:nth-child(14) {width: 70px;}
.purchases .products .tableHeader > div:nth-child(15), .purchases .products .tableBody > div > div:nth-child(15) {width: 50px; text-align: center;}
.purchases .products .tableHeader > div:nth-child(n+4):nth-child(-n+13) {line-height: 22px; padding-top: 5px;}
.purchases .products .tableBody > div > div:nth-child(8), .purchases .products .tableBody > div > div:nth-child(10) {position: relative;}
*/

.purchases .products .tableBody {}

.purchases .products .tableHeader {
    display: flex;
}

.purchases .products .tableBody>div {
    display: flex;
}

.purchases .products .tableHeader>div {
    box-sizing: border-box;
}

.purchases .products .tableBody>div>div {
    height: auto;
    padding: 10px 5px;
    font-size: 12px;
    line-height: 20px;
    box-sizing: border-box;
}

.purchases .products .tableBody>div>div input {
    margin: 2px 0;
}

.purchases .products .tableBody>div>div:first-child,
.purchases .products .tableHeader>div:first-child {
    width: 10px;
    text-align: center;
    font-weight: bold;
    padding: 0;
}

.purchases .products .tableBody>div>div:first-child {
    cursor: move;
    background: #fdfdfd;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
}

.purchases .products .tableHeader>div:nth-child(2),
.purchases .products .tableBody>div>div:nth-child(2) {
    width: 250px;
    max-width: 250px;
}

.purchases .products .tableBody>div>div:nth-child(2) {
    color: #333645;
}

.purchases .products .tableBody>div>div:nth-child(2)>div:nth-child(2) {
    font-weight: bold;
}

.purchases .products .tableBody>div>div:nth-child(3)>input {
    width: 70px !important;
    margin-right: 5px;
    font-size: 16px;
}

.purchases .products .tableBody>div>div:nth-child(3)>div:nth-child(3) {
    line-height: 30px;
    float: none;
}

.purchases .products .tableBody>div>div:nth-child(3)>div:nth-child(4) {
    clear: left;
}

.purchases .products .tableBody>div>div:nth-child(4)>div:nth-child(1) {}

.purchases .products .tableBody>div>div:nth-child(4)>input {
    width: 70px !important;
    margin: 2px 5px;
    font-size: 16px;
}

.purchases .products .tableBody>div>div:nth-child(4)>div:nth-child(2) {
    clear: left;
    line-height: 30px;
    font-weight: bold;
    float: left;
}

.purchases .products .tableHeader>div:nth-child(3),
.purchases .products .tableBody>div>div:nth-child(3) {
    width: 150px;
    max-width: 150px;
}

.purchases .products .tableHeader>div:nth-child(4),
.purchases .products .tableBody>div>div:nth-child(4) {
    width: 220px;
    max-width: 220px;
}

.purchases .products .tableHeader>div:nth-child(5),
.purchases .products .tableBody>div>div:nth-child(5) {
    width: 150px;
    max-width: 150px;
}

.purchases .products .tableBody>div>div:nth-child(5)>div:nth-child(2),
.purchases .products .tableBody>div>div:nth-child(6)>div:nth-child(2) {
    font-weight: bold;
}

.purchases .products .tableHeader>div:nth-child(6),
.purchases .products .tableBody>div>div:nth-child(6) {
    width: 130px;
    max-width: 130px;
}

.purchases .products .tableHeader>div:nth-child(7),
.purchases .products .tableBody>div>div:nth-child(7) {
    width: 90px;
    max-width: 90px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    font-weight: bold;
}

.purchases .products .tableHeader>div:nth-child(8),
.purchases .products .tableBody>div>div:nth-child(8) {
    width: 80px;
    max-width: 80px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    font-weight: bold;
}

.purchases .products .tableHeader>div:nth-child(9),
.purchases .products .tableBody>div>div:nth-child(9) {
    width: 150px;
}

.purchases .products .tableHeader>div:nth-child(10),
.purchases .products .tableBody>div>div:nth-child(10),
.purchases .products .tableHeader>div:nth-child(11),
.purchases .products .tableBody>div>div:nth-child(11) {
    width: 50px;
    text-align: center;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
}

.purchases .products .tableBody>div>div:nth-child(5),
.purchases .products .tableBody>div>div:nth-child(6) {
    position: relative;
}

.purchases .products .tableBody>div.linePriority {
    background: #ffa1a1 !important;
}

.products .tableBody>div .loader {
    padding: 15px 0;
}

.offers .tableHeader>div:nth-child(1),
.offers .tableBody>div>div:nth-child(1) {
    width: 120px;
}

.offers .tableHeader>div:nth-child(2),
.offers .tableBody>div>div:nth-child(2) {
    width: 328px;
}

.offers .tableHeader>div:nth-child(3),
.offers .tableBody>div>div:nth-child(3) {
    width: 80px;
}

.offers .tableHeader>div:nth-child(4),
.offers .tableBody>div>div:nth-child(4) {
    width: 100px;
}

.offers .tableHeader>div:nth-child(5),
.offers .tableBody>div>div:nth-child(5) {
    width: 120px;
}

.offers .tableHeader>div:nth-child(6),
.offers .tableBody>div>div:nth-child(6) {
    width: 100px;
}

.offers .tableHeader>div:nth-child(7),
.offers .tableBody>div>div:nth-child(7) {
    width: 100px;
}

.offers .tableHeader>div:nth-child(8),
.offers .tableBody>div>div:nth-child(8) {
    width: 180px;
    text-align: left;
}

.offers .tableHeader>div:nth-child(9),
.offers .tableBody>div>div:nth-child(9) {
    width: 50px;
    text-align: center;
}

.dropoffs .tableHeader>div:first-child,
.dropoffs .tableBody>div>div:first-child {
    width: 600px;
}

.dropoffs .tableHeader>div:nth-child(2),
.dropoffs .tableBody>div>div:nth-child(2) {
    width: 216px;
}

.dropoffs .tableHeader>div:nth-child(3),
.dropoffs .tableBody>div>div:nth-child(3) {
    width: 100px;
    text-align: center;
}

.dropoffs .tableBody>div>div:nth-child(3) a {
    margin: 0 5px;
}

.nonorders .tableHeader>div:first-child,
.nonorders .tableBody>div>div:first-child {
    width: 740px;
}

.nonorders .tableHeader>div:nth-child(2),
.nonorders .tableBody>div>div:nth-child(2) {
    width: 386px;
}

.nonorders .tableBody>div>div:nth-child(3) {
    width: 50px;
    text-align: center;
}

.nonorders .tableBody>div>div:first-child a {
    margin: 0 5px;
}

.forecast .products .tableHeader>div:nth-child(1),
.forecast .products .tableBody>div>div:nth-child(1) {
    width: 130px;
}

.forecast .products .tableHeader>div:nth-child(2),
.forecast .products .tableBody>div>div:nth-child(2) {
    width: 350px;
}

.forecast .products .tableHeader>div:nth-child(3),
.forecast .products .tableBody>div>div:nth-child(3) {
    width: 120px;
}

.forecast .products .tableHeader>div:nth-child(n+4):nth-child(-n+9),
.forecast .products .tableBody>div>div:nth-child(n+4):nth-child(-n+9) {
    width: 94px;
}

.forecastCategory,
.forecastNull {
    width: 200px;
    float: right;
    height: 40px;
    border: 1px solid #ebebeb;
}

.forecast .search {
    width: 250px
}

.forecastNull {
    width: 100px;
    margin-left: 20px;
}

.products:not(.contained) .tableBody {
    border: 0;
}

.products:not(.contained) .tableBody>div.product {
    border: 1px solid #ebe9e9;
    background: #fff;
    margin: 20px 0;
}

.products:not(.contained) .tableBody>div>div {
    display: block;
    border: 0;
    height: auto;
    line-height: 20px;
    padding: 0;
}

.products:not(.contained) .tableBody>div>div:nth-child(2) {
    background: #fbf9f9;
    border-top: 1px solid #ebe9e9;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.product div.productImage {
    float: left;
    width: 100px;
    margin: 10px 0 10px 10px;
    height: 110px;
    border: 1px solid #ebe9e9;
    box-sizing: border-box;
    text-align: center;
    line-height: 110px;
}

.product div.productImage img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle;
}

.product div.productDetails {
    float: left;
    width: 840px;
    margin-right: 0px;
    padding: 5px 10px;
    border-right: 1px solid #ebe9e9;
    box-sizing: border-box;
}

.product div.productDetails .productSKU {
    font-size: 12px;
    text-transform: uppercase;
}

.product div.productDetails .productTitle {
    font-size: 20px;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 30px;
}

.product div.productDetails .productTitle a {
    color: #000;
}

.product div.productDetails .productCarton,
.product div.productDetails .productSize {
    float: left;
    width: 50%;
    box-sizing: border-box;
    padding: 0px 5px 0 0;
    line-height: 24px;
}

.product div.productDetails .productSize {
    padding: 0px 0 0 5px;
}

.product div.productMeta {
    float: right;
    width: 200px;
    padding: 5px 10px;
}

.product .preorder {
    font-size: 15px;
    border: 1px solid #e2206e;
    color: #fff;
    display: block;
    float: right;
    padding: 0 20px;
    margin: 0 5px;
    border-radius: 3px;
    line-height: 40px;
    font-weight: bold;
    background: #e2206e;
}

.addProduct {
    font-size: 15px;
    padding-left: 30px;
    color: #2bba3a;
    display: block;
    margin: 0 10px;
    border-radius: 3px;
    line-height: 40px;
    font-weight: bold;
    width: 200px;
    background: url(../images/green-bend-arrow.png) no-repeat left center;
}

.search {
    float: right;
    margin-right: 20px;
    line-height: 38px;
    border: 1px solid #ebebeb;
    background: #fff;
    position: relative;
    width: 500px;
    height: 38px;
}

.search input[type=text] {
    height: 34px;
    box-sizing: border-box;
    width: 140px;
    border: 0;
    padding: 0 10px 0 10px;
    margin: 0;
    display: inline-block;
    font-size: 16px;
    color: #000000;
    font-family: inherit
}

.search input[type=text].datepicker {
    text-align: center;
}

.search a {
    display: block;
    width: 30px;
    height: 38px;
    background: url(../images/search.png) no-repeat center;
    position: absolute;
    right: 0;
    top: 0;
}

.customers .search,
.suppliers .search,
.products .search {
    width: 250px;
}

.customers .search input[type=text],
.suppliers .search input[type=text],
.products .search input[type=text] {
    width: 100%;
}

.saveOptions {
    font-size: 0;
    line-height: 0;
    text-align: right;
    margin: 10px 0;
}

.saveOptions a {
    font-size: 15px;
    border: 1px solid #999;
    color: #999;
    display: inline-block;
    padding: 0 20px;
    margin: 0 5px;
    border-radius: 3px;
    line-height: 40px;
    font-weight: bold;
}

.saveOptions a:last-child {
    margin-right: 0;
}

.saveOptions a.red {
    border-color: #cc496b;
    color: #cc496b;
}

.saveOptions a.black {
    border-color: #333645;
    color: #333645;
}

.saveOptions a.blue {
    border-color: #2d7fbb;
    color: #2d7fbb;
}

.saveOptions a.green {
    border-color: #2bba3a;
    color: #2bba3a;
}

.saveOptions a.red.solid {
    background: #cc496b;
    color: #fff;
}

.saveOptions a.black.solid {
    background: #333645;
    color: #fff;
}

.saveOptions .deleteButton {
    float: left;
}

.deleteLines {
    float: left;
    line-height: 40px;
}

.loader {
    margin: 0px auto;
    display: block;
    padding: 30px 0;
}

.acc-tab {
    margin: 10px 0;
}

.acc-tab>div:first-child {
    background: #333645;
    line-height: 60px;
    font-size: 18px;
    color: #fff;
    padding: 0 0px;
    font-weight: bold;
    cursor: pointer;
}

.acc-tab>div:first-child:before {
    content: '';
    background: url(../images/down-arrow.png) no-repeat center;
    width: 14px;
    height: 60px;
    float: left;
    margin: 0 20px;
}

.acc-tab.active>div:first-child:before {
    background-image: url(../images/up-arrow.png);
}

.acc-tab.noclose>div:first-child:before {
    background: none;
    margin: 0;
    width: 20px;
}

.acc-tab>div:nth-child(2) {
    display: none;
    background: #fff;
}

.acc-tab.active>div:nth-child(2),
.acc-tab.noclose>div:nth-child(2) {
    display: block;
}

.acc-tab.border>div:nth-child(2) {
    border: 1px solid #ebe9e9;
    border-width: 0 1px 1px;
    padding: 10px;
}

.users .acc-tab {
    border: 1px solid #ebe9e9;
}

.users .acc-tab:not(.active):hover {
    border-color: #d8d7d7;
}

.users .acc-tab:not(.active):hover>div:first-child {
    background-color: #fafafa;
}

.users .acc-tab>div:first-child {
    background: #ffffff url('../images/user.png') no-repeat 10px center;
    color: #333645;
    height: 60px;
    padding-left: 50px;
    font-size: 0;
    line-height: 0;
    font-weight: normal;
}

.users .acc-tab>div:first-child>div {
    font-size: 16px;
    line-height: 60px;
    display: inline-block;
    vertical-align: middle;
}

.users .acc-tab>div:first-child>div:first-child {
    width: 300px;
    font-weight: bold;
}

.users .acc-tab>div:first-child>div:nth-child(2) {
    width: 400px;
}

.users .acc-tab>div:first-child>div:nth-child(3) {
    width: 200px;
    color: #2bba3a;
    font-size: 14px;
}

.users .acc-tab>div:first-child>div:nth-child(3).inactive {
    color: #d36582;
}

.users .acc-tab>div:first-child:before {
    float: right;
    background: none;
    font-size: 30px;
    color: #000;
    content: '+';
    text-align: center;
    line-height: 60px;
}

.users .acc-tab.active>div:first-child:before {
    content: '-';
}

.users .acc-tab.active>div:first-child {
    border-bottom: 1px dashed #d6d7da;
}

.users .acc-tab>div:nth-child(2) {
    padding: 0px;
    font-size: 0;
    line-height: 0;
}

.users .acc-tab>div:nth-child(2)>div:not(.clear) {
    display: inline-block;
    width: 500px;
    padding: 20px 20px 0;
    font-size: 16px;
    box-sizing: border-box;
    vertical-align: top;
    line-height: 40px;
}

.users .acc-tab>div:nth-child(2)>div:nth-child(2) {
    width: 400px;
}

.users .acc-tab>div:nth-child(2)>div:nth-child(3) {
    width: 200px;
    padding-right: 10px;
}

.users .permissionTable>div {
    display: flex;
}

.users .permissionTable>div>div:not(:first-child) {
    width: 60px;
}

.users .permissionTable>div>div:first-child {
    flex: 1 1;
}

.users .permissionTable>div:first-child>div {
    font-weight: bold;
}

.editForm label {
    display: block;
    float: left;
    width: 220px;
    overflow: hidden;
    line-height: 50px;
}

.editForm input[type=text],
.editForm input[type=password],
.editForm input[type=email],
.editForm input[type=date],
.editForm select,
.editForm textarea {
    width: 920px;
    max-width: 100%;
    padding: 0 5px;
    height: 30px;
    margin: 10px 0;
    box-sizing: border-box;
    border: 1px solid #d7d7d7;
    float: left;
    font-family: inherit;
    font-size: 14px;
}

.editForm select {
    padding: 0;
}

.editForm textarea {
    height: 120px;
    resize: none;
}

.editForm input[type=number] {
    padding: 0 0 0 5px;
    height: 30px;
    margin: 10px 20px 10px 0;
    width: 100px;
    box-sizing: border-box;
    border: 1px solid #d7d7d7;
    float: left;
}

.users .editForm label {
    width: 140px;
    font-size: 16px;
    color: #333645;
}

.inputcontrol {
    position: relative;
    width: 320px;
    float: left;
}

.inputcontrol input[type=text],
.inputcontrol input[type=email] {
    width: 100%;
    margin: 5px 0;
    height: 40px;
    color: #333645;
    border: 1px solid #333645;
}

.inputcontrol input[type=text]:disabled,
.inputcontrol input[type=email]:disabled {
    background: #fff;
    color: #7f7f80;
    border: 1px solid #d7d7d7
}

.editField,
.inputcontrol .saveField,
.inputcontrol .resetField {
    width: 30px;
    height: 38px;
    border: 1px solid #d7d7d7;
    background: #f6f5f5 url(../images/edit.png) no-repeat center;
    position: absolute;
    right: 0;
    top: 5px;
    display: block;
    z-index: 1;
}

.inputcontrol .saveField {
    background-image: url(../images/check.png);
    border: 1px solid #333645;
    display: none;
    z-index: 2;
}

.inputcontrol .saveField.noSave {
    background-image: url(../images/wrong.png);
}

.inputcontrol .resetField {
    background-image: url(../images/reset.png);
}

.editField.hidden {
    display: none;
}

.customers .editField {
    height: 30px;
    top: 10px;
}

.editFieldBox {
    position: absolute;
    top: 50px;
    border: 1px solid #d8d6d6;
    background: #fff;
    background: #fff;
    left: calc(50% - 250px);
    z-index: 1000;
    width: 500px;
    box-shadow: 0 0 10px #333645;
    border-radius: 5px;
    padding: 10px;
}

.users .acc-tab>div:nth-child(2)>div.saveOptions {
    float: right;
    margin: 0 10px 10px;
    display: block;
    width: auto;
    padding: 0;
}

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    padding-top: 300px;
    box-sizing: border-box;
    z-index: 1000;
    display: none;
}

.viewPager {
    float: right;
    margin: 10px 0;
    border: 1px solid #ebebeb;
    background: #fff;
    color: #333645;
    font-size: 0;
    line-height: 0;
    text-align: right;
}

.viewPager>div:not(.clear) {
    display: inline-block;
    font-size: 14px;
    line-height: 38px;
    color: #333645;
    background: #fff;
    vertical-align: top;
    text-align: center;
    width: 38px;
    cursor: pointer;
    height: 38px;
    border-right: 1px solid #ebebeb;
}

.viewPager>div.pagerPageActive {
    background: #2d7fbb;
    color: #fff;
}

.viewPager>div.pagerNext {
    background: url(../images/pager-next.png) no-repeat center;
}

.viewPager>div.pagerPrev {
    background: url(../images/pager-prev.png) no-repeat center;
}

.viewPager>div.pagerLast {
    background: url(../images/pager-last.png) no-repeat center;
}

.viewPager>div.pagerFirst {
    background: url(../images/pager-first.png) no-repeat center;
}

.viewPager>div:nth-last-child(2) {
    border: 0;
}

div.red {
    color: #cc496b !important;
}

div.green {
    color: #2bba3a !important;
}

.errorBox {
    font-size: 18px;
    text-align: center;
    color: #cc496b;
    line-height: 40px;
}

.customers .users:after,
.customers .routes:after,
.offers .routes:after,
.suppliers .users:after,
.sales .users:after,
.purchases .users:after {
    content: ' ';
    display: block;
    height: 0;
    clear: both;
    overflow: hidden;
}

.customers .users>div,
.customers .routes>div,
.offers .routes>div,
.suppliers .users>div,
.sales .users>div,
.purchases .users>div {
    float: left;
    margin: 5px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    line-height: 40px;
    font-size: 16px;
    padding: 0 10px;
}

.customers .users>div>div,
.customers .routes>div>div,
.offers .routes>div>div,
.suppliers .users>div>div,
.sales .users>div>div,
.purchases .users>div>div {
    float: left;
    margin-right: 10px;
}

.customers .users>div>a img,
.customers .routes>div>a img,
.offers .routes>div>a img,
.suppliers .users>div>a img {
    vertical-align: middle;
}

.assignUser,
.assignRoute {
    display: inline-block;
    margin: 5px 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    line-height: 40px;
    font-size: 16px;
    padding: 0 10px;
    color: #333645
}

.categorySelection {
    margin: 10px 0;
    background: #f2f0f0;
    border: 1px solid #d3d1d1;
    line-height: 0;
    font-size: 0;
}

.categorySelection ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 0;
    line-height: 0;
}

.categorySelection ul li {
    list-style: none;
    padding: 15px 0px;
    margin: 0;
    display: inline-block;
    position: relative;
}

.categorySelection ul li ul {
    display: none;
    position: absolute;
    top: 50px;
    left: 0;
    border: 1px solid #d3d1d1;
    border-top: 0;
    background: #f2f0f0;
    padding: 0;
    width: 300px;
}

.categorySelection ul li ul li {
    display: block;
    padding: 0;
}

.categorySelection ul li ul li a {
    border: 0;
    line-height: 30px;
}

.categorySelection ul li:hover ul {
    display: block;
}

.categorySelection a {
    display: block;
    font-size: 14px;
    line-height: 20px;
    color: #000000;
    padding: 0 15px;
    border-left: 1px solid #000;
    font-weight: bold;
}

.categorySelection a.active,
.categorySelection li:hover>a {
    color: #3a95d7;
}

.categorySelection>ul>li:first-child>a {
    border: 0;
    padding-left: 10px;
}

.categorySelection a span {
    font-weight: normal;
}

.prodImages {
    font-size: 0;
    line-height: 0;
}

.prodImages a {
    display: inline-block;
    width: 100px;
    height: 100px;
    vertical-align: middle;
    line-height: 100px;
    border: 1px solid #ebe9e9;
    padding: 2px;
    text-align: center;
    margin: 5px;
}

.prodImages a img {
    vertical-align: middle;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}

.fileList {
    line-height: 30px;
    font-size: 16px;
    color: #000099;
    padding: 10px;
    margin: 10px 5px;
    border: 1px solid #ebe9e9;
}

.fileList>div>span {
    float: right;
}

.fileList>div.file-complete {
    color: #009900;
}

.fileList>div.file-failed {
    color: #990000;
}

.prodImageBox {
    position: relative;
    min-height: 110px;
}

.fileUploader {
    display: none;
    background: rgba(0, 0, 0, 0.2);
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 10;
    left: 0;
    top: 0;
    font-size: 20px;
    text-align: center;
    line-height: 40px;
}

.imageViewer {
    display: none;
    position: fixed;
    top: 50px;
    left: calc(50% - 300px);
    background: #fff;
    box-shadow: 0 0 5px #000;
    width: 600px;
    height: 400px;
    z-index: 1001;
}

.imageViewer>div {
    float: left;
}

.imageViewer>div:first-child {
    width: 380px;
    height: 380px;
    padding: 10px;
    line-height: 380px;
    text-align: center;
    border-right: 1px solid #ebe9e9;
}

.imageViewer>div:nth-child(2) {
    width: 179px;
    padding: 10px;
}

.imageViewer>div:first-child>img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    vertical-align: middle;
}

.imageViewer>div:nth-child(2) a {
    font-size: 15px;
    border: 1px solid #999;
    color: #999;
    display: block;
    text-align: center;
    margin: 0 5px 20px;
    border-radius: 3px;
    line-height: 40px;
    font-weight: bold;
}

.imageViewer>div:nth-child(2) a.deleteImage {
    border: 1px solid #cc496b;
    color: #cc496b
}

.orderRef {
    display: inline-block;
    margin: 0 20px;
    font-size: 14px;
    color: #333645;
    font-weight: bold;
    width: 340px;
}

.orderRef input[type=text] {
    float: none;
    width: 270px;
    border: 0;
    background: none;
}

.orderCycle {
    display: inline-block;
    margin: 0 20px;
    font-size: 14px;
    color: #333645;
    font-weight: bold;
    width: 330px;
}

.orderCycle span {
    font-weight: normal;
    margin-right: 10px;
}

.orderCycle a {
    color: #d36582;
    font-size: 12px;
    font-weight: normal;
}

.orderDate {
    display: inline-block;
    margin: 0 0 0 20px;
    font-size: 14px;
    color: #333645;
    font-weight: bold;
    width: 250px;
    text-align: right;
}

.orderDate input[type=text],
.dispatchDate input[type=text] {
    float: none;
    width: 100px;
    border: 0;
    background: none;
    cursor: pointer;
}

.dispatchDate input[type=text] {
    width: 150px;
}

.dispatchDate {
    padding: 0 10px;
}

.editForm input.orderCustomer,
.editForm input.poSupplier {
    width: 320px;
    float: none;
    margin: 0 20px;
    height: 30px;
}

.orderTemplate {
    display: inline-block;
    margin: 0 20px;
    font-size: 14px;
    color: #fff;
    width: 230px;
    position: relative;
}

.orderTemplate span {
    font-weight: normal;
    margin-right: 10px;
}

.orderTemplate>a {
    color: #d36582;
    font-size: 12px;
    font-weight: normal;
}

.orderTemplate>div {
    display: none;
    background: #fff;
    position: absolute;
    top: 60px;
    border: 1px solid #ccc;
    padding: 0 10px;
    font-size: 16px;
    line-height: 20px;
    width: 100%;
    z-index: 100;
}

.orderTemplate>div>div {
    color: #000;
    display: block;
    margin: 10px 0;
    cursor: pointer;
}

.orderTemplate>div>div>a {
    float: right;
    color: #d36582;
    font-weight: bold;
}

.orderTemplate>div>div:hover {
    color: #d36582;
}

.orderStatus {
    display: inline-block;
    margin: 0 0 0 20px;
    font-size: 14px;
    color: #fff;
    font-weight: bold;
    width: 400px;
    text-align: right;
}

.orderStatus select {
    float: none;
    width: 320px;
    margin: 0 0 0 20px;
}

.sales .products .viewTable,
.purchases .products .viewTable,
.forecast .products .viewTable,
.nonorders .viewTable {
    margin-top: 0;
}

.tableBody input[type=number],
.tableBody input[type=input],
.tableBody input[type=email] {
    width: 100% !important;
}

.totals {
    font-size: 18px;
    color: #333645;
    text-align: right;
    line-height: 40px;
    margin-right: 10px;
}

.vatTotal {
    font-size: 14px;
}

.totalContribution {
    color: #444;
    font-size: 9px;
}

.salesCycle,
.purchaseCycle,
.offerCycle {
    float: right;
    margin: 0 20px;
    line-height: 40px;
    font-size: 16px;
}

.salesCycle select,
.purchaseCycle select,
.offerCycle select {
    height: 38px;
    box-sizing: border-box;
    width: 200px;
    margin-left: 10px;
    border: 1px solid #ebebeb;
}

.orderBy {
    float: left;
    margin: 10px 20px 0 0;
    line-height: 40px;
    font-size: 14px;
}

.orderBy select {
    height: 38px;
    box-sizing: border-box;
    width: 200px;
    margin-left: 10px;
}

.fieldOptions {
    width: 100%;
    float: none;
    clear: both;
    margin-top: 10px;
}

.fieldOptions>div:not(.clear) {
    height: 200px;
    overflow-y: scroll;
}

.fieldOptions>a {
    display: block;
    float: right;
    line-height: 20px;
    margin-bottom: 10px;
}

.fieldOptions>div>div:after {
    display: block;
    content: ' ';
    height: 0;
    clear: both;
    overflow: hidden;
}

.fieldOptions>div a {
    display: block;
    float: right;
    width: 30px;
    height: 30px;
    margin: 10px 5px;
}

.fieldOptions>div a.editFOption {
    background: url(../images/edit.png) no-repeat center;
}

.fieldOptions>div a.deleteFOption {
    background: url(../images/delete.png) no-repeat center;
}

.customFields>div>div:not(.clear) {
    width: 600px;
    max-width: 100%;
    box-sizing: border-box;
    float: left;
    font-family: inherit;
    font-size: 14px;
    line-height: 30px;
}

.editForm input[type=radio],
.editForm input[type=checkbox] {
    vertical-align: middle;
    margin: 10px 0;
    height: 30px;
}

select[multiple] {
    height: 90px;
}

.templateForm>div:not(.clear) {
    width: 600px;
    max-width: 100%;
    box-sizing: border-box;
    float: left;
    font-family: inherit;
    font-size: 14px;
    line-height: 30px;
}

.reportButton {
    margin: 10px auto;
    display: block;
    float: right;
    border: 1px solid #2bba3a;
    border-radius: 2px;
    line-height: 38px;
    margin: 0;
    padding: 0 20px;
    color: #2bba3a;
    font-weight: bold;
    font-size: 15px;
    box-sizing: border-box;
}

.ui-front {
    z-index: 100000 !important;
}

.orderLocked {
    border: 1px solid #ffa800;
    background: #fff9ed;
    line-height: 50px;
    margin: 10px 0;
    text-align: center;
    font-size: 16px;
    display: none;
}

.customerOrderList {
    height: 400px;
    overflow-y: scroll;
}

.legend {
    display: flex;
    margin: 10px 0;
    align-items: center;
    justify-content: flex-start !important;
    font-size: 14px !important;
    text-transform: uppercase;
    font-weight: normal !important;
    width: auto !important;
}

.legend>div {
    display: flex;
    align-items: center;
    margin-right: 20px;
    width: auto !important;
}

.legend>div>div:first-child {
    width: 30px;
    height: 30px;
    margin-right: 10px;
}

.printIcon {
    float: right;
    margin: 0 5px;
}

.addPO {
    float: left;
    margin: 0 10px 0 0;
    line-height: 26px;
}

.printIcon img {
    height: 30px;
    width: auto;
}

.addPO img {
    vertical-align: middle;
}

.conflictMessage {
    color: #990000;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #900;
    line-height: 40px;
    text-align: center;
    clear: both;
}