/* Minification failed. Returning unminified contents.
(18,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(19,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(20,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(21,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(22,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(23,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(24,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(25,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(26,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(27,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(28,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(29,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(30,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(31,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(32,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(33,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(34,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(35,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(36,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(37,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(38,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(39,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(40,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(41,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(42,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(43,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(44,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(45,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(46,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(54,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(99,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(103,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(107,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(111,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(127,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(131,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(135,16): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(139,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(140,16): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(143,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(144,16): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(145,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(146,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(151,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(152,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(156,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(198,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(222,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(528,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(529,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(558,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(563,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(568,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(586,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(592,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(607,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(626,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(627,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(632,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(633,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(634,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(638,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(642,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(646,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(650,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(677,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(678,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(682,32): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(686,32): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(690,32): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(698,16): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(702,19): run-time error CSS1046: Expect comma, found '158'
(702,26): run-time error CSS1046: Expect comma, found ')'
(706,16): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(710,16): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(714,16): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(718,28): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(725,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(779,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(789,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(791,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(801,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(803,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(810,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(818,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(820,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(827,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(835,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(837,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(843,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(845,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(849,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(858,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(866,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(868,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(875,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(883,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(885,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(892,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1160,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1164,32): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1207,22): run-time error CSS1039: Token not allowed after unary operator: '-overlay-textbox-bg'
(1209,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1246,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(1267,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1303,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1326,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1332,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1338,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1350,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1356,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1362,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1388,22): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(1389,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(1398,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1399,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1403,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1424,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1442,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1454,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1471,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1474,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1475,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1476,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1480,17): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-invert-color'
(1481,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(1482,24): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(1487,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1488,24): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1519,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1531,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1733,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1769,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1774,28): run-time error CSS1039: Token not allowed after unary operator: '-dark-grey-color'
(1803,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1809,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1817,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1823,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1825,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1830,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1834,21): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1838,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1842,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1846,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1851,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(1869,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(1877,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2028,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2030,28): run-time error CSS1039: Token not allowed after unary operator: '-tertiary-color'
(2047,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2049,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2090,17): run-time error CSS1039: Token not allowed after unary operator: '-mid-grey-color'
(2103,17): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(2107,27): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2111,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(2122,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2123,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2138,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2142,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2143,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-invert-color'
(2146,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
 */
/* ADMIN */
/*@font-face {
    font-family: 'Phoenix Sans Regular';
    font-style: normal;
    font-weight: normal;
    src: url(/Content/fonts/PhoenixSans-Regular.woff2) format('woff2');
}

@font-face {
    font-family: 'Phoenix Sans Medium';
    font-style: italic;
    font-weight: normal;
    src: url(/Content/fonts/PhoenixSans-Medium.woff2) format('woff2');
}*/
@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Sans:ital,wght@0,100..800;1,100..800&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");
:root {
    --primary-color: #0A2F73;
    --primary-invert-color: #ffffff;
    --primary-color-hover: #ff455d;
    --secondary-color: #2140CE;
    --secondary-invert-color: #ffffff;
    --tertiary-color: #ADCCFB;
    --tertiary-invert-color: #0A1A50;
    --overlay-textbox-bg: rgba(255, 255, 255, 0.83);
    --grey-color: #f0f0f0;
    --dark-grey-color: #585858;
    --mid-grey-color: #898989;
    --light-grey-color: #b7b7b7;
    --primary-highlight: #000f3d;
    --primary-inverted-color: #fff;
    --warning-color: #930f0f;
    --go-active-color: green;
    --ready-color: orange;
    --inactive-color: #464646;
    --disabled-color: #978484;
    --bs-modal-color: #0A2F73;
    --bs-modal-bg: #f0f0f0;
    --bs-modal-border-width: 1px;
    --bs-modal-border-color: #898989;
    --bs-modal-border-radius: 8px;
    --bs-modal-width: 800px;
    --bs-btn-hover-color: #0A2F73;
    --bs-btn-hover-bg: #ffffff;
    --bs-btn-border-color: #0A2F73;
    --highlight-color: #FFBB00;
}

body {
    padding-top: 0px;
    padding-bottom: 0px;
    font-family: 'Phoenix Sans Regular', Helvetica, Arial, sans-serif;
    font-size: 16px;
    color: var(--primary-color);
}

.header-logo-company {
    height: 100%;
}

.header-logo-brand {
    height: 100%;
}

.header-loggedinuser {
    top: -8px;
    text-align: right;
}

.navbar-icontext {
    display: none;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.valign-top {
    vertical-align: top;
}

.valign-mid {
    vertical-align: middle;
}

.center {
    text-align: center;
}

.white {
    color: #fff;
}

.warning {
    color: var(--primary-color);
}

a.warning {
    color: var(--primary-color);
}

    a.warning:hover {
        color: var(--primary-color);
    }

    a.warning:visited {
        color: var(--primary-color);
    }

.warning-fill {
    fill: #f0ad4e;
}

.new-fill {
    fill: #f0ad4e;
}

.error {
    color: red;
}

.redeemcode-color {
    color: var(--primary-color);
}

.offers-color {
    color: var(--primary-color);
}

.offer-fill {
    fill: var(--primary-color);
}

.dark {
    color: var(--primary-color);
    fill: var(--primary-color);
}
.button-primary, .button-primary:hover, .button-primary:active, .button-primary:visited {
    color: var(--primary-invert-color) !important;
    fill: var(--primary-invert-color) !important;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    padding:3px !important;
}
.btn-warning, .btn-warning:hover, .btn-warning:active, .btn-warning:visited {
    color: #fff !important;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.btn-grey, .btn-grey:hover, .btn-grey:active, .btn-grey:visited {
    color: var(--primary-color) !important;
    background-color: #898d8d !important;
}

.highlight {
    color: #3F9CE2;
    fill: #3F9CE2;
}

.phoenix-default {
    color: #331e38;
}

.phoenix-dgrey {
    color: #898d8d;
}

.phoenix-grey {
    color: #d9d9d6;
}

.phoenix-main {
    color: #dde5ed;
}

.phoenix-white {
    color: #fff;
}

.phoenix-default-bg {
    background-color: #331e38;
}

.phoenix-dgrey-bg {
    background-color: #898d8d;
}

.phoenix-grey-bg {
    background-color: #d9d9d6;
}

.phoenix-main-bg {
    background-color: var(--tertiary-color);
}

.phoenix-white-bg {
    background-color: #fff;
}

.italic {
    font-style: italic;
}

.bold {
    font-weight: bold;
}

.uppercase {
    text-transform: uppercase;
}

.txt {
    font-size: 1.1em;
    padding: 5px;
    text-transform: uppercase;
    border-radius: 4px;
    border: 1px solid var(--primary-color);
}

a, a:active, a:hover {
    color: #331e38;
}

.pad-lf-5 {
    padding-left: 5px;
}

.pad-lf-10 {
    padding-left: 10px;
}

.pad-rg-5 {
    padding-right: 5px;
}

.pad-rg-10 {
    padding-right: 10px;
}

.pad-rg-15 {
    padding-right: 15px;
}

.pad-bt-5 {
    padding-bottom: 5px;
}

.pad-bt-10 {
    padding-bottom: 10px;
}

.pad-tp-5 {
    padding-top: 5px;
}

.pad-tp-10 {
    padding-top: 10px;
}
.pad-x-5 {
    padding-left: 5px;
    padding-right: 5px;
}
.pad-x-10 {
    padding-left: 10px;
    padding-right: 10px;
}
.pad-x-15 {
    padding-left: 15px;
    padding-right: 15px;
}
.pad-y-5 {
    padding-top: 5px;
    padding-bottom: 5px;
}
.pad-y-10 {
    padding-top: 10px;
    padding-bottom: 10px;
}
.pad-y-15 {
    padding-top: 15px;
    padding-bottom: 15px;
}
.pad-10 {
    padding: 10px;
}

.pad-20 {
    padding: 20px;
}

.marg-lf-10 {
    margin-left: 10px;
}

.marg-rg-10 {
    margin-right: 10px;
}

.marg-bt-10 {
    margin-bottom: 10px;
}

.marg-tp-10 {
    margin-top: 10px;
}

.marg-10 {
    margin: 10px;
}

.float-right {
    float: right;
}

.float-left {
    float: left;
}

.top-minus5 {
    top: -5px;
    position: relative;
}

.top-minus10 {
    top: -10px;
    position: relative;
}

.hidden {
    display: none;
}

.font-md {
    font-size: 1.1em;
}

.font-lg {
    font-size: 1.2em;
}

.show {
    display: inline-block !important;
}

.showlink {
    display: inline;
}

.badge {
    padding: 0.3em 0.6em 0.3em !important;
}

.badge {
    margin-left: 0.3em;
    border-radius: 0.95em !important;
}

.label-small {
    font-size: 45%;
}

.label-medium {
    font-size: 95%;
}

.label-new {
    background-color: #3F9CE2;
    color: #fff;
}

.label-new-inverse {
    background-color: #000;
    color: #fff;
}

.label-sale {
    background-color: #dd8e38;
    color: #fff;
}

.label-free {
    background-color: #dd8e38;
    color: #fff;
}

.label-grey {
    background-color: #9d9d9d;
    color: #fff;
}

.label-inbasket {
    background-color: #9d9d9d;
    color: #fff;
}

.label-basket-wrapper {
    top: -5px;
    position: relative;
}

.label-basket {
    font-size: 100% !important;
    margin-left: 0em;
    margin-right: 0.3em;
    border-radius: 0.95em !important;
    /*background-color: #dde5ed;
    color: #000;*/
    background-color: #000;
    color: #fff;
}

.label-filter {
    font-size: 1em;
    background-color: #dde5ed;
    color: #000;
}

.label-filter-box {
    top: -5px;
    position: relative;
}

.flaggeditem {
    display: inline;
    padding: 0.2em 0.6em 0.3em;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25em;
    background-color: #f0ad4e;
}
/* Wrapping element */
.dxgvSearchPanel_ourbrand .dxeButtonEdit_ourbrand {
    /*padding:10px !important;*/
}

    .dxgvSearchPanel_ourbrand .dxeButtonEdit_ourbrand td.dxic {
        padding: 15px 8px 17px 12px !important;
    }
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

.row {
    margin-left: 0px;
    margin-right: 0px;
}

.container-home-header {
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.body-content-spacer {
    padding-top: 15px !important;
}

.hr {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
}
/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.greyout {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity: 0.5;
}
/* Set widths on the form inputs since otherwise they're 100% wide */
input.form-control[type="text"],
input.form-control[type="password"],
input.form-control[type="email"],
input.form-control[type="tel"],
input.form-control[type="select"] {
    max-width: 280px;
}

input[type="radio"], input[type="checkbox"] {
    margin-right: 5px !important;
}

input.templater {
    padding: 6px 8px 7px 7px;
    box-sizing: border-box;
    background-color: white;
    border: 1px solid #DCDCDC;
    font-family: 'Phoenix Sans Medium', Helvetica, Arial, sans-serif !important;
    font-size: 14px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
    width: 95%;
}

a.no-underline {
    text-decoration: none;
}

    a.no-underline:hover {
        text-decoration: none;
    }

.preview-button {
    padding: 6px 18px 6px;
    border: 1px dotted transparent;
    color: var(--primary-invert-color);
    background-color: var(--primary-color);
    -moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
    -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -o-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
    font: 14px 'Phoenix Sans Medium',sans-serif;
    font-weight: normal;
    font-weight: bold;
    -webkit-transition-property: box-shadow, background-color;
    -moz-transition-property: box-shadow, background-color;
    -o-transition-property: box-shadow, background-color;
    transition-property: box-shadow, background-color;
    -webkit-transition-duration: .3s;
    -moz-transition-duration: .3s;
    -o-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    -webkit-tap-highlight-color: transparent;
}

a.preview-button:hover {
    text-decoration: none;
    color: var(--primary-invert-color);
}

a.preview-button:active {
    text-decoration: none;
    color: var(--primary-invert-color);
}

a.preview-button:visited {
    text-decoration: none;
    color: var(--primary-invert-color);
}
/* Set widths on the form inputs since otherwise they're 100% wide */
/*input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="select"] {
    max-width: 280px;
}*/
/*OAUTH - START*/
.oauth {
    width: 300px;
    display: inline;
}

.Microsoft {
    background-color: #0366d6;
    color: var(--primary-invert-color);
    min-width: 350px;
}

.Google {
    background-color: #fff;
    color: var(--primary-color);
    min-width: 350px;
}
/*OAUTH - END*/

.bg-aberdeen-dark-blue {
    background: #002664;
}

.bg-aberdeen-gradient-1 {
    background-image: -webkit-gradient(linear,right top,left top,from(#002664),to(#1a9ce3));
    background-image: linear-gradient(to left,#002664,#1a9ce3);
}
/*HEADER - START*/
.navbar {
    background-color: var(--primary-color);
    /*border-color: #ddd;*/
    color: #0366d6;
    min-height: 70px;
    padding:0px;
}

.navbar-container {
    width: 100%;
    padding: 0px 10px 0px 10px;
    border-bottom: 1px solid #331e38;
}

.navbar-header {
    height: 100%;
    /*background-color: var(--primary-color);
    border-color:var(--primary-color);
    color: var(--primary-invert-color);*/
    /*background-color: var(--primary-invert-color);*/
    border-color: var(--primary-invert-color);
    color: var(--primary-color);
    /*padding-top:10px;*/ /*Removed for abrdn branding*/
}

.navbar-inverse {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--primary-invert-color);
}

    .navbar-inverse .navbar-nav > li > a {
        color: var(--primary-invert-color);
    }

        .navbar-inverse .navbar-nav > li > a:active {
            color: var(--primary-invert-color);
        }

        .navbar-inverse .navbar-nav > li > a:hover {
            color: var(--primary-invert-color);
        }

        .navbar-inverse .navbar-nav > li > a:visited {
            color: var(--primary-invert-color);
        }

.navbar-brand {
    padding: 2px 5px 2px 5px;
}

.navbar-brand-company {
    height: 88px;
    padding: 2px 5px 2px 5px !important;
}

.navbar-brand-site {
    height: 88px;
    padding: 12px 15px 12px 5px !important;
}

.navbar-nav {
    /*padding-top: 18px;*/
    padding-top: 24px;
}

.navbar-icons {
    margin-left: 20px;
}

.navbar-inverse .navbar-toggle {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

    .navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
        background-color: var(--primary-color);
    }

    .navbar-inverse .navbar-toggle .icon-bar {
        background-color: var(--primary-color);
    }

    .navbar-inverse .navbar-toggle:hover .icon-bar {
        background-color: var(--primary-invert-color);
    }
/*.icon-bar {
    background-color: #0366d6;
    color: #0366d6;
}*/
.header-icon {
    /*fill: #002664;*/
    fill: var(--primary-invert-color);
}

.header-icon-disabled {
    fill: rgb(158 158 158);
}

.white-fill {
    fill: var(--primary-invert-color);
}

.black-fill {
    fill: var(--primary-color);
}

.pagetitle-icon-fill {
    fill: var(--primary-color);
}

.history-bar {
    background-color: var(--secondary-color);
    padding: 5px 10px 5px 20px;
    width: 100%;
    /*border-bottom:1px solid #ddd;*/
}

    .history-bar a {
        color: var(--primary-invert-color);
    }

.nav > li > span.account {
    position: relative;
    display: block;
    padding: 10px 15px;
}

.navbar-nav > li > span.account {
    line-height: 20px;
    padding-top: 15px;
    padding-bottom: 15px;
    color: #000;
}

/*HEADER - END*/
/*PAGE TITLE - START*/

.header-flex {
    display: flex;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}

.header-flex-logos {
}

.header-flex-acount {
    color: #ffffff;
}

a.accountname, a.accountname:visited, a.accountname:active, a.accountname:hover {
    margin-right: 15px;
    color: #ffffff;
    text-decoration: none;
}

a.logoffandon, a.logoffandon:visited, a.logoffandon:active, a.logoffandon:hover {
    margin-left: 15px;
    margin-right: 5px;
    color: #ffffff;
    text-decoration: none;
}

.pagetitle-flex {
    display: flex;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
}

.pagetitle-flex-title {
    color: var(--primary-color);
    padding-left: 10px;
    font-size: 1.9em;
}

.pagetitle-flex-icon {
    padding: 0px;
}

.pagetitle-flex-outer {
    background-color: var(--tertiary-color);
    height: 50px;
    color: var(--tertiary-invert-color);
}

.pagetitle-icon {
    padding-top: 6px;
}

.pagetitle-images {
    /*background-image: url(../Content/Images/home_title_images.png);
    background-size: cover;*/
    background-color: var(--tertiary-color);
    height: 50px;
    color: var(--tertiary-invert-color);
}

.pagetitle-images-title {
    width: 1187px;
    margin-left: auto;
    margin-right: auto;
    color: var(--primary-color);
    padding: 5px 10px 0px 10px;
    font-size: 1.9em;
}

.pagetitle-branding {
    /*background-image: url(../Content/Images/home_title_branding.png);
    background-size: cover;*/
    background-color: var(--tertiary-color);
    height: 50px;
    color: var(--tertiary-invert-color);
}

.pagetitle-branding-title {
    width: 1187px;
    margin-left: auto;
    margin-right: auto;
    color: var(--primary-color);
    padding: 5px 10px 0px 10px;
    font-size: 1.9em;
}

.pagetitle-merch {
    /*background-image: url(../Content/Images/home_title_merchandise.png);
    background-size: cover;*/
    background-color: var(--tertiary-color);
    height: 50px;
    color: var(--tertiary-invert-color);
}

.pagetitle-merch-item {
    /*background-image: url(../Content/Images/home_title_merchandise.png);
    background-size: cover;*/
    background-color: var(--tertiary-color);
    height: 50px;
    color: var(--tertiary-invert-color);
}

.pagetitle-merch-item-title {
    color: var(--primary-color);
    font-size: 2em;
    padding-top: 4px;
}

.pagetitle-merch-title {
    width: 1187px;
    margin-left: auto;
    margin-right: auto;
    color: var(--primary-color);
    padding: 5px 10px 0px 10px;
    font-size: 1.9em;
}

.pagetitle-toolkits {
    /*background-image: url(../Content/Images/home_title_toolkits.png);
    background-size: cover;*/
    background-color: var(--tertiary-color);
    height: 50px;
    color: var(--tertiary-invert-color);
}

.pagetitle-toolkits-title {
    width: 1187px;
    margin-left: auto;
    margin-right: auto;
    color: var(--primary-color);
    padding: 5px 10px 0px 10px;
    font-size: 1.9em;
}

.pagetitle-help {
    /*background-image: url(../Content/Images/home_title_help.png);
    background-size: cover;*/
    background-color: var(--tertiary-color);
    height: 50px;
    color: var(--tertiary-invert-color);
}

.pagetitle-help-title {
    width: 1187px;
    margin-left: auto;
    margin-right: auto;
    color: var(--primary-color);
    padding: 5px 10px 0px 10px;
    font-size: 1.9em;
}
/*PAGE TITLE - END*/

.verticalHeader {
    /*-webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);*/
}
/*MAIN - START*/
.messagebox-popup {
    width: 600px !important;
}

.messagebox-popup-header {
    font-size: 1.1em;
}

.messagebox-popup-subtext {
    font-size: 0.9em;
}

.body-container-home {
    min-height: calc(100vh - (100px + 100px));
    /*margin-top: 40px;*/
    margin-top: 30px;
}

.body-container {
    /*min-height: calc(100vh - (100px + 160px));
    margin-top: 60px;*/
    min-height: calc(100vh - (100px + 150px));
    /*margin-top: 50px;*/
}

.body-content {
    /*min-height: calc(100vh - (70px + 150px));*/
}

.spacer {
    height: 20px;
}

.w-100 {
    width: 100%;
}

.filterrow {
    color: #002664;
}

.dx-ac {
}

.dxbButton_ourbrand.dxbTSys {
    margin: 5px;
}

.dxgvCommandColumn_ourbrand {
    text-align: center;
    display: grid !important;
}

.dxbButton_ourbrand[class~="dxgvCommandColumnItem_ourbrand"], .dxgvStatusBar_ourbrand div.dxbButton_ourbrand, .dxgvEditFormTable_ourbrand div.dxbButton_ourbrand {
    margin: 5px;
}

.greyout {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    filter: grayscale(100%);
    opacity: 0.5;
}

.carousel {
    position: relative;
}

.carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.carousel-item {
    position: relative;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    transition: -webkit-transform .6s ease;
    transition: transform .6s ease;
    transition: transform .6s ease,-webkit-transform .6s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    perspective: 1000px;
}

    .carousel-item-next, .carousel-item-prev, .carousel-item.active {
        display: block;
    }

.carousel-item-next, .carousel-item-prev {
    position: absolute;
    top: 0;
}

    .carousel-item-next.carousel-item-left, .carousel-item-prev.carousel-item-right {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

@supports ((-webkit-transform-style:preserve-3d) or (transform-style:preserve-3d)) {
    .carousel-item-next.carousel-item-left, .carousel-item-prev.carousel-item-right {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
    }
}

.active.carousel-item-right, .carousel-item-next {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}

@supports ((-webkit-transform-style:preserve-3d) or (transform-style:preserve-3d)) {
    .active.carousel-item-right, .carousel-item-next {
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0);
    }
}

.active.carousel-item-left, .carousel-item-prev {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}

@supports ((-webkit-transform-style:preserve-3d) or (transform-style:preserve-3d)) {
    .active.carousel-item-left, .carousel-item-prev {
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0);
    }
}

.carousel-control-next, .carousel-control-prev {
    position: absolute;
    top: 0;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 15%;
    color: #fff;
    text-align: center;
    opacity: .5;
}

    .carousel-control-next:focus, .carousel-control-next:hover, .carousel-control-prev:focus, .carousel-control-prev:hover {
        color: #fff;
        text-decoration: none;
        outline: 0;
        opacity: .9;
    }

.carousel-control-prev {
    left: 0;
}

.carousel-control-next {
    right: 0;
}

.carousel-control-next-icon, .carousel-control-prev-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: transparent no-repeat center center;
    background-size: 100% 100%;
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}

.carousel-indicators {
    position: absolute;
    right: 0;
    bottom: 10px;
    left: 0;
    z-index: 15;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 0;
    margin-right: 15%;
    margin-left: 15%;
    list-style: none;
}

    .carousel-indicators li {
        position: relative;
        -webkit-box-flex: 0;
        -ms-flex: 0 1 auto;
        flex: 0 1 auto;
        width: 30px;
        height: 3px;
        margin-right: 3px;
        margin-left: 3px;
        text-indent: -999px;
        background-color: rgba(255,255,255,.5);
    }

        .carousel-indicators li::before {
            position: absolute;
            top: -10px;
            left: 0;
            display: inline-block;
            width: 100%;
            height: 10px;
            content: "";
        }

        .carousel-indicators li::after {
            position: absolute;
            bottom: -10px;
            left: 0;
            display: inline-block;
            width: 100%;
            height: 10px;
            content: "";
        }

    .carousel-indicators .active {
        background-color: #fff;
    }

.carousel-caption {
    position: absolute;
    bottom: 0px;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: var(--primary-color);
    text-align: left;
    background-color: #fff;
    width: 50%;
    border-top: 5px solid var(--secondary-color);
    text-shadow: none;
    font-size: 2em;
    font-weight: lighter;
    padding: 20px;
}

.admin-header {
    font-size: 1.4em;
    padding-top: 20px;
}
/*MAIN - END*/
/*HOME - START*/
.home-admin-btn {
    height: 150px;
}

.home-btn {
    /*height: 200px;*/
    height: 100px;
    border-radius: 8px;
}

.home-btn-200 {
    height: 200px;
}

.home-btn-lrg {
    height: 400px;
}

.home-btn-bar {
    /*padding-top: 100px;*/
    padding-top: 0px;
}

.home-btn-bar-lrg {
    padding-top: 300px;
}

.home-btn-text {
    padding: 5px 15px;
    /*background: rgba(0,38,100,.75);*/
    background: var(--overlay-textbox-bg);
    /*color: #fff;*/
    color: var(--primary-color);
    height: 100px;
    font-weight: bold;
    margin-bottom: 5px;
}

.home-btn-text-title {
    font-size: 1.3em;
    line-height: 1.2em;
}

.home-btn-text-desc {
    font-size: 1em;
    margin: 0px;
}

.home-btn-images {
    /*background-image: url(/Content/images/home/imagery.jpg);
    background-size: cover;*/
}

    .home-btn-images a:hover, a:visited, a:active {
        text-decoration: none;
    }

.home-btn-branding {
    /*background-image: url(/Content/images/home/templater.jpg);
    background-size: cover;*/
}

    .home-btn-branding a:hover, a:visited, a:active {
        text-decoration: none;
    }

.home-btn-merch {
    /*background-image: url(/Content/images/home/merchandise-1.jpg);
    background-size: cover;*/
    background-color: var(--tertiary-color);
}

    .home-btn-merch a:hover, a:visited, a:active {
        text-decoration: none;
    }

.home-btn-toolkits {
    /*background-image: url(/Content/images/home/toolkits.jpg);
    background-size: cover;*/
}

    .home-btn-toolkits a:hover, a:visited, a:active {
        text-decoration: none;
    }

.home-btn-help {
    background-image: url(/Content/images/home/help-1.jpg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: var(--primary-color);
}

    .home-btn-help a:hover, a:visited, a:active {
        text-decoration: none;
    }

.home-btn-experience {
    /*background-image: url(/Content/images/home/experience-1.jpg);
    background-size: cover;*/
}

    .home-btn-experience a:hover, a:visited, a:active {
        text-decoration: none;
    }

.home-block-svg-inline {
    position: relative;
    top: -2px;
}

.help-block-svg-inline {
    position: relative;
    top: -2px;
}

.help-btn-generic {
}

    .help-btn-generic a:hover, a:visited, a:active {
        text-decoration: none;
    }

.help-btn-generic-text {
    padding: 10px 20px;
    background: rgba(221,229,237,0.9);
    color: var(--primary-color);
    height: 100px;
}

.help-btn-generic-text-title {
    font-size: 1.3em;
}

.help-btn-generic-text-desc {
}

.table-home-style3 {
    width: 100%;
}

.td-home-admin-block {
    width: 50%;
    background-color: #fff;
    padding: 10px 20px;
}

.td-home-admin-img {
    width: 50%;
    background-color: var(--primary-color);
}

.home-admin-title {
    margin: 0px;
    padding-bottom: 10px;
    color: var(--primary-color);
    font-size: 1.5em;
}

.home-admin-text {
    padding-bottom: 10px;
    color: var(--primary-color);
    font-size: 1em;
}

.td-home-style3-block {
    width: 50%;
    background-color: #fff;
    padding: 10px;
}

.td-home-style3-img {
    width: 50%;
    background-color: var(--primary-color);
}

.home-style3-title {
    margin: 0px;
    padding-bottom: 10px;
    color: var(--primary-color);
    font-size: 1.3em;
}

.home-style3-text {
    padding-bottom: 10px;
    color: var(--primary-color);
    font-size: 1em;
}

.btn-home-style3 {
    display: inline-block;
    margin-bottom: 0;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    -webkit-transition: ease .2s;
    transition: ease .2s;
    transition-property: all;
    -webkit-transition-property: border,background,color;
    transition-property: border,background,color;
    line-height: 1.42857143;
    font-size: 15px;
    text-decoration: none;
    border: 2px solid #1e90ff;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    position: relative;
    font-weight: 600;
    background: var(--tertiary-color);
    color: var(--tertiary-invert-color);
    border: 2px solid transparent;
    padding: 9px 13px;
    padding-right: 13px;
    text-overflow: auto;
}

    .btn-home-style3:hover {
        text-decoration: none;
        background: var(--primary-color);
        color: var(--primary-invert-color);
    }
/*HOME - END*/
.filterrow {
    color: var(--primary-color);
}

.btn-filter:hover, .btn-filter:focus, .btn-filter.focus {
    color: #898d8d;
    border: 1px solid #898d8d;
    text-decoration: none;
}

.btn-filter {
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    background-color: #fff;
    border: 1px solid var(--primary-color);
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.btn-active:hover, .btn-active:focus, .btn-active.focus {
    color: #898d8d;
    border: 1px solid #898d8d;
    text-decoration: none;
}

.btn-active {
    color: var(--primary-color);
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    background-color: #fff;
    border: 1px solid var(--primary-color);
    padding: 6px 12px 4px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.btn-white {
    background-color: #fff !important;
}

.btn-warn {
    background-color: #898d8d !important;
    color: var(--primary-color);
}
.btn {
    color: var(--primary-invert-color) !important;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.btn-tertiary {
    color: var(--tertiary-invert-color) !important;
    background-color: var(--tertiary-color) !important;
    border-color: var(--tertiary-color) !important;
}

.btn-warning, .btn-warning:hover, .btn-warning:active, .btn-warning:visited {
    color: #fff !important;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.btn-grey, .btn-grey:hover, .btn-grey:active, .btn-grey:visited {
    color: #fff;
    font-weight: 600;
    /*color: var(--primary-color) !important;*/
    background-color: #898d8d !important;
}

.btn-transaprent {
    border: none;
    padding: 0px;
    margin: 0px;
    background-color: transparent;
}

.btn-offer {
    background-color: #000 !important;
    color: #fff;
}

    .btn-offer:hover {
        color: #fff;
    }

.btn-lrg {
    font-size: 1.3em;
}

.btn-tab-active {
    color: var(--primary-color);
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    background-color: #fff;
    border: 1px solid var(--primary-color);
    padding: 6px 12px 4px 12px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.btn-svg-inline {
    position: relative;
    top: 0.15em;
}

.svg-inline-15 {
    position: relative;
    top: 0.15em;
}

.svg-inline-2 {
    position: relative;
    top: 0.2em;
}

.svg-inline-3 {
    position: relative;
    top: 0.3em;
}

.svg-inline-4 {
    position: relative;
    top: 0.4em;
}

.btn-home-svg-inline {
    position: relative;
    top: 3px;
}

/*PRODUCT*/
.popup_name {
    font-size: 1.2em;
}

.popup_desc {
    font-size: 1.1em;
}

.popup_qty {
    font-size: 1.1em;
}

.popup_price {
    font-size: 1.1em;
}

.popup_vat {
    font-size: 1.1em;
}

.popup_total {
    font-size: 1.1em;
}

.popup_purchasetype {
    padding-top: 5px;
    padding-bottom: 15px;
}

.popup_department {
    padding-top: 5px;
    padding-bottom: 15px;
}

.icon-sz-sm {
    width: 16px;
    height: 16px;
}

.icon-sz-md {
    width: 24px;
    height: 24px;
}

.icon-sz-lg {
    width: 36px;
    height: 36px;
}

.icon-sz-xl {
    width: 38px;
    height: 38px;
}

.icon-sz-pageheader {
    width: 28px;
    height: 28px;
}
/*PRODUCT*/
.images-card-title {
    font-size: 1.4em;
}

.images-card-desc {
    padding-top: 10px;
    font-size: 1.1em;
    text-align: justify;
}

.dxcvCard_ourbrand, .dxcvFlowCard_ourbrand, .dxcvBreakpointsCard_ourbrand, .dxcvEmptyCard_ourbrand, .dxcvEmptyHiddenCard_ourbrand {
    padding: 12px 2px 18px;
}

.images-card-imagebox {
    text-align: center;
    padding: 5px;
}

.images-card-image {
    max-width: 100%;
    /*max-height: 400px;*/
    min-height: 250px;
    padding: 1px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.templater-grid-imagebox {
    text-align: center;
    padding: 5px;
}

.templater-grid-image {
    height: 100%;
    max-height: 150px;
    padding: 1px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.merch-grid-imagebox {
    text-align: center;
    padding: 5px;
}

.merch-grid-image {
    width: 200px;
    height: 200px;
    /*height: 100%;
    max-height: 150px;*/
    padding: 1px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.grid-imagebox {
    text-align: center;
    padding: 5px;
}

.grid-image {
    width: 200px;
    height: 200px;
    /*height: 100%;
    max-height: 150px;*/
    padding: 1px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.grid-imagebox-small {
    text-align: center;
    padding: 5px;
}

.grid-image-small {
    width: 50px;
    height: 50px;
    /*height: 100%;
    max-height: 150px;*/
    padding: 1px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.grid-imagebox-large {
    text-align: center;
    padding: 5px;
}

.grid-image-large {
    width: 200px;
    height: 200px;
    padding: 1px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.grid-text-small {
    font-size: 1em;
}

.grid-subtext-small {
    font-size: 0.8em;
}

.history-bar-inactive {
    color: var(--primary-invert-color);
}

.icon-sz-sm {
    width: 16px;
    height: 16px;
}

.icon-sz-btn {
    width: 18px;
    height: 18px;
}

.icon-sz-md {
    width: 24px;
    height: 24px;
}

.icon-sz-lg {
    width: 36px;
    height: 36px;
    left: 0px;
}

.icon-sz-pageheader {
    width: 28px;
    height: 28px;
}

.grid-col-header {
    background-color: #336699 !important;
    color: #ffffff !important;
}

.grid-col-header-edit {
    /*background-color: rgba(26, 148, 255, 1) !important;*/
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
}
.grid-col-header-editsubdued {
    /*background-color: rgba(26, 148, 255, 1) !important;*/
    background-color: var(--dark-grey-color) !important;
    color: #ffffff !important;
}
.help-box {
    margin-top: 5px;
    margin-bottom: 2px;
}

.help-box-content {
    padding: 0px;
    margin: 0px;
}

span.help-link {
    position: relative;
    float: right;
}

a.help-link, a.help-link:visited, a.help-link:active, a.help-link:hover {
    font-size: 1em;
    text-decoration: none
}

.help-svg-inline {
    position: relative;
    top: -1px;
}

.campaign-image-preview {
    border: solid 1px var(--primary-color);
    max-width: 60%;
    cursor: crosshair !important;
}

.campaign-image-preview-disabled {
    border: solid 1px var(--primary-color);
    max-width: 60%;
    cursor: default !important;
}

.campaign-box {
    background-color: #fff;
    box-shadow: 0 0px 4px 0 rgba(0, 0, 24, 0.1), 0 6px 14px 0 rgba(0, 0, 24, 0.1);
    border: 1px solid var(--primary-color);
    padding: 5px;
}
/*FOOTER - START*/
.footer {
    height: 130px;
    color: var(--primary-invert-color);
    font-size: 1.1em;
    background-color: var(--primary-color);
}

.footer-links {
    text-align: left;
    color: var(--primary-invert-color);
}

    .footer-links a {
        color: var(--primary-invert-color);
    }

        .footer-links a:hover {
            color: var(--primary-invert-color);
        }

        .footer-links a:visited {
            color: var(--primary-invert-color);
        }

        .footer-links a:active {
            color: var(--primary-invert-color);
        }

.footer-versioninfo {
    text-align: left;
    color: var(--primary-invert-color);
}

.footer-container {
    width: 1187px;
}

.footer-hyperlink {
    text-decoration: dashed;
}
/*FOOTER - END*/

/* HELP - START*/
.help-header {
    margin-top: 20px;
    padding: 10px;
    /*border: 1px solid #000;*/
    /*border-radius: 5px;*/
    background-color: var(--tertiary-color);
    cursor: pointer;
}

.help-content {
    /*margin-top: 20px;*/
    padding: 10px;
    border: 1px solid #f4f4f4;
    color: var(--primary-color);
    /*border-radius: 5px;*/
    background-color: #f4f4f4;
}

.help-headertext {
    font-size: 1.1em;
    margin: 0px 0px 0px 10px;
}

.help-para {
    margin: 10px 20px 20px 20px;
}
/* HELP - END*/

.dxbButton_ourbrand.dxbTSys {
    width: auto !important;
}

.dxbs-tabs ul.nav > li > a {
    color: #000;
}

    .dxbs-tabs ul.nav > li > a:hover {
        color: #000;
    }

    .dxbs-tabs ul.nav > li > a:visited {
        color: #000;
    }

    .dxbs-tabs ul.nav > li > a:active {
        color: #000;
        font-weight: bold;
    }

.tab-pane p {
    margin-top: 6px;
}

/* The switch - the box around the slider */
.t-switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

    /* Hide default HTML checkbox */
    .t-switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

.dxgvControl_ourbrand .dxgvTable_ourbrand .dxgvSelectedRow_ourbrand, .dxgvControl_ourbrand .dxgvTable_ourbrand .dxgvSelectedRow_ourbrand.dxgvDataRowHover_ourbrand {
    background: none;
}
/* Responsive: Portrait tablets and up */
@media screen and (max-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }

    .body-content {
        padding: 0;
    }

    .footer-versioninfo {
        text-align: right;
    }

    .header-logo-company {
        height: 40%;
        margin-top: 8px;
    }

    .header-logo-brand {
        height: 40%;
        margin-top: 8px;
    }

    .navbar-icontext {
        display: inline;
        font-size: 1.6em;
        color: #002664;
    }

    .td-home-style3-block {
        width: 50%;
        background-color: #fff;
        padding: 10px;
    }
}

.basket-grid-imagebox {
    text-align: center;
    padding: 5px;
}

.basket-offers-box {
    margin-top: 20px;
    padding: 10px;
    border: 1px solid var(--primary-color);
    border-radius: 5px;
    background-color: var(--tertiary-color);
}

.basket-offers {
    padding: 0px;
    margin: 0px;
    font-size: 1.2em;
}

.basket-grid-image {
    width: 60px;
    height: 60px;
    padding: 1px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.basket-offer-grid-groupbox {
    background-color: var(--primary-color);
    box-shadow: 0 4px 8px 0 rgba(0, 0, 24, 0.1), 0 6px 20px 0 rgba(0, 0, 24, 0.1);
    border: 1px solid var(--primary-color);
    color: #fff;
}

.basket-offer-grid-groupheader {
    font-size: 1.2em;
    color: #fff;
    font-weight: bold;
}

.basket-offer-grid-group {
    text-align: left;
    padding: 5px;
}

.basket-offer-grid-imagebox {
    text-align: center;
    padding: 5px;
}

.basket-offer-grid-image {
    width: 50px;
    height: 50px;
    padding: 1px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

.basket-offer-button-hidden {
    display: none;
}

.basket-offer-button-show {
    display: block;
}

.dxbButton_ourbrand {
    border-radius: 5px !important;
}

.templater-selected-text {
    font-style: italic;
    color: var(--mid-grey-color);
}

.wm-100 {
    width: 100% !important;
    max-width: 100% !important;
}

.home-btn > a, .home-btn > a:active, .home-btn > a:visited {
    text-decoration:none !important;
}
.home-btn > a:hover {
    text-decoration: none !important;
    color: var(--secondary-color) !important;
}

.dxbButton_ourbrand {
    background-color:var(--primary-color) !important;
}

a.dxbButtonSys {
    color: var(--primary-invert-color);
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    background-color: var(--primary-color);
    border: 1px solid var(--primary-color);
    padding: 6px 12px 4px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

}

.modal-dialog {
    padding: 10px !important;
    background: #fff !important;
    border: 1px solid var(--primary-color) !important;
}

.dxpLite_ourbrand .dxp-current {
    background-color: var(--primary-color) !important;
    color: var(--primary-invert-color) !important;
}
.dxtc-activeTab dxtc-psi {
    border-bottom: 3px solid var(--primary-color) !important;
}