html,
body {
    margin: 0;
    padding: 0;
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    background: #fff;
    font-family: 'Montserrat', sans-serif !important;
    line-height: 1.42857143;
    color: #58616A;
}

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

*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


/* Scrollbars */

::-webkit-scrollbar-button {
    background-color: #fff;
    background-repeat: no-repeat;
    cursor: pointer;
}

::-webkit-scrollbar-button:horizontal:increment {
    background-image: url('/assets/styles/user/grid/layout/arrow_staticright_16.png');
    background-position: center;
    height: 18px;
    width: 18px;
}

::-webkit-scrollbar-button:horizontal:decrement {
    background-image: url('/assets/styles/user/grid/layout/arrow_staticleft_16.png');
    background-position: center;
    height: 18px;
    width: 18px;
}

::-webkit-scrollbar-button:horizontal:increment:hover {
    background-image: url('/assets/styles/user/grid/layout/arrow_hoverright_16.png');
    background-position: center;
    height: 18px;
    width: 18px;
}

::-webkit-scrollbar-button:horizontal:decrement:hover {
    background-image: url('/assets/styles/user/grid/layout/arrow_hoverleft_16.png');
    background-position: center;
    height: 18px;
    width: 18px;
}

::-webkit-scrollbar-button:vertical:increment {
    background-image: url('/assets/styles/user/grid/layout/arrow_staticdown_16.png');
    background-position: center;
    height: 18px;
    width: 18px;
}

::-webkit-scrollbar-button:vertical:decrement {
    background-image: url('/assets/styles/user/grid/layout/arrow_staticup_16.png');
    background-position: center;
    height: 18px;
    width: 18px;
}

::-webkit-scrollbar-button:vertical:increment:hover {
    background-image: url('/assets/styles/user/grid/layout/arrow_hoverdown_16.png');
    background-position: center;
    height: 18px;
    width: 18px;
}

::-webkit-scrollbar-button:vertical:decrement:hover {
    background-image: url('/assets/styles/user/grid/layout/arrow_hoverup_16.png');
    background-position: center;
    height: 18px;
    width: 18px;
}

::-webkit-scrollbar-track {
    background-color: #fff;
}

::-webkit-scrollbar-thumb {
    border-radius: 9px;
    border: solid 6px #fff;
    background-color: #98a3ac;
}

::-webkit-scrollbar-thumb:vertical {
    min-height: 50px;
}

::-webkit-scrollbar-thumb:horizontal {
    min-width: 50px;
}

::-webkit-scrollbar-thumb:hover {
    border-radius: 9px;
    border: solid 6px #fff;
    background-color: #777;
}

::-webkit-scrollbar-corner {
    background-color: #fff;
}

::-webkit-scrollbar {
    height: 18px;
    width: 18px;
}


/* Fonts */

h1,
h2,
h3,
h4,
h5,
h6,
p {
    font-family: 'Montserrat', sans-serif !important;
    color: #6d6e70;
}

p a,
p a:visited,
p a:active {
    color: #58616A;
}

b,
strong {
    font-weight: bold;
}

small {
    font-size: 80%;
}

svg:not(:root) {
    overflow: hidden;
}

a {
    background-color: transparent;
    color: #58616A;
    text-decoration: none;
    cursor: pointer;
}

a:hover,
a:focus {
    outline: 0;
    color: #979DA3;
    text-decoration: none;
}

img {
    vertical-align: middle;
    border: 0;
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}

button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

hr {
    box-sizing: content-box;
    height: 0;
    margin-top: 35px;
    margin-bottom: 35px;
    border: 0;
    border-top: 1px solid #DADEE0;
}

.filter-hr {
    margin-top: 5px;
    margin-bottom: 5px;
}

ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
}

h1 small,
h1 .small,
h2 small,
h2 .small,
h3 small,
h3 .small,
h4 small,
h4 .small,
h5 small,
h5 .small,
h6 small,
h6 .small {
    font-weight: normal;
    line-height: 1;
    color: #faf9f9;
}

h1,
h2,
h3 {
    margin-top: 21px;
    margin-bottom: 10.5px;
}

h1 small,
h1 .small,
h2 small,
h2 .small,
h3 small,
h3 .small {
    font-size: 65%;
}

h4,
h5,
h6 {
    margin-top: 10.5px;
    margin-bottom: 10.5px;
}

h4 small,
h4 .small,
h5 small,
h5 .small,
h6 small,
h6 .small {
    font-size: 75%;
}

h1 {
    font-size: 39px;
}

h2 {
    font-size: 32px;
}

h3 {
    font-size: 26px;
}

h4 {
    font-size: 19px;
}

h5 {
    font-size: 15px;
}

h6 {
    font-size: 13px;
}

p {
    margin: 0 0 10.5px;
}


/* Buttons */

.button, [class*="gridButton"], .links a {
	border: none;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background: #707070;
	color: #FFF !important;
	padding: 10px;
	text-decoration: none;
	display: inline-block;
	cursor: pointer;
    font-size: 14px;
}
.button:hover, [class*="gridButton"]:hover, .links a:hover {
	color: #fff;
	background: #00c0f3;
}
.contentButton {
	border: none;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #FF9D00;
    color: #FFF !important;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    font-size: 15px;
    text-transform: uppercase;
    padding: 9px 20px 9px 20px;
    border-radius: 7px;
    font-weight: 800;
    position: relative;
}
.contentButtonMedium {
	border: none;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #FFBB33;
    color: #FFF !important;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 10px 8px 10px;
    border-radius: 6px;
    font-weight: 800;
    position: relative;
}
.contentButtonSmall {
	border: none;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background: #FF9D00;
	color: #FFF !important;
	text-decoration: none;
	display: inline-block;
	cursor: pointer;
	font-size: 12px;
	text-transform: uppercase;
	padding: 8px 5px 8px 5px !important;
	border-radius: 7px;
	font-weight: 800;
	position: relative;
}
.contentButton:hover {
	color: #fff;
    background: #FFB237;
}
.warningButton, [class*="WarningButton"] {
	background: #FEC912; 
	color: #FFF !important; 
}
.warningButton:hover, [class*="WarningButton"]:hover {
	background: #FF9900;
}
.errorButton, [class*="ErrorButton"] {
	background: #FB0000; 
	color: #FFF !important; 
}
.errorButton:hover, [class*="ErrorButton"]:hover {
	background: #D50000;
}
.links a {
	margin: 2px;
}
.erp {
	margin-top: 10px;
	padding: 0px;
}
.actionWrapper {
	text-align: right;
}
[id^=wrap] a {
	display: block;
}


/* class="link" styles and most oh href styles */

.link {
    font-size: 14px;
    margin-right: 5px;
    text-decoration: underline;
    font-weight: 600;
}


/* Container Globals */

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.container-limited {
    max-width: 1280px;
}

.container:after {
    clear: both;
}

@media (min-width: 768px) {
    .container {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .container {
        width: 1170px;
    }
}

.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.container-fluid:before,
.container-fluid:after {
    content: " ";
    display: table;
}

.container-fluid:after {
    clear: both;
}


/* Rows */

.row {
    /*margin-left: -15px;
  margin-right: -15px;*/
    margin-bottom: 20px;
}

.row:before,
.row:after {
    content: " ";
    display: table;
}

.row:after {
    clear: both;
}


/* Theme colors */

body.ui-admin .page-with-sidebar .sidebar-wrapper {
    background: #fff;
    color: #58616A;
    text-transform: uppercase;
    font-weight: 800;
}

body.ui-admin .page-with-sidebar .nav-sidebar .menuContainer .menu {
    background: #fff;
}

body.ui-admin .page-with-sidebar .toggle-nav-collapse,
body.ui-admin .page-with-sidebar .useri,
body.ui-admin .page-with-sidebar .logout {
    /* color: #fefefe; */
}

body.ui-admin .page-with-sidebar .nav-sidebar li.current a {
	background: #FF9D00;
    color: #fff;
}

body.ui-admin .page-with-sidebar .nav-sidebar li a:hover,
body.ui-admin .page-with-sidebar .nav-sidebar li a:active,
body.ui-admin .page-with-sidebar .nav-sidebar li.current,
.menuContainer ul li a:hover,
.menuContainer ul li label:hover {
    background: #FFB237;
    color: #fff;
}

body.ui-admin .page-with-sidebar .nav-sidebar li ul li.current a {
    color: #fff;
}

body.ui-admin .page-with-sidebar .nav-sidebar li a.dash,
body.ui-admin .page-with-sidebar .nav-sidebar li a.adgrid,
.menuContainer ul li a,
.menuContainer ul li label {
    /* color: #58616A; */
    /* font-weight: 800; */
}

/*body.ui-admin .page-with-sidebar .custInvLine .gridButton,
body.ui-admin .page-with-sidebar .custShipLine .gridButton,
body.ui-admin .page-with-sidebar .supInvLine .gridButton {
    font-size: 14px;
    margin-right: 5px;
    text-decoration: underline;
    font-weight: 600;
}*/

body.ui-customer .page-with-sidebar .sidebar-wrapper {
    background: #fff;
    color: #58616A;
    text-transform: uppercase;
    font-weight: 800;
}

body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer .menu {
    background: #fff;
}

body.ui-customer .page-with-sidebar .toggle-nav-collapse,
body.ui-customer .page-with-sidebar .useri,
body.ui-customer .page-with-sidebar .logout {
    /* color: #fefefe; */
}

body.ui-customer .page-with-sidebar .nav-sidebar li.current a {
	background: #FF9D00;
    color: #fff;
}

body.ui-customer .page-with-sidebar .nav-sidebar li a:hover,
body.ui-customer .page-with-sidebar .nav-sidebar li a:active,
body.ui-customer .page-with-sidebar .nav-sidebar li.current {
    background: #FFB237;
    color: #fff;
}

body.ui-customer .page-with-sidebar .nav-sidebar li ul li.current a {
    color: #fff;
}

body.ui-customer .page-with-sidebar .nav-sidebar li a.dash {
    /* color: #fff; */
}

/*body.ui-customer .page-with-sidebar .custInv .gridButton,
body.ui-customer .page-with-sidebar .custOrd .gridButton {
    font-size: 14px;
    margin-right: 5px;
    text-decoration: underline;
    font-weight: 600;
}*/

/** monkey patch for Alihankinta **/
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.mcustcatalogue,
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.mcompanyman,
/* body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.mwarehouseeditor, */
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.mwebeditor,
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.musermanage,
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.mterm,
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.minventoryman,
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.mcategoryman,
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.mcaseeditor,
body.ui-customer .page-with-sidebar .nav-sidebar .menuContainer ul li.mcustportal .menu ul li.CustomerShipment  {
	display: none !important;
}

body.ui-supplier .page-with-sidebar .sidebar-wrapper {
    background: #fff;
    color: #58616A;
    text-transform: uppercase;
    font-weight: 800;
}

body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer .menu {
    background: #fff;
}

body.ui-supplier .page-with-sidebar .toggle-nav-collapse,
body.ui-supplier .page-with-sidebar .useri,
body.ui-supplier .page-with-sidebar .logout {
    /* color: #fefefe; */
}

body.ui-supplier .page-with-sidebar .nav-sidebar li.current a {
    background: #FF9D00;
    color: #fff;
}

body.ui-supplier .page-with-sidebar .nav-sidebar li a:hover,
body.ui-supplier .page-with-sidebar .nav-sidebar li a:active,
body.ui-supplier .page-with-sidebar .nav-sidebar li.current {
    background: #FFB237;
    color: #fff;
}

body.ui-supplier .page-with-sidebar .nav-sidebar li ul li.current a {
    color: #fff;
}

body.ui-supplier .page-with-sidebar .nav-sidebar li a.dash {
    /* color: #fff; */
}

/*body.ui-supplier .page-with-sidebar .supInv .gridButton,
body.ui-supplier .page-with-sidebar .supOrd .gridButton {
    font-size: 14px;
    margin-right: 5px;
    text-decoration: underline;
    font-weight: 600;
}*/

body.ui-supplier .page-with-sidebar .erpButton,
body.ui-supplier .page-with-sidebar .dmsload {
    background: #7B8289;
    color: #fff;
    padding: 10px;
    display: inline-block;
    font-size: 14px;
    margin-right: 0px;
}

body.ui-supplier .page-with-sidebar .erpButton:hover,
body.ui-supplier .page-with-sidebar .dmsload:hover {
    background: #979DA3;
}

/** monkey patch for Alihankinta **/
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.mcustcatalogue,
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.mcompanyman,
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.mwebeditor,
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.musermanage,
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.mterm,
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.minventoryman,
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.mcategoryman,
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.mcaseeditor,
body.ui-supplier .page-with-sidebar .nav-sidebar .menuContainer ul li.mcustportal .menu ul li.CustomerShipment  {
	display: none !important;
}

body.ui-customer a.erpButton.gridSyncButton,
body.ui-supplier a.erpButton.gridSyncButton {
	margin-left: 16px;
	margin-bottom: 16px;
}


/* Header main elements */

header {
    transition: padding 0.15s;
}

header.navbar-grid {
    padding: 0 16px;
    z-index: 100;
    margin-bottom: 0;
    height: auto;
    background-color: #fff;
    border: none;
    /* border-bottom: 1px solid #e5e5e5; */
    box-shadow: 0px 3px 6px #0000001A;
    color: #58616A;
    /*border-bottom: none;*/
}

header.navbar-grid.admin {
    background-color: #fff;
}

header.navbar-grid.supplier {
    background-color: #fff;
}

header.navbar-grid.customer {
    background-color: #fff;
}

@media (max-width: 480px) {
    header.navbar-grid {
        padding: 0 16px;
    }
}

header.navbar-grid.header-collapsed {
    padding: 0 16px;
}


/* Header wrappers */

header.navbar-grid .container-fluid {
    width: 100% !important;
    filter: none;
    padding: 0;
}


/* Header action buttons */
header.navbar-grid .side-nav-button {
    margin: 10px 0;
    font-size: 18px;
    padding: 6px 10px;
    border: none;
    background-color: #fff;
    position: relative;
}

header.navbar-grid .side-nav-button.main-menu {
    margin-left: 10px;
    margin-right: 20px;
}

header.navbar-grid .side-nav-button.mm {
    margin-left: 20px;
    /* margin-right: 30px; */
}

header.navbar-grid .side-nav-button.calendar {
    /* margin-left: 0px; */
    /* margin-right: 0px; */
}

header.navbar-grid .side-nav-button.main-search {
    /* margin-left: 15px; */
    margin-right: 18px;
}

header.navbar-grid .mm-signin {
    position: absolute;
    left: 25px;
    margin: 7px 0;
    font-size: 12px;
    padding: 8px 10px 9px;
    border: none;
    background-color: #fff;
}

header.navbar-grid .side-nav-button:hover {
    background-color: #eee;
}
header.navbar-grid .side-nav-button:focus {
    outline: none;
}
header .mm-button::before {
    content: url(/assets/images/mm_18_gray.png);
    position: relative;
    vertical-align: middle;
    top: 1px;
}
.mm-button-white::before {
    content: url(/assets/images/mm_white_18.png);
    position: relative;
    vertical-align: middle;
    top: 3px;
}

header.search-expanded {
    z-index: 101;
}

header.search-expanded .issuable-gutter-toggle {
    display: none;
}


/* Header Inner Wrapper */

header .header-content {
    position: relative;
    height: auto;
    padding-left: 0px;
}

@media (min-width: 768px) {
    header .header-content {
        padding-right: 0;
    }
}


/* Header Logo */

header .header-content .header-logo {
    position: absolute;
    left: 50%;
    margin-left: -18px;
    top: 7px;
    transition-duration: .3s;
    z-index: 999;
}

header .header-content .header-logo svg,
header .header-content .header-logo img {
    height: 36px;
}

header .header-content .header-logo,
header .header-content .header-logo .admin,
header .header-content .header-logo .supplier,
header .header-content .header-logo .customer {
	background: url('/assets/styles/user/grid/layout/factory.png') no-repeat !important;
    height: 36px !important;
    width: 35px;
    display: block;
}

header .header-content .header-logo:hover {
    cursor: pointer;
}

/*@media (max-width: 767px), (max-width: 991px) {
    header .header-content .header-logo {
        right: 25px;
        left: auto;
    }
}

@media (max-width: 400px) {
    header .header-content .header-logo {
        width: 102px;
        height: 30px;
        display: block;
        position: relative;
        margin: 10px 0 10px 0;
    }
}*/

/* Header menu divider */

.vertical-menu-divider {
	/* width: 12px; */
	height: 28px;
	/* margin-top: 15px; */
	/* padding: 6px 10px; */
	border-left: 1px solid #707070;
	display: inline-block;
	/* top: 17px; */
	vertical-align: middle;
}


/* Header Right Side Action Tools */

header .header-content .navbar-collapse {
    float: right;
    border-top: none;
}

@media (max-width: 767px), (max-width: 991px) {
    header .header-content .navbar-collapse {
        float: none;
    }
}


/* Page Title */

header .header-content .title {
    margin: 0;
    margin-left: 28px;
    font-size: 13px;
    max-width: 400px;
    display: inline-block;
    /* line-height: 50px; */
    font-weight: normal;
    color: #5c5c5c;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
}
@media (max-width: 767px), (max-width: 991px) {
    header .container-fluid {
        font-size: 18px;
    }
    header .container-fluid .navbar-nav {
        margin: 0;
        float: none !important;
    }
    header .container-fluid .navbar-nav .visible-xs,
    header .container-fluid .navbar-nav .visable-sm {
        display: table-cell !important;
    }
    header .container-fluid .navbar-collapse {
        padding: 0px;
    }
    header .container-fluid .navbar-collapse .nav>li {
        display: table-cell;
        width: 1%;
    }
	/*header .header-content .title {
        visibility: hidden;
        display: none;
	}*/
}
@media (max-width: 767px) {
	header .header-content .title {
        visibility: hidden;
        display: none;
	}
}

/* Navbar Class */

.nav {
    margin-bottom: 0;
    padding-left: 0;
    list-style: none;
}

.nav:before,
.nav:after {
    content: " ";
    display: table;
}

.nav:after {
    clear: both;
}


/*.nav>li {
  position: relative;
  display: block;
}*/

.nav>li>a {
    position: relative;
    display: block;
    padding: 13px 16px;
}

.nav>li>a:hover,
.nav>li>a:focus {
    text-decoration: none;
    /*background-color: #eeeeee;*/
}

.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 21px;
    border: 1px solid transparent;
}

.navbar:before,
.navbar:after {
    content: " ";
    display: table;
}

.navbar:after {
    clear: both;
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 3px;
    }
}

.navbar-collapse {
    overflow-x: visible;
    padding-right: 15px;
    padding-left: 15px;
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-overflow-scrolling: touch;
}

.navbar-collapse:before,
.navbar-collapse:after {
    content: " ";
    display: table;
}

.navbar-collapse:after {
    clear: both;
}

@media (min-width: 992px) {
    .navbar-collapse {
        width: auto;
        border-top: 0;
        box-shadow: none;
    }
    .navbar-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important;
    }
    .navbar-fixed-top .navbar-collapse {
        padding-left: 0;
        padding-right: 0;
    }
}

.navbar-fixed-top .navbar-collapse {
    max-height: 340px;
}

@media (max-device-width: 480px) and (orientation: landscape) {
    .navbar-fixed-top .navbar-collapse {
        max-height: 200px;
    }
}

.container>.navbar-header,
.container>.navbar-collapse,
.container-fluid>.navbar-header,
.container-fluid>.navbar-collapse {
    margin-right: -15px;
    margin-left: -15px;
}

@media (min-width: 768px) {
    .container>.navbar-header,
    .container>.navbar-collapse,
    .container-fluid>.navbar-header,
    .container-fluid>.navbar-collapse {
        margin-right: 0;
        margin-left: 0;
    }
}

.navbar-fixed-top {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
}

@media (min-width: 768px) {
    .navbar-fixed-top {
        border-radius: 0;
    }
}

.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px;
}

.navbar-toggle {
    position: relative;
    float: right;
    margin-right: 15px;
    padding: 9px 10px;
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 3px;
}

header.navbar-grid .container-fluid .navbar-toggle {
    color: #666;
    margin: 6px 0;
    border-radius: 0;
    position: absolute;
    right: -10px;
    padding: 6px 10px;
}

header.navbar-grid .container-fluid .navbar-toggle:hover {
    background-color: #f0f0f0;
}

.navbar-toggle:focus {
    outline: 0;
}

@media (min-width: 992px) {
    .navbar-toggle {
        display: none;
    }
}

@media (min-width: 992px) {
    .navbar-nav>li {
        float: left;
    }
    .navbar .nav>li {
        /*position: relative;
    white-space: nowrap;*/
    }
    .navbar-nav {
        margin: 7.25px -15px;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
        line-height: 21px;
    }
    .navbar-nav {
        float: left;
        margin: 0;
    }
}


/* Main Wrapper */

.page-with-sidebar {
    padding-top: 58px;
    padding-bottom: 25px;
    transition: padding 0.15s;
    /*position: relative;*/
}

/*@media (max-width: 767px), (max-width: 991px) {
    .page-with-sidebar {
        padding-top: 160px;
    }
}

@media (max-width: 400px) {
    .page-with-sidebar {
        padding-top: 146px;
    }
}*/


/* Main Container Wrapper */

.page-with-layout-nav {
    margin-top: 75px;
}

/*@media (max-width: 767px), (max-width: 991px) {
    .page-with-layout-nav {
        margin-top: 0px;
    }
}*/

/*.page-with-layout-nav .right-sidebar {
    top: 50px;
}*/

/*@media (max-width: 767px), (max-width: 991px) {
    .page-with-layout-nav .right-sidebar {
        top: 102px;
    }
}

@media (max-width: 400px) {
    .page-with-layout-nav .right-sidebar {
        top: 102px;
    }
}*/


/* Menu container wrappers */

.page-with-sidebar .sidebar-wrapper {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    /* height: 100%;
    overflow: hidden; */
    overflow: auto;
    transition: width 0.15s;
    -webkit-box-shadow: 2px 0 16px 0 rgba(0, 0, 0, 0.3);
    box-shadow: 2px 0 16px 0 rgba(0, 0, 0, 0.3);
    box-shadow: 8px 3px 6px #00000014;
}

.sidebar-wrapper {
    z-index: 999;
    background: #fafafa;
}


/* Main container wrappers */

.content-wrapper {
    width: 100%;
    transition: padding 0.15s;
}

.content-wrapper .container-fluid {
    background: #fff;
    padding: 0 16px;
}


/* Left Side Menu */

.nav-sidebar {
    position: absolute;
    width: 100%;
    height: auto;
    margin: 0px;
    /* margin-top: 15px; */
    /* overflow-y: hidden; */
    /* overflow-x: auto; */
    text-align: center;
}

.nav-sidebar li .icon-container {
    width: 34px;
    display: inline-block;
    text-align: center;
}

.nav-sidebar li a,
.menuContainer ul li label,
.menuContainer ul li a {
    padding: 10px 20px;
    font-size: 13px;
    line-height: 24px;
    display: block;
    text-decoration: none;
    /* font-weight: normal; */
    outline: none;
}

.nav-sidebar li a:hover,
.nav-sidebar li a:active,
.nav-sidebar li a:focus {
    text-decoration: none;
}

.nav-sidebar li a i {
    font-size: 16px;
}

.nav-sidebar li a i,
.nav-sidebar li a svg {
    margin-right: 13px;
}

.nav-sidebar li ul.element {
    list-style: none;
    margin: 0;
    padding: 5px 15px;
}

.sidebar-action-buttons {
    /* width: 220px; */
    position: sticky;
    top: 0;
    left: 0;
    min-height: 50px;
    /*padding: 5px 0;*/
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 30px;
    background: #fff;
    z-index: 1000;
}

.sidebar-action-buttons .toggle-nav-collapse {
    left: 0;
    border: none;
    background: transparent;
}
.sidebar-action-buttons .vertical-menu-divider {
	position: absolute;
	top: 11px;
	left: 85px;
}
.sidebar-action-buttons .mm-close {
    left: 65px;
    padding-left: 0px;
}
.sidebar-action-buttons .logout {
    left: 225px;
    padding: 10px 10px;
}

.sidebar-action-buttons .link-change {
    left: 185px;
    padding: 10px 10px;
}

.sidebar-action-buttons .edit_comp {
    left: 145px;
    padding: 10px 10px;
}

.sidebar-action-buttons .useri {
    left: 105px;
    padding: 10px 10px;
    margin-left: 15px;;
}

.nav-header-btn {
    padding: 10px 38px;
    color: inherit;
    transition-duration: .3s;
    /* position: absolute; */
    top: 0;
}

.nav-header-btn:hover,
.nav-header-btn:focus {
    color: #979DA3;
    text-decoration: none;
}

.page-sidebar-collapsed {
    padding-left: 0;
}

.page-sidebar-collapsed .sidebar-wrapper {
    width: 0;
}

.page-sidebar-expanded .sidebar-wrapper {
    width: 400px;
}


/* Push menu elements for left side menu */

.menu {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    z-index: 1;
    width: 100%;
    height: 100%;
    transform: translate3d(-400px, 0, 0);
    transition: transform 0.35s;
}

.menu label.menu-toggle {
    height: 44px;
    display: block;
}

.menu ul li a,
.menu ul li label {
    display: block;
    text-decoration: none;
}

.menu ul li a:hover,
.menu ul li label:hover {
    color: #666;
}

.menuContainer ul li label span {
    vertical-align: top;
    margin-left: 10px;
}

.menu-checkbox {
    display: none;
}

.menu .menu label.menu-toggle {
    background: none;
}

.menu-checkbox:checked+.menu {
    transform: translate3d(0, 0, 0);
}

.menu-toggle .fa-caret-left {
    line-height: 24px;
    font-size: 20px;
    margin-left: 0px;
}

.menu.utilities h5 {
    font-weight: 800;
}

.companyTitle {
    padding: 10px 0;
    background: #ededed;
    text-align: center;
}

.companyTitle span {
    font-size: 12px;
    font-weight: 400;
    margin-left: 5px;
}


/* Right Side Menu */


/* Mobile toggler */

.detail-page-header {
    display: none;
}

@media (max-width: 767px), (max-width: 991px) {
    .detail-page-header {
        display: block;
        padding: 10px 0;
        border-bottom: 1px solid #e5e5e5;
        color: #5c5d5e;
        font-size: 16px;
        line-height: 34px;
    }
}

.issuable-header {
    position: relative;
    padding-left: 45px;
    padding-right: 45px;
    line-height: 35px;
    height: 35px;
}

@media (max-width: 991px) {
    .issuable-gutter-toggle {
        position: absolute;
        top: 0;
        right: 0;
		z-index: 10;
    }
}

.btn {
    /* border-radius: 3px; */
    font-size: 23px;
    font-weight: 500;
    padding: 6px 10px;
    background-color: #fff;
    color: #848484;
    color: #5c5c5c;
    display: inline-block;
    margin-bottom: 0;
    margin-top: 7px;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 0px solid #BBC4CC;
    white-space: nowrap;
    line-height: 1.42857143;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.right-sidebar.right-sidebar-collapsed {
    display: none;
    width: 84px;
    padding-top: 0;
}

.right-sidebar-collapsed {
    padding-right: 0;
}

@media (min-width: 992px) {
    .right-sidebar-collapsed {
        padding-right: 84px;
    }
    .right-sidebar.right-sidebar-collapsed {
        display: block;
    }
}

.right-sidebar-collapsed .sidebar-collapsed-icon {
    cursor: pointer;
}

.right-sidebar-collapsed .sidebar-collapsed-icon .btn,
.right-sidebar-collapsed .sidebar-collapsed-icon .snippet-holder .file-actions .btn-clipboard,
.snippet-holder .file-actions .right-sidebar-collapsed .sidebar-collapsed-icon .btn-clipboard {
    background-color: #faf9f9;
}

.right-sidebar.right-sidebar-expanded {
    width: 290px;
}

.right-sidebar-expanded {
    padding-right: 0;
}

@media (min-width: 768px) and (max-width: 991px) {
    .right-sidebar-expanded:not(.build-sidebar) {
        /* padding-right: 62px; */
    }
}

@media (min-width: 992px) {
    .right-sidebar-expanded {
        padding-right: 290px;
    }
}

.right-sidebar-expanded.with-overlay {
    padding-right: 62px;
}

.right-sidebar {
    position: fixed;
    top: 0px;
    bottom: 0;
    right: 0;
    z-index: 100;
    transition: width .3s;
    background: #6B747E;
    padding: 10px 0px;
    border-left: 1px solid #e5e5e5;
    overflow: auto;
    direction: rtl;
}
.right-sidebar .issuable-sidebar {
    direction: ltr;
}

.right-sidebar .block.issuable-sidebar-header {
    padding-top: 0;
    padding-bottom: 12px;
}

.right-sidebar .block.logo a {
    background: url(/assets/styles/user/grid/layout/AF_factory.svg) no-repeat;
    height: 52px;
    width: 53px;
    display: block;
    margin: auto;
}

.right-sidebar .block.action-label {
    transform: rotate(90deg);
    transform-origin: center;
    font-weight: 800;
    font-size: 15px;
    color: white;
    text-transform: uppercase;
    margin-top: 60px;
    margin-left: px !important;
    padding: 0px 0px !important;
}

.right-sidebar.right-sidebar-collapsed .hide-collapsed {
    display: none;
}

.right-sidebar.right-sidebar-expanded .hide-expanded {
    display: none;
}

.right-sidebar .issuable-header-text {
    margin-top: 7px;
    font-size: 18px;
}

.right-sidebar .block span {
    display: inline-block;
}

.right-sidebar .block {
    padding: 16px 0;
    /*border-bottom: 1px solid #dcdcdc;*/
    /*width: 258px;*/
    text-align: center;
}

.block.page_info {
  background: #979DA3;
  border: solid 1px #707070;
  border-radius: 7px;
  margin: 0px 10px 4px 10px;
}

.block.page_info p { color: #fff; font-size: 12px; line-height: 12px;   }

.block.page_info p:last-child { margin: 0; }

h1.main-header-text {
    margin: auto;
    color: white;
    font-size: 22px;
    text-transform: uppercase;
    text-align: center;
    display: block;
    padding-top: 10px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    letter-spacing: 0.66px;
}

.right-sidebar.right-sidebar-collapsed .block {
    width: 83px;
    /* margin-left: -19px; */
    padding: 15px 0 0;
    border-bottom: none;
    overflow: visible;
}

.right-sidebar.right-sidebar-collapsed .sidebar-collapsed-icon {
    margin-left: 0px;
    display: block;
    width: 100%;
    text-align: center;
    padding-bottom: 10px;
    color: #484848;
}

.right-sidebar.right-sidebar-expanded .sidebar-collapsed-icon {
	color: white;
    font-size: 11px;
    font-weight: 400;
    text-transform: uppercase;
    background: #7B8289;
    border: solid 1px #707070;
    border-radius: 7px;
    padding: 15px 20px 5px 20px;
    display: block;
    width: 250px;
    height: 85px;
    position: relative;
}

.right-sidebar.right-sidebar-expanded .backbut {
}

.right-sidebar.right-sidebar-collapsed .sidebar-collapsed-icon span {
    font-size: 12px;
    word-wrap: normal;
    padding: 0px 5px;
    display: block;
    text-overflow: ellipsis;
    overflow-x: hidden;
}

.right-sidebar.right-sidebar-expanded .sidebar-collapsed-icon span {
    display: block;
    text-align: center;
    padding-top: 10px;
}

.right-sidebar .block .gutter-toggle {
    /*margin-left: 20px;*/
    padding-left: 20px;
    color: #FFF;
    font-size: 23px;
}

.right-sidebar.right-sidebar-expanded .gutter-toggle {
    margin-top: 7px;
    border: none;
    background: transparent;
}

.right-sidebar.right-sidebar-collapsed .gutter-toggle {
    width: 100%;
    margin-left: 0;
    padding-left: 0px;
    border: none;
    background: transparent;
}

.right-sidebar .block:before,
.right-sidebar .block:after {
    content: " ";
    display: table;
}

.right-sidebar .block:after {
    clear: both;
}

/* Right sidebar menu dropdowns */

.main-action:hover,
.page-action:hover,
.integration-action:hover,
.printable-action:hover {
	background: #7B8289;
}

.main-action a.main-action-btn, .page-action a.page-action-btn, .integration-action a.integration-action-btn, .printable-action a.printable-action-btn {
    font-size: 22px;
    text-transform: uppercase;
    padding: 10px 40px 10px 20px;
    color: white;
    font-weight: 800;
    position: relative;
}
.main-action a.main-action-btn.active::after,
.page-action a.page-action-btn.active::after,
.integration-action a.integration-action-btn.active::after,
.printable-action a.printable-action-btn.active::after {
	content: "\2212";
	font-size: 32px;
	text-align: center;
	-webkit-transition: all .35s;
	transition: all .35s;
	top: 0px;
	right: 10px;
	position: absolute;
}
.main-action a.main-action-btn::after,
.page-action a.page-action-btn::after,
.integration-action a.integration-action-btn::after,
.printable-action a.printable-action-btn::after {
    content: "\002B";
    font-size: 32px;
    text-align: center;
    font-weight: 400;
    -webkit-transition: all .35s;
    transition: all .35s;
    position: absolute;
    top: 0px;
    right: 10px;
}
.main-actionContent.open, .page-actionContent.open, .integration-actionContent.open, .printable-actionContent.open {
    width: 100%;
    display:block;
    margin-top: 20px;
    margin-bottom: 20px;
    height: auto;
    transition: all 0.25s ease-in-out;
    color: #fff;
}
.main-actionContent.close,
.page-actionContent.close,
.integration-actionContent.close,
.printable-actionContent.close {
    width: 100%;
    position: relative;
    height: 0;
    transition: all .25s ease;
    opacity:0;
    visibility: hidden;
}

/* AddContainer buttons in Main Actions and Page Actions */

.main-action-buttons label, .page-action-buttons label, .integration-action-buttons label, .manual-container label, .printable-action-button label, .customer-container label {
    display: block;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 800;
    padding: 0px 0px 20px;
}

.manual-container {
	padding-top: 20px;
}

.customer-container {
	padding-top: 15px;
}

.manual-container p {
	color: #fff;
	font-size: 14px;
  font-style: italic;
}


.main-actionContent.close .main-action-buttons .addContainer,
.main-actionContent.close .manual-container .addContainer,
.page-actionContent.close .page-action-buttons .addContainer,
.integration-actionContent.close .integration-action-buttons .addContainer,
.printable-actionContent.close .printable-action-buttons .addContainer {
   display: none;
}

.main-action-buttons .addContainer,
.page-action-buttons .addContainer,
.integration-action-buttons .addContainer,
.manual-container .addContainer,
.printable-action-buttons .addContainer {
   display: inline-block;
   vertical-align: top;
   margin-bottom: 4px;
}
.main-action-buttons .addContainer .main-action-btn,
.page-action-buttons .addContainer .page-action-btn,
.integration-action-buttons .addContainer .integration-action-btn,
.manual-container .addContainer .main-action-btn,
.printable-action-buttons .addContainer .printable-action-btn {
   color: white;
   font-size: 11px;
   font-weight: 400;
   text-transform: uppercase;
   background: #7B8289;
   border: solid 1px #707070;
   border-radius: 7px;
   padding: 15px 0px 5px 0px;
   display:block;
   width: 123px;
   height: 85px;
   position: relative;
}
.main-action-buttons .addContainer a.main-action-btn,
.page-action-buttons .addContainer a.page-action-btn,
.integration-action-buttons .addContainer a.integration-action-btn,
.manual-containers .addContainer a.main-action-btn,
.printable-action-buttons .addContainer a.printable-action-btn
 {
   padding: 23px 0px 5px 0px;
}
.main-action-buttons .addContainer .main-action-big-btn,
.page-action-buttons .addContainer .page-action-big-btn,
.integration-action-buttons .addContainer .integration-action-big-btn,
.manual-container .addContainer .main-action-big-btn,
.printable-action-buttons .addContainer .printable-action-big-btn {
   color: white;
   font-size: 11px;
   font-weight: 400;
   text-transform: uppercase;
   background: #7B8289;
   border: solid 1px #707070;
   border-radius: 7px;
   padding: 10px 20px 5px 20px;
   display:block;
   width: 250px;
   height: 85px;
   position: relative;
}
.main-action-buttons .addContainer a.main-action-big-btn,
.page-action-buttons .addContainer a.page-action-big-btn,
.integration-action-buttons .addContainer a.integration-action-big-btn,
.manual-container .addContainer a.main-action-big-btn,
.printable-action-buttons .addContainer a.printable-action-big-btn {
   padding: 20px 20px 5px 20px;
}
.main-action-buttons .addContainer .main-action-btn:hover,
.page-action-buttons .addContainer .page-action-btn:hover,
.integration-action-buttons .addContainer .integration-action-btn:hover,
.manual-container .addContainer .main-action-btn:hover,
.printable-action-buttons .addContainer .printable-action-btn:hover,
.main-action-buttons .addContainer .main-action-big-btn:hover,
.page-action-buttons .addContainer .page-action-big-btn:hover,
.integration-action-buttons .addContainer .integration-action-big-btn:hover,
.manual-container .addContainer .main-action-big-btn:hover,
.printable-action-buttons .addContainer .printable-action-big-btn:hover {
   background: #979DA3;
   border: solid 1px #707070;
}
.main-action-buttons .addContainer .main-action-btn i,
.main-action-buttons .addContainer .main-action-big-btn i {
   font-size: 18px;
   margin-left: 38px;
   margin-top: 2px;
}
.page-action-buttons .addContainer .page-action-btn i,
.page-action-buttons .addContainer .page-action-big-btn i,
.integration-action-buttons .addContainer .integration-action-btn i,
.integration-action-buttons .addContainer .integration-action-big-btn i,
.manual-container .addContainer .main-action-btn i,
.manual-container .addContainer .main-action-big-btn i,
.printable-action-buttons .addContainer .printable-action-btn i,
.printable-action-buttons .addContainer .printable-action-big-btn i {
   font-size: 18px;
   /* margin-left: 43px; */
   /* margin-top: 2px; */
}

.main-action-buttons .addContainer .main-action-btn:before {
    content: "\002B";
    font-size: 36px;
    position: absolute;
    top: 9px;
    left: 38px;
    /* text-align: center; */
    /* display: block; */
}
.main-action-buttons .addContainer .main-action-big-btn:before {
    content: "\002B";
    font-size: 36px;
    position: absolute;
    top: 6px;
    left: 98px;
}
.main-action-buttons .addContainer span,
.page-action-buttons .addContainer span,
.integration-action-buttons .addContainer span,
.manual-container .addContainer span,
.printable-action-buttons .addContainer span {
   display:block;
   text-align: center;
   padding-top: 6px;
}

/* Export Buttons in Page Actions */

.exportContainer {
    padding: 20px 0px;
}
.export-button {
    /* background: #7B8289; */
    /* border: 1px solid #707070; */
    text-align: center;
    margin-bottom: 10px;
    /* border-radius: 7px; */
}
.exportContainer a {
    display: block;
    padding: 24px;
}
.exportContainer i {
    display: block;
    font-size: 18px;
    margin-top: 2px;
}

/* Dashboard tab shortcuts */

.shortcutContainer {
    width: 100%;
    height: 40px;
    display: block;
    margin-bottom: 40px;
}

.shortcutContainer .cutCorner a, .shortcutContainer .cutCorner_first a {
    position: relative;
    background: #F0F4F5;
    display: block;
    height: 40px;
    float: left;
    font-size: 14px;
    border-top-right-radius: 7px;
    border: 1px solid #E7E9EB;
    border-bottom: 0px solid #fff;
}

.shortcutContainer .cutCorner a.active {
    background: #FF9D00;
    color: white;
    border: 1px solid #FF9D00;
    border-bottom: 0px solid #fff;
}

.shortcutContainer .cutCorner a span {
  display: inline-block;
  padding: 9px 20px;
  text-transform: uppercase;
  font-weight: 800;
}

.shortcutContainer .cutCorner_first a span {
    padding: 9px 20px 9px 40px;
}

.shortcutContainer .cutCorner a:before {
    position:absolute; left:0px; top:0px; content:'';
    border-top: 21px solid #E7E9EB;
    border-right: 21px solid transparent;
}

.shortcutContainer .cutCorner a:after {
    position:absolute; left:-1px; top:-1px; content:'';
    border-top: 21px solid white;
    border-right: 21px solid transparent;
}

.shortcutContainer .cutCorner a.active:before {
    position:absolute; left:0px; top:0px; content:'';
    border-top: 21px solid #FF9D00;
    border-right: 21px solid transparent;
}

.shortcutContainer .cutCorner a.active:after {
    position:absolute; left:-1px; top:-1px; content:'';
    border-top: 21px solid white;
    border-right: 21px solid transparent;
}

.shortcutContainer .cutCorner_first a:before {
    position:absolute;
    left: -1px;
    top: -1px;
    content:'';
    border-top: 41px solid #E7E9EB;
    border-right: 42px solid transparent;
}

.shortcutContainer .cutCorner_first a:after {
    position:absolute;
    left: -2px;
    top: -2px;
    content:'';
    border-top: 41px solid white;
    border-right: 42px solid transparent;
}

.shortcutContainer .cutCorner_first a.active:before {
    position:absolute;
    left: -1px;
    top: -1px;
    content:'';
    border-top: 41px solid #FF9D00;
    border-right: 42px solid transparent;
}

.shortcutContainer .cutCorner_first a.active:after {
    position:absolute;
    left: -2px;
    top: -2px;
    content:'';
    border-top: 41px solid white;
    border-right: 42px solid transparent;
}

.portal-shortcuts {
    border-bottom: 1px solid #FF9D00;
    margin-bottom: 50px;
}

.portal-shortcuts .loop-tabs a {
    display: inline-block;
    margin: 0 0 -1px;
    padding: 15px 25px;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #7B8289;
    border: 1px solid transparent;
    position: relative;
}

.portal-shortcuts .loop-tabs a span {
    text-transform: lowercase;
}

.portal-shortcuts .loop-tabs {
    font-size: 12px;
}

.portal-shortcuts .loop-tabs a.active:before {
    position:absolute;
    left: -1px;
    top: -1px;
    content:'';
    border-top: 51px solid #FF9D00;
    border-right: 51px solid transparent;
}

.portal-shortcuts .loop-tabs a.active:after {
    position:absolute;
    left: -2px;
    top: -2px;
    content:'';
    border-top: 51px solid white;
    border-right: 51px solid transparent;
}

.portal-shortcuts .loop-tabs a.active {
    /* color: #00c0f3; */
    /* border: 1px solid; */
    border-top: 1px solid #FF9D00;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #FF9D00;
    border-top-right-radius: 12px;
    padding: 15px 25px 15px 50px;
}

.page-title {
    text-transform: uppercase;
    font-weight: 800;
    font-size: 30px;
    color: #58616A;
    letter-spacing: 0.42px;
    margin-bottom: 40px;
}

.page-title .portal-title {
    font-size: 12px;
    font-weight: 400;
    display: inline-block;
}

.page-title .portal-title span {
    text-transform: uppercase;
    font-weight: 800;
    font-size: 30px;
    color: #58616A;
    letter-spacing: 0.42px;
    display:block;
}

.page-title .title-icon {
    text-transform: uppercase;
    font-weight: 800;
    font-size: 28px;
    padding-right: 10px;
    color: #FF9D00;
    vertical-align: text-top;
}

/* Basic Select replacement styles ( some of these might be overided bellow ) */

.fancy-select {
    font-size: 12px;
    display: block !important;
    position: relative;
    font-weight: normal !important;
    padding: 0px !important;
}

.fancy-select .text {
    height: 40px !important;
    line-height: 38px !important;
    /* padding: 0 30px 0 10px !important; */
    border: 1px solid #BBC4CC;
    border-radius: 4px;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.12);
    background: white;
    color: #58616A;
    font-size: 13px;
    width: 100%;
}

.fancy-select .text:hover {
    /*border-color: #CED5DB;
    -webkit-transition: .1s linear border;
    -moz-transition: .1s linear border;
    -ms-transition: .1s linear border;
    -o-transition: .1s linear border;
    transition: .1s linear border;*/
}

.fancy-select .text:focus {
    border-color: #8ccfff;
    box-shadow: 0 0 5px #8ccfff, inset 0 0 2px rgba(0, 0, 0, 0.12);
}

.fancy-select .arrow {
    position: absolute;
    right: 0;
    height: 40px !important;
    width: 35px !important;
    margin: 0 !important;
    line-height: 42px;
    text-align: center;
    color: white;
    font-size: 16px;
    background: #FF9D00;
}

div.fancy-select .arrow > i {
    pointer-events: none;
}

.fancy-select .arrow:hover {
    background-color: #FFB237;
}

ul.fancy-select {
    margin-left: 0px !important;
    z-index: 100;
    font-size: 12px;
    border-left: solid 1px #BBC4CC;
    border-bottom: solid 1px #BBC4CC;
    border-right: solid 1px #BBC4CC;
}

ul.fancy-select {
    max-height: 250px;
    width: 100%;
    /*max-width: 549px;*/
}

ul.fancy-select li:hover {
    background-color: silver !important;
}

ul.fancy-select li .text:hover {
    color: #fefefe !important;
}

ul.fancy-select li.selected {
    background-color: #FF9D00 !important;
    font-weight: normal !important;
}

ul.fancy-select li.selected .text {
    color: #fefefe !important;
}

ul.fancy-select li {
    padding: 0px !important;
    border: 0px solid #BBC4CC !important;
    background-color: #fefefe !important;
    width: 100%;
}

ul.fancy-select li .text {
    background: none;
    border: 0;
    color: #484848;
    height: auto !important;
    line-height: 20px !important;
    width: 100% !important;
    padding: 10px 5px !important;
}

ul.fancy-select li .text:hover,
ul.fancy-select li .text:focus {
    border-color: none;
    box-shadow: 0 0 0px #8ccfff, inset 0 0 0px rgba(0, 0, 0, 0.12);
}


/* Launchers on dashboard */

.custportal,
.supportal {
    display: inline-block;
    width: 49%;
    padding: 25px !important;
    margin-bottom: 20px;
}

.custportal {
    /*background: #00ccd6;*/
    background: #00c0f3;
    float: left;
}

.supportal {
    /*background: #f3cf00;*/
    background: #f39700;
    float: right;
}

.custportal h5,
.supportal h5 {
    font-size: 20px;
    margin-bottom: 5px;
    margin-top: 0;
    color: #484848;
}

.custportal p,
.supportal p {
    font-size: 13px;
    color: #484848;
}

.custportal input[type="text"],
.supportal input[type="text"] {
    margin-bottom: 5px;
    width: 100%;
}

.custportal button,
.supportal button {
    padding: 5px 30px;
    border-radius: 4px;
    font-size: 13px;
    background: #484848;
    border: 0px solid;
    color: #fff;
    margin-top: 20px;
}

.custportal button:hover,
.supportal button:hover {
    background: #09c;
}

.launchWrap {
    position: relative;
    width: 100%;
}

@media (max-width: 767px), (max-width: 991px) {
    .custportal,
    .supportal {
        display: block;
        width: 100%;
        padding: 25px !important;
        margin: 20px 0px;
        float: left;
    }
}


/* Language selector */

.language {
    display: inline-block;
    /* position: relative; */
    width: 50px;
    float: right;
    margin-top: 5px;
    margin-right: 15px;
}

#switchlang .fancy-select .text {
    width: 40px;
    /* margin: 0 auto; */
    border: 0px solid #BBC4CC;
    font-weight: 400;
    box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.12);
    text-align: center;
    float: none;
    display: inline-block;
    padding: 0;
    font-size: 13px;
}

#switchlang .fancy-select .arrow {
    /* position: relative; */
    right: 0px;
    top: -1px;
    float: none;
    display: inline-block;
    height: 16px !important;
    width: 16px !important;
    margin: 0 !important;
    line-height: 40px;
    text-align: center;
    color: #58616A;
    font-size: 13px;
    background: #fff;
    border: 0px solid #BBC4CC;
}

ul.switchlang {
    margin-left: 0px !important;
    z-index: 100;
    overflow: visible !important;
    font-size: 14px;
    /* width: 180px; */
    border-bottom: 2px solid orange;
    /* box-shadow: 8px 3px 6px #00000014; */
    box-shadow: 0px 3px 6px #0000001A;
}


/* Search bar */
/*.company-info {
    margin-top: 8px;
    text-align: right;
    position: absolute;
    top: 5px;
    right: 5px;
    color: #5c5c5c;
}*/

.notification-info {
    /* margin-top: 8px; */
    text-align: right;
    /*position: absolute;*/
    /* top: 5px; */
    right: 5px;
    color: #5c5c5c;
}

.notification-info #comingUp {
    /* margin-top: 8px; */
    text-align: right;
    /*position: absolute;*/
    /* top: 5px; */
    right: 5px;
    color: #17b101;
}
.company-header-title i {
	display:inline-block;
}
.company-header-title h5 {
    /* color: #fff; */
    font-weight: 800;
    padding: 15px 0px 15px 0px;
    margin: 0;
    /* text-decoration: underline; */
    text-transform: uppercase;
    font-size: 16px;
    display:inline-block;
}

/*.link-change {
    font-size: 13px;
    line-height: 50px;
    height: 50px;
    display: inline-block;
    margin-left: 5px;
}*/
/* .company-info span:not(:only-child)::after { */
.company-info span.userCompanyLink:after {
    content:' | ';
}

.formSearch {
    margin-top: 8px;
    line-height: 0px;
	text-align: right;
}

#notificationHub {
    height: 50px;
    width: 260px;
    /*margin-right: 10px;*/
    display: inline-flex;
    vertical-align: top;
    flex-direction: row;
    clear: both;
    flex-wrap: nowrap;
    /*padding-right: 10px;*/
    padding-top: 5px;
    justify-content: flex-end;
}

#notificationHub .notifItem {
    height: 100%;
    flex: 1;
    display:inline-block;
    position:relative;
    max-width: 50px;
}

#notificationHub div.notifItem button.notifItemButton {
    background:transparent;
    border:none;
    padding:0;
    width: 40px;
    height: 40px;
    font-size: 18px;
    cursor: pointer;
}

#comingUp div.notifItem button.notifItemButton {
    background:transparent;
    border:none;
    padding:0;
    width: 100px;
    height: 40px;
    cursor: pointer;
    color: #FF9D00;
}

#comingUp div.notifItem button.notifItemButton span {
    padding-left: 5px;
}

.adgrid_settings {
    margin-bottom: 20px;
}

button.tutorialButton {
    background: transparent;
    box-shadow: none;
    border: none;
    color: #58616A;
    text-transform: uppercase;
    font-size: 13px;
    height: 44px;
    width: 100%;
    padding: 0;
    margin: 0;
}
button.tutorialButton:hover {
    background: #FFB237;
    color: #fff;
}

#notificationHub div.notifItem button.notifItemButton .notifCount {
    position: absolute;
    top: 3px;
    right: 3px;
    width: 0; /* Width will be calculated with javascript */
    height: 13px;
    font-size: 10px;
    background: #CC0018;
    border-radius: 30px;
    color: white;
    text-align: center;
}

span.userCompanyLink {
    vertical-align: top;
    height: 50px;
    line-height: 50px;
    display: inline-block;
	font-size: 16px;
}
span.userCompanyLink a {
    line-height: 50px;
    height: 50px;
}

#notificationHub div.notifItem div.notifItemList {
    position: absolute;
    overflow: auto;
    top: 45px;
    left: -250px;
    width: 300px;
    max-height: 420px;
    background: #fafafa;
    border: 1px solid #BBC4CC;
}

#notificationHub div.notifItem div.notifItemList .notifListItem {
    min-height: 80px;
    height: initial;
    background-color: #fafafa;
    padding: 10px;
    text-align: left;
    color: #484848;
    font-size: 12px;
    border-bottom: 1px solid #e5e5e5;
}

#notificationHub div.notifItem div.notifItemList .notifStamp {
    margin-top: 1rem;
    display: flex;
}

#notificationHub div.notifItem div.notifItemList .notifLabel {
    font-size: 14px;
    margin-bottom: 5px;
}

#notificationHub div.notifItem div.notifItemList .notifStampLink {
    flex: 1;
}

#notificationHub div.notifItem div.notifItemList .notifStampDate {
    flex: 1;
    text-align: right;
}

#notificationHub div.notifItem div.notifItemList .notifListLabel {
    text-align: left;
    padding: 10px 0 10px 10px;
    font-size: 14px;
    border-bottom: 1px solid #e5e5e5;
}

#notificationHub div.notifItem div.notifItemList .showmore {
    display: block;
    height: 25px;
    font-size: 12px;
    line-height: 25px;
    text-align: center;
}

#notificationHub div.notifItem div.notifItemList i.labelIcon {
    margin-right: 10px;
}

/* #notificationHub .markAsRead {
    text-align: right;
    margin-top: 6px;
    cursor: pointer;
}

#notificationHub .markAsRead {
    cursor: pointer;
} */

#notificationHub .notifItem .notif-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0.5rem;
}

#notificationHub .notifItem .notif-actions > .notif-actions-left,
#notificationHub .notifItem .notif-actions > .notif-actions-right {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

#notificationHub .notifItem .notif-actions > .notif-actions-right {
    text-align: right;
}

#notificationHub .notifItem .notif-actions button.notif-item-button {
    cursor: pointer;
    border: 0;
    background: transparent;
    padding:0;
}

#notificationHub .notifItem .notif-actions button.notif-item-button:hover {
    text-decoration: underline;
}

.searchForm input,
.searchForm input[type="text"] {
    height: 33px;
    width: 200px !important;
    vertical-align: top;
    color: #484848;
    background: #fdfdfd;
    border: solid 1px #BBC4CC;
    font-size: 13px;
	margin-right: -4px;
}

.searchForm button {
    height: 33px !important;
    width: 45px !important;
    text-align: center;
    color: #fefefe;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    background: #484848;
    cursor: pointer;
    border: solid 0px #BBC4CC;
    padding: 0;
}

.searchForm button span {
    background: url(/assets/styles/user/grid/layout/icons/new_magnify_white_small.png) no-repeat 10px 7px;
    display: block;
    height: 33px;
    width: 45px;
}

.search-li {
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 240px;
}

.search-li:hover {
	background: #eeeeee;
}

.search-li a:hover {
    color: #484848;
}

@media (max-width: 767px), (max-width: 991px) {
    /*.company-info {
        float:right;
        position: relative;
        margin-bottom: 18px;
		right: 20px;
		margin-left: 65px;
    }*/
    .formSearch {
        padding-top: 0px;
        height: 33px;
        margin-bottom: 10px;
    }
    .searchForm input,
    .searchForm input[type="text"] {
        width: 97% !important;
		float: left;
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }
    .searchForm button {
        position: absolute;
        right: 25px;
    }
	
	#notificationHub {
		margin-right: 0px;
	}

    #notificationHub div.notifItem div.notifItemList {
        left: 0;
    }
}


/* Pagination */

.paginator {
	margin-bottom: 15px;
}

.paginator .fancy-select {
    font-size: 12px;
    display: block !important;
    position: relative;
    font-weight: normal !important;
    padding: 0px !important;
    border-radius: 2px;
}

.paginator .fancy-select .text {
    height: 33px !important;
    line-height: 32px;
    /* padding: 0 30px 0 10px !important; */
    border: 1px solid #707070;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.12);
    background: #7D838A;
    color: white;
    font-size: 12px;
    width: 57px;
    text-align: center;
}

.paginator ul.fancy-select .text  {
    height: 37px !important;
    line-height: 32px;
    /* padding: 0 30px 0 10px !important; */
    border: 0px solid #707070;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.12);
    background: none;
    color: #484848;
    font-size: 12px;
    width: 57px;
    text-align: center;
}

.paginator .fancy-select .text:hover {
    border-color: #BBC4CC;
    -webkit-transition: .1s linear border;
    -moz-transition: .1s linear border;
    -ms-transition: .1s linear border;
    -o-transition: .1s linear border;
    transition: .1s linear border;
}

.paginator .fancy-select .text:focus {
    border-color: #8ccfff;
    box-shadow: 0 0 5px #8ccfff, inset 0 0 2px rgba(0, 0, 0, 0.12);
}

.paginator .fancy-select .arrow {
    position: absolute;
    right: 0;
    height: 35px !important;
    width: 45px !important;
    margin: 0 !important;
    line-height: 34px;
    text-align: center;
    color: white;
    font-size: 16px;
    background: #58616A;
    border: 1px solid #707070;
}

.right-sidebar.right-sidebar-expanded .perPage,
.right-sidebar.right-sidebar-expanded .jumpper {
    position: relative;
    text-align: right;
    padding-right: 20px;
}

.right-sidebar.right-sidebar-collapsed .perPage,
.right-sidebar.right-sidebar-collapsed .jumpper {
    position: relative;
    text-align: center;
}

.perPage {
    margin-bottom: 15px;
}

.right-sidebar.right-sidebar-collapsed .perPage .hide-expanded,
.right-sidebar.right-sidebar-collapsed .jumpper .hide-expanded {
    font-size: 12px;
    word-wrap: break-word;
    display: block;
    text-align: center;
}

.right-sidebar.right-sidebar-expanded .perPage .hide-expanded,
.right-sidebar.right-sidebar-expanded .jumpper .hide-expanded,
.right-sidebar.right-sidebar-collapsed .perPage .paginate,
.right-sidebar.right-sidebar-collapsed .jumpper .paginate {
    display: none;
}

.fancy-select.ipp,
.fancy-select.jumpmenu {
    display: inline-block !important;
}

.paginate {
    margin-right: 19px;
    font-size: 12px;
    margin-left: 0px;
    /*float: left;*/
    line-height: 35px;
    text-transform: uppercase;
}

.right-sidebar.right-sidebar-expanded .perPage div.fancy-select.ipp,
.right-sidebar.right-sidebar-expanded .jumpper div.fancy-select.jumpmenu {
    min-width: 100px;
    text-align: left;
}

.right-sidebar.right-sidebar-collapsed .perPage div.fancy-select.ipp,
.right-sidebar.right-sidebar-collapsed .jumpper div.fancy-select.jumpmenu {
    text-align: center;
    min-width: 41px;
}

.right-sidebar.right-sidebar-expanded .perPage ul.fancy-select.ipp,
.right-sidebar.right-sidebar-expanded .jumpper ul.fancy-select.jumpmenu {
    width: 100px;
    text-align: center;
    max-height: 250px;
}

.right-sidebar.right-sidebar-collapsed .perPage ul.fancy-select.ipp,
.right-sidebar.right-sidebar-collapsed .jumpper ul.fancy-select.jumpmenu {
    width: 41px;
    text-align: center;
    max-height: 250px;
}

.right-sidebar.right-sidebar-collapsed .perPage .ipp .arrow,
.right-sidebar.right-sidebar-collapsed .jumpper .jumpmenu .arrow {
    display: none;
}

.allpages {
    text-align: center;
	padding: 20px 0px;
}

.allpages a {
    font-size: 16px;
    color: #484848;
    margin-left: 5px;
}
.allpages a:hover {
	color: #b9bbbe;
}

.allpages span {
    font-size: 16px;
    color: grey;
}

.allpages a.current {
    text-decoration: none;
    color: #00c0f3;
}


/* Graphs */

.companyName {
    margin-bottom: 25px;
}

.invWrapper {
    margin-top: 20px;
}

.month,
.month:hover {
    background: #f5f5f5 !important;
}

.month td {
    text-align: left;
}

div#monthly-invoice-chart {
    width: 80%;
    height: auto;
    min-height: 250px;
}


/* Table row styles */

table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

#mainform tr:nth-of-type(even) {
    /* background: #f5f5f5; */
}

#mainform.modelGrid td {
    white-space: pre-line;
}

.grid-status-success {
    color: #27BF02;
    font-weight: bold;
}

.grid-status-danger {
    color: #E00909;
    font-weight: bold;
}

.grid-status-warning {
    color: #F4C503;
    font-weight: bold;
}

.grid-status-on-hold {
    color: #FF00FF;
    font-weight: bold;
}

.options-area{
    width: 50px;
}

.status-area{
    width: 70px;
}

col.td-icon {
    width: 50px;
}

th {
    border: 0px solid #DFE4E6 !important;
    font-weight: bold;
}

td,
th {
    padding: 6px;
    text-align: center;
    min-height: 32px;
    border: 1px solid #DFE4E6;
    font-size: 12px;
    word-break: break-word;
}

td.td-left {
    text-align: left;
    vertical-align: top;
}

.td-clickable {
    cursor: pointer;
}

th.table-header-options {
    text-align: right;
}

td.no-border {
	border: none;
	padding: 15px 5px;
}

td.options-width {
    text-align: right;
}

td.options-width ul {
    margin: 0;
    padding: 0;
    min-width: 85px;
}

/*@media only screen and (max-width: 767px),
(max-device-width: 767px), (max-width: 991px) {
    table:not(.skipMobileLayout) {
        border: 0;
    }
    table:not(.skipMobileLayout) thead {
        display: none;
    }
    table:not(.skipMobileLayout) tr {
        margin-bottom: 10px;
        display: block;
        border-bottom: 2px solid #ddd;
    }
    table:not(.skipMobileLayout) td {
        display: block;
        text-align: right;
        font-size: 13px;
        border-bottom: 1px dotted #ccc;
    }
    table:not(.skipMobileLayout) td:last-child {
        border-bottom: 0;
    }
    table:not(.skipMobileLayout) td:before {
        content: attr(data-label);
        float: left;
        text-transform: uppercase;
        font-weight: bold;
    }
    td.options-width ul {
        height: 40px;
    }
    .editbut,
    .delbut,
    .viewbut {
        width: 50px !important;
    }
    .editbut span,
    .delbut span,
    .viewbut span {
        display: none;
    }
    .binpartsHeaderRow th {
        display:none;
    }
    .pika-table thead {
    	display:table-header-group !important;
    }
    .pika-table tr {
    	display:table-row !important;
    }
    .pika-table td {
    	display: table-cell !important;
    }
}*/

.viewbut {
    display: inline-block;
    /*float: left;*/
    background: url(/assets/styles/user/grid/layout/icons/prev_but.png) 0% 0% no-repeat;
    width: 40px;
    height: 40px;
}

.viewbut:hover {
    background-position: 0% 100%;
}

.editbut {
    display: inline-block;
    /*float: left;*/
    background: url(/assets/styles/user/grid/layout/icons/edit_but.png) 0% 0% no-repeat;
    width: 40px;
    height: 40px;
}

.editbut:hover {
    background-position: 0% 100%;
}

.prevbut {
    display: inline-block;
    /*float: left;*/
    background: url(/assets/styles/user/grid/layout/icons/prev_but.png) 0% 0% no-repeat;
    width: 40px;
    height: 40px;
}

.prevbut:hover {
    background-position: 0% 100%;
}

.editbut a,
.delbut a,
.prevbut a,
.viewbut a {
    display: block;
    width: 100%;
    height: 100%;
}

.delbut {
    display: inline-block;
    /*float: left;*/
    background: url(/assets/styles/user/grid/layout/icons/del_but.png) 0% 0% no-repeat;
    width: 40px;
    height: 40px;
}

.delbut:hover {
    background-position: 0% 100%;
}

.badgeNotShippable {
    display: block;
    position: absolute;
    z-index: 99;
    font-weight: bold;
    top: -9px;
    left: -2px;
    padding-right: 4px;
    padding-left: 4px;
    color: rgb(254, 254, 254);
    background: rgb(255, 127, 0);
    border: 1px solid rgb(255, 0, 0);
}

.badgeShippable {
    display: block;
    position: absolute;
    z-index: 99;
    font-weight: bold;
    top: -9px;
    left: -2px;
    padding-right: 4px;
    padding-left: 4px;
    color: rgb(254, 254, 254);
    background: #27BF02;
    border: 1px solid #27BF02;
}


/* form styles */

.inner-form,
.custInv,
.custOrd,
.custShip,
.custRma,
.custProd,
.supInv,
.supOrd,
.supPay,
.supRecep {
    font-size: 13px;
}

.inner-form label,
.custInv label,
.custOrd label,
.custShip label,
.custRma label,
.custProd label,
.supInv label,
.supOrd label,
.supPay label,
.supRecep label {
    font-weight: 800;
    display: block;
    margin-bottom: 5px;
}

label.spacer {
    margin-bottom: 23px;
}

.inner-form img {
    width: 100%;
    height: auto;
}

.item {
    position: relative;
    margin-bottom: 5px;
}

.item div.value {
    padding: 10px 0px;
}

.item div.value div {
    padding: 0px 0px;
}

.item span div {
    padding: 10px 0px;
}

.item p {
    margin: 0;
    /* padding: 10px 0px; */
    /* min-height: 1px; */
}

.detailDrop .item {
    margin-top: 22px;
}

.item.erphead {
    margin-bottom: 23px;
}

.item input[type="text"],
.item input[type="password"],
.item input[type="date"],
.item input[type="number"],
.lineElemCombiner input[type="text"],
.filterBlock input[type="text"],
.CAWrapper input[type="text"] {
    width: 100%;
    height: 40px;
    font-size: 13px;
}

.item textarea {
    width: 100%;
    min-height: 94px;
    font-size: 13px;
    display: block;
}

div[id*="me-"],
div[class*="mooedit"] {
    width: 100% !important;
}

.sortableContainer .sortables {
    margin-bottom: 7px;
    cursor: pointer;
}

.sortableContainer a,
.manager,
.emptybans {
    display: inline-block;
    width: 49.5%;
    float: left;
    color: #fff !important;
    text-decoration: none;
    background: #484848;
    text-align: center;
    padding: 6px 0px;
    border-radius: 6px;
}

.sortableContainer a:last-child {
    float: right;
}

.manager,
.emptybans {
    width: 100%;
}

.sortableContainer:before,
.sortableContainer:after,
.sortables:before,
.sortables:after {
    content: " ";
    display: table;
}

.sortableContainer:after,
.sortables:after {
    clear: both;
}

@media (max-width: 400px) {
    .row>[class*="col-"] {
        padding: 0 0;
    }
    .sortables>[class*="col-"] {
        padding: 0 0;
    }
    .row>[class*="custInvLine"] {
        padding: 0 0;
    }
    .itemSet {
        width: 100%;
        display: block;
    }
}

@media (min-width: 401px) and (max-width: 767px), (max-width: 991px) {
    .row>[class*="col-"] {
        padding-left: 5px;
        padding-right: 0;
    }
    .row>[class*="col-"]:nth-child(1),
    .row>[class*="col-"]:nth-child(3) {
        padding-left: 0;
        padding-right: 5px;
    }
    .sortables>[class*="col-"] {
        padding-left: 5px;
        padding-right: 0;
    }
    .sortables>[class*="col-"]:nth-child(1),
    .sortables>[class*="col-"]:nth-child(3) {
        padding-left: 0px;
        padding-right: 5px;
    }
    .itemSet {
        width: 50%;
        float: left;
    }
    .row>[class*="itemSet col-lg-6 col-md-6 col-sm-6 col-xs-6"] {
        width: 100%;
        clear: both;
    }
    .row>[class*="custInvLine"] {
        padding-left: 0px;
        padding-right: 5px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .row>[class*="col-"]:first-child {
        padding-left: 0;
        padding-right: 0;
    }
    .row>[class*="col-"] {
        padding-left: 10px;
        padding-right: 0px;
    }
    .row>div[class*="custInvLine"],
    .row>div[class*="custOrdLine"],
    .row>div[class*="custShipLine"],
    .row>div[class*="supInvLine"],
    .row>div[class*="supOrdLine"],
    .row>div[class*="supRecepLine"] {
        padding-left: 0px;
        padding-right: 10px;
        min-height: 170px;
    }
    .sortables>[class*="col-"]:first-child {
        padding-left: 0px;
    }
    .sortables>[class*="col-"] {
        padding-left: 10px;
        padding-right: 0px;
    }
}

@media (min-width: 992px) {
    .row>[class*="col-"]:first-child {
        padding-left: 0;
        padding-right: 0;
    }
    .row>[class*="col-"] {
        padding-left: 10px;
        padding-right: 0px;
    }
    .row>div[class*="custInvLine"],
    .row>div[class*="custOrdLine"],
    .row>div[class*="custShipLine"],
    .row>div[class*="supInvLine"],
    .row>div[class*="supOrdLine"],
    .row>div[class*="supRecepLine"] {
        padding-left: 0px;
        padding-right: 10px;
        min-height: 150px;
    }
    .sortables>[class*="col-"]:first-child {
        padding-left: 0px;
    }
    .sortables>[class*="col-"] {
        padding-left: 10px;
        padding-right: 0px;
    }
}

@media (min-width: 1200px) {
    .row>[class*="col-"]:first-child {
        padding-left: 0;
        padding-right: 0;
    }
    .row>[class*="col-"] {
        padding-left: 10px;
        padding-right: 0px;
    }
    .row>div[class*="custInvLine"],
    .row>div[class*="custOrdLine"],
    .row>div[class*="custShipLine"],
    .row>div[class*="supInvLine"],
    .row>div[class*="supOrdLine"],
    .row>div[class*="supRecepLine"] {
        padding-left: 0px;
        padding-right: 10px;
        min-height: 150px;
    }
    .sortables>[class*="col-"]:first-child {
        padding-left: 0px;
    }
    .sortables>[class*="col-"] {
        padding-left: 10px;
        padding-right: 0px;
    }
}


/* User Settings */

#userForm {}

.user {
    float: left;
}

.userinfo {
    float: left;
    width: 48%;
    margin-right: 10px;
    margin-bottom: 6px;
}

div[class*="userinfo"]:nth-child(odd) {
    float: right;
    margin-right: 0px;
}

.userinfo label {
    display: block;
    margin-bottom: 3px;
}

.userinfo input {
    width: 100%;
    height: 33px;
}

#udataTitle h2,
#createlinkwinTitle h2,
#resetpasswordwinTitle h2 {
    margin-top: 6px;
    margin-left: 5px;
    font-size: 24px;
    margin-bottom: 0;
    padding-top: 0;
    color: #484848;
}

h2.changePasswordTitle {
    margin-top: 15px;
    font-size: 1em;
    padding-top: 0;
    color: #313131;
    font-weight: bold;
}

.set {
    background: #484848;
    color: #fff;
    padding: 10px 10px;
}

.userinfo select {
    width: 100%;
    height: 33px;
    padding: 5px;
    border: 1px solid #BBC4CC;
    font-size: 14px;
    line-height: normal;
    color: #606060;
    resize: none;
    border-radius: 2px;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.12);
}

ul.ulang,
ul.ucountry {
    max-width: 282px;
}

.closer {
    background: url('/assets/styles/user/grid/layout/icons/close_button.png') no-repeat 100%;
}

.closer h5 {
    font-size: 14px;
    line-height: 36px;
    text-align: right;
    padding-right: 45px;
    margin: 0;
    font-family: "Lucida Grande", "Lucida Sans Unicode", sans-serif !important;
}


/* Important information and button styles */

.info {
    background: url('/assets/styles/user/grid/layout/icons/info.png') no-repeat left 8px;
}

.info p {
    margin-bottom: 15px;
    padding-top: 7px;
    word-break: break-word;
    font-size: 12px;
    line-height: 18px;
    margin-left: 20px;
}

.obs p {
    width: auto;
    background: url(/assets/styles/user/grid/layout/icons/active_but.png) no-repeat 0% 50%;
    display: inline-block;
    margin-bottom: 15px;
    text-indent: 20px;
    font-size: 12px;
}

.buttonGroup li {
    display: inline-block;
}

.successButton.active {
    background: url('/assets/styles/user/grid/layout/icons/active.png') no-repeat 0% 0%;
    color: #000 !important;
    font-size: 13px;
    padding: 10px 10px 11px 20px;
    margin-right: 5px !important;
    box-shadow: none;
    font-weight: bold;
    display: block;
	height: 36px;
}

.successButton.active:hover {
    background-position: 0% 100%;
    color: #333;
}

.contrastButton.deactive {
    background: url('/assets/styles/user/grid/layout/icons/deactive.png') no-repeat 0% 0%;
    color: #4e4e4e !important;
    font-size: 13px;
    padding: 10px 10px 11px 20px;
    margin-right: 5px !important;
    box-shadow: none;
    display: block;
	height: 36px;
}

.contrastButton.deactive:hover {
    background-position: 0% 100%;
    color: #8e8e8e;
}

.update,
.empty,
.proceed,
.reset {
    height: 45px;
    padding: 0 15px;
    margin-right: 10px;
    background: #484848;
    border: solid 0px;
    border-radius: 3px;
    color: #fff;
    text-transform: uppercase;
    font-size: 13px;
    cursor: pointer;
}

.proceed {
    background: #09C;
    margin-right: 0px;
    color: #fff;
}

.proceed:hover {
    background: #0077AA;
}

#resetpasswordwin .proceed {
    float: left;
    clear: both;
}

.psearch-container {
    display: inline-block;
}


/* Notifications */

#notif h3 {
  margin: 0;
  padding: 0;
  font-size: 18px;
}

/* Autocompleter */ 

.CAWrapper {
	vertical-align: top;
    position: relative;
    display: inline-block;
}
.completerListWrapper {
	background: #fafafa;
	border: 1px solid #BBC4CC;
	border-top: 0;
	display: inline-block;
	font-size: 12px;
	left: 0px;
	position: absolute;
	white-space: nowrap;
	z-index: 1000;
}
.completerSelected {
	text-decoration: underline;
}
.completerListItem {
	padding: 5px;
	font-size: 12px;
	cursor: pointer;
}
.completerListItem:hover,
.completerSelected {
	background: #eeeeee;
}

.disabled_input {
	background-color: rgb(235, 235, 228) !important;
}

/* Tuoterivit */

/*#lineWrappers button,
#lineWrappers .redButton,
#lineWrappers .infoButton {
	cursor: pointer;
}*/
#lineWrappers .disabled {
	background-color: rgb(235, 235, 228) !important;
}
#lineWrappers .costlineWrapper,
#lineWrappers .pricelistPartWrapper,
#lineWrappers .warehouseBinUDWrapper,
#lineWrappers .binPartWrapper {
	background: #F0F0F0;
	border: 1px solid #BBC4CC;
	min-height: 25px;
	position: relative;
}
#lineWrappers .costlineWrapper .smallHeader,
#lineWrappers .pricelistPartWrapper .smallHeader,
#lineWrappers .binPartWrapper .smallHeader {
	display: inline-block;
	margin-top: 10px;
	vertical-align: top;
	margin-left: 10px;
	margin-right: 5px;
}
#lineWrappers .costlineWrapper .smallHeader:after,
#lineWrappers .pricelistPartWrapper .smallHeader:after,
#lineWrappers .binPartWrapper .smallHeader:after {
	content: ":";
}
#lineWrappers .costlineWrapper .lineName,
#lineWrappers .pricelistPartWrapper .lineName {
	display: inline-block;
	margin-top: 10px;
	margin-left: 10px;
	vertical-align: top;
	max-width: 250px;
	min-width: 250px;
}
#lineWrappers .costlineWrapper input[type="text"],
#lineWrappers .costlineWrapper select,
#lineWrappers .pricelistPartWrapper input[type="text"],
#lineWrappers .pricelistPartWrapper select {
	float: none;
	margin-left: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	width: 100px;
	line-height: normal;
}
#lineWrappers .warehouseBinUDWrapper input[type="text"],
#lineWrappers .warehouseBinUDWrapper select,
#lineWrappers .warehouseBinUDWrapper input[type="date"],
#lineWrappers .binPartWrapper input[type="text"] {
    width: 140px;
}
#lineWrappers .binPartWrapper input {
    margin-top: 12px;
    margin-bottom: 12px;
}

#lineWrappers .binPartWrapper .smallHeader {
    vertical-align: baseline;
}
#lineWrappers .costlineWrapper .lineInvoiceId {
	width: 200px;
}
#lineWrappers .costlineWrapper input[type="text"]:not(.disabled),
#lineWrappers .costlineWrapper select:not(.disabled),
#lineWrappers textarea,
#lineWrappers .pricelistPartWrapper input[type="text"]:not(.disabled),
#lineWrappers .pricelistPartWrapper select:not(.disabled) {
	/* background: #f7f7f7; */
}
#lineWrappers .lineElemCombiner {
	display: inline-block;
	white-space: nowrap;
	margin-left: 10px;
	vertical-align: top;
}
#lineWrappers .costlineWrapper,
#lineWrappers .pricelistPartWrapper,
#lineWrappers .binPartWrapper,
#lineWrappers .warehouseBinUDWrapper {
	margin-bottom: 10px;
}

#lineWrappers .addCostRow {
	margin-top: 20px;
	cursor: pointer;
}
#lineWrappers .removeCostRow {
	margin-right: 10px;
	margin-bottom: 5px;
	margin-left: 15px;
	margin-top: 5px;
	white-space: nowrap;
}
#lineWrappers .costlineWrapper  input[type="text"].lineComment {
	width: 475px;
}

.orderlinesTotal,
.orderlinesTotalCur {
	margin: 5px 0px 5px 0px;
  font-size: 18px;
}

#lineWrappers .orderlinesTotal,
#lineWrappers .calculateVismaLines {
	margin: 5px 0px 5px 0px;
    font-size: 18px;
}
#lineWrappers .redButton {
	background: #CC0018;
}
#lineWrappers .redButton:hover {
	background: #E9001B;
}
#lineWrappers .greenButton {
	background: #27BF02;
}
#lineWrappers .greenButton:hover {
	background: #03b612;
}

.greenButton {
	background: #27BF02;
}
.greenButton:hover {
	background: #03b612;
}

#lineWrappers .campaignInfo {
	padding-left: 10px;
	font-size: 13px;
	font-weight: bold;
	line-height: normal;
	margin-bottom: 5px;
}
#lineWrappers .campaignText {
	font-weight: normal;
}
.ml10 {
	margin-left: 10px !important;
}
.customers input {
  float: none !important;
}
.lineNumber {
	background: none !important;
	border: none !important;
	box-shadow: none !important;
	padding: 0 !important;
	margin: 0 !important;
}
.deleteModalWrapper {
	padding: 30px;
	border: 1px solid #BBC4CC !important;
	background: #f5f5f5;
}
.deleteModalWrapper .mBoxContent {
    font-size: 16px;
    padding: 30px 30px 30px 75px;
    background: url('/assets/styles/user/grid/layout/icons/halt.png') no-repeat 20px 20px;
}
.mBox.Modal .mBoxButtonContainer {
    text-align: center;
    padding-top: 20px;
}
.mBox.Modal .mBoxButton {
    margin-right: 10px;
    background: #808080;
    color: #fff !important;
    padding: 10px 40px;
	border: 0px;
    border-radius: 2px;
}
.mBox.Modal .mBoxConfirmButtonSubmit:hover {
    margin-right: 10px;
    background: #09c;
    color: #fff !important;
    padding: 10px 40px;
    border-radius: 2px;
}
.mBox.Modal .mBoxConfirmButtonCancel:hover {
    margin-right: 10px;
    background: red;
    color: #fff !important;
    padding: 10px 40px;
    border-radius: 2px;
}

/* Hide Customer/Supplier Portal graphs */

#invoices, #shipments, #receipts {
	display: none !important;
}
.loop-tabs label {
  /* position: relative; */
  display: inline-block;
  margin: 0 0 -1px;
  padding: 15px 25px;
  /*background: #16a085;*/
  font-weight: 600;
  font-size: 1.1em;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  /*line-height: 4;*/
  color: #484848;
  border: 0px solid transparent;
}
.loop-tabs label:hover {
  cursor: pointer;
  color: #789;
}
.loop-tabs input:checked + label {
  color: #00c0f3;
  border: 1px solid #444444;
  border-top: 2px solid #00c0f3;
  border-bottom: 1px solid #fff;
}
#tab-1:checked ~ #tab-content-1,
#tab-2:checked ~ #tab-content-2,
#tab-3:checked ~ #tab-content-3,
#tab-4:checked ~ #tab-content-4,
#tab-999:checked ~ #tab-content-999 {
  display: block;
}
/* Grid filter explanation texts and icons */

.guide-text ul li {
    display: inline-block;
    padding: 10px 10px;
    text-transform: uppercase;
    font-weight: 800;
    font-size: 14px;
}

.guide-text ul li:first-child {
    padding: 0px 10px 0px 0px;
}

.guide-text .new-order i {
    color: #FF9D00;
    font-size: 22px;
    vertical-align: bottom;
}

.guide-text .updated-order i {
    color: #98aec1;
    font-size: 22px;
    vertical-align: bottom;
}

.guide-text .delivered i {
    color: #27BF02;
    font-size: 22px;
    vertical-align: bottom;
}

.guide-text .partially-delivered i {
    color: #F4C503;
    font-size: 22px;
    vertical-align: bottom;
}

.guide-text .not-delivered i {
    color: #E00909;
    font-size: 22px;
    vertical-align: bottom;
}

.guide-text .partially-shipped-not-received i {
    color: #F4C503;
    font-size: 22px;
    vertical-align: bottom;
    background: linear-gradient(to right, #F4C503 0%,#F4C503 50%,#F4C503 50%,#E00909 50%,#E00909 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.guide-text .partially-received-not-shipped i {
    color: #F4C503;
    font-size: 22px;
    vertical-align: bottom;
    background: linear-gradient(to right, #E00909 0%,#E00909 50%,#E00909 50%,#F4C503 50%,#F4C503 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.guide-text .shipped-not-received i {
    color: #27BF02;
    font-size: 22px;
    vertical-align: bottom;
    background: linear-gradient(to right, #27BF02 0%,#27BF02 50%,#27BF02 50%,#E00909 50%,#E00909 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.guide-text .received-not-shipped i {
    color: #27BF02;
    font-size: 22px;
    vertical-align: bottom;
    background: linear-gradient(to right, #E00909 0%,#E00909 50%,#E00909 50%,#27BF02 50%,#27BF02 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Grid filters and dropdown menu*/

.pageFilters .row {
	margin-bottom: 10px;
}

a.show-filters, a.show-detail {
    font-size: 12px;
    text-transform: uppercase;
    background: #FF9D00;
    padding: 12px 30px 12px 15px;
    border-radius: 7px;
    color: white;
    font-weight: 800;
    position: relative;
    display: block;
}
a.show-filters.active::after,
a.show-detail.active::after {
	content: "\2212";
    font-size: 26px;
    text-align: center;
    -webkit-transition: all .35s;
    transition: all .35s;
    top: 3px;
    right: 14px;
    position: absolute;
}
a.show-filters::after,
a.show-detail::after {
    content: "\002B";
    font-size: 26px;
    text-align: center;
    font-weight: 400;
    -webkit-transition: all .35s;
    transition: all .35s;
    position: absolute;
    top: 3px;
    right: 14px;
}

a.show-filters:hover, a.show-detail:hover {
    background: #FFB237;
}

/*.content-wrapper div#filterContainer {
    width: 100%; 
    background:#fafafa; 
    border: 1px solid #BBC4CC;
    padding:5px;
    margin-bottom: 20px;
}*/
.content-wrapper div#filterContainer.open,
.content-wrapper div.detailContainer.open {
    width: 100%;
    /* background:#fafafa; */
    /* border: 1px solid #BBC4CC; */
    /* padding:5px;*/
    display:block;
    margin-bottom: 20px;
    height: auto;
    /*transition-property: all;
    transition-duration: .5s;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);*/
    transition: all .25s ease;
}
.content-wrapper div#filterContainer.close,
.content-wrapper div.detailContainer.close {
    width: 100%;
    /* background:#fafafa; */
    /* border: 1px solid #BBC4CC; */
    /* padding:5px; */
    position: relative;
    height: 0;
    /*transition-property: all;
    transition-duration: .5s;
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);*/
    transition: all .10s ease;
    opacity:0;
    display:none;
}

.content-wrapper div.detailContainer.close .row.no-margin {
    display: none;
}

.content-wrapper div.detailContainer.open {
    padding-top: 20px;
    margin-bottom: 0px;
}
.content-wrapper div.detailContainer.close .row  > [class*="col-"]{
    float: none;
}
.content-wrapper div#filterContainer label {
    font-size: 12px;
    font-weight: 800;
    color: #58616A;
}
.content-wrapper div#filterContainer input {
    padding: 7px;
    max-width: 166px;
    width: 100%;
    z-index: 1;
    position: relative;
    opacity: 1;
    border-radius: 4px;
}
.content-wrapper div#filterContainer .fancy-select {
    max-width: 166px;
    width: 100%;
    /*z-index: 2;*/
    position: relative;
    opacity: 1;
    border-radius: 4px;
}
div.filterBlock {
    display: inline-block;
    vertical-align: bottom;
    margin: 5px;
    width: 160px;
}
.content-wrapper div#filterContainer button.filterBtn {
    color: #fff;
    padding: 11px 24px 11px 24px;
    border: 1px solid #FF9D00;
    border-radius: 7px;
    background: #FF9D00;
    cursor:pointer;
    margin-bottom: 5px;
    margin-right: 15px;
    font-weight: 800;
    text-transform: uppercase;
}
.content-wrapper div#filterContainer button.filterBtn {
    border: 1px solid #FFB237;
    background: #FFB237;
}
.content-wrapper div#filterContainer button.filterBtn.clear {
    border: 1px solid #BBC4CC;
    background: #6B747E;
}
.content-wrapper div#filterContainer button.filterBtn.clear:hover {
    border: 1px solid #BBC4CC;
    background: #7B8289;
}

.content-wrapper div#filterContainer button.filterBtn i {
    margin-left: 15px;
    vertical-align: middle;
    font-size: 16px;
    margin-bottom: 1px;
}

.content-wrapper div#filterContainer button.filterBtn.clear i {
    color: #FF9D00;
}

.content-wrapper div#filterContainer div#filterControls {
    padding: 10px 5px 5px 5px;
}

.content-wrapper div#filterContainer button.filterBtn span {
    font-size: 14px;
    display: inline-block;
    vertical-align: text-top;
}

.allpages #paginatorCurrent {
    max-width: 60px;
    width:100%;
    text-align: right;
    padding: 2px;
}

.allpages #paginatorMax {
    display:inline-block;
}

.allpages button.navButton {
    background: transparent;
    border:none;
    color: #484848;
    cursor: pointer;
}

.allpages button.navButton:hover {
    color: #b9bbbe;
}

#gridLoader {
    padding: 100px 0 0 0;
    position: absolute;
    width: 100%;
    height: 100%;
    background: #969696;
    opacity: 0.8;
    min-height: 350px;
}

#gridLoader .gridLoadingSpinner {
    display:block;
    width: 40px;
    height: 30px;
    margin: 0 auto;

    background-image: url(/assets/styles/user/loading.gif);
    background-repeat: no-repeat;
    background-position: center;
    flex: 1 100%;
}

#gridLoader .gridLoadingText {
    font-size: 14px;
    color: #484848;
    text-align: center;
    flex: 1 100%;
}

#noResultsNotifier .noResults {
    font-size: 14px;
    color: #484848;
    text-align: center;
}

#mainform .gridLoaderContainer {
    width: 150px;
    margin: 0 auto;
    height: 150px;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    background: #fff;
    z-index: 10;
}

#noResultsNotifier .newEntry {
    text-align: center;
}

#noResultsNotifier .newEntry a {
    display: block;
    width: 60px;
    margin: 10px auto;
    height: 60px;
}

#noResultsNotifier .newEntry a i {
    display: block;
}

#noResultsNotifier .newEntry a {
    font-size: 14px;
}

#mainform {
    position: relative;
    /* z-index: 10; */
}

#mainform .grid-label {
    cursor: pointer;
}

#mainform .grid-label:hover {
    color: royalblue;
}

#mainform .grid-label.nosort:hover {
    color: inherit;
    cursor: initial;
}

#mainform .grid-label.active {
    color: royalblue;
}

#mainform .flexcontainer {
    display: -webkit-flex;
    display: flex;
}

#mainform .labelcontainer {
    display: inline-block;
    flex: 1 auto;
}

#mainform table .delbut button {
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent;
    cursor: pointer;
}

#mainform .sorticon {
    display: inline-block;
    flex: 1 auto;
    text-align: right;
    -webkit-align-self: center;
    align-self: center;
    margin-left: 10px;
}
span.paginatorMax {
    cursor: pointer;
    color: #000;
}
.paginatorMax:hover {
    color: #b9bbbe;
}
/* Session date */

#bxcontainer {
	padding-top: 15px;
	padding-bottom: 15px;
	opacity: 1;
	z-index: 1;
	/* position: fixed; */
	top: 0px;
	font-size: 9px;
	text-align: center;
	width: 100%;
	/* background-color: #fff; */
}
#bxcontainer input {
    font-size:9px !important;
}
#bxcontainer #gxsid { visibility: hidden; }
#bxcontainer div {
    display:block;
	text-align: center;
	width: 100%;
	background-color: #fff;
}

div.dashboardSyncBtnContainer {
    height: 40px;
    justify-content: right;
}

div.dashboardSyncBtnContainer .erpButton {
    display:inline-block;
}

div.dashboardSyncBtnContainer .loader {
    display:inline-block;
    width: 40px;
    height: 40px;
    vertical-align: top;
}

div.dashboardSyncBtnContainer img.loadingSpinner {
    height:100%;
}

a.generalGridLink {
    /* border: none; */
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    /* background: #f7f7f7; */
    /* color: #484848 !important; */
    padding: 6px 0px 6px 0px;
    text-decoration: none;
    display: block;
    cursor: pointer;
    /* font-size: 13px; */
    /* border: 1px solid #BBC4CC; */
    vertical-align: top;
    /* border-radius: 2px 0 0 2px; */
    /* margin: 0 5px 5px 0px; */
}
a.generalGridLink:hover {
	/* background: #f1f1f1; */
}
a.finaloopLink {
    border: none;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: #FF9D00;
    color: #fff !important;
    padding: 10px 15px 10px 15px;
    /* text-decoration: none; */
    display: block;
    cursor: pointer;
    /* font-size: 14px; */
    border: 1px solid #BBC4CC;
    /* vertical-align: top; */
    border-radius: 4px;
    /* margin: 0 5px 5px 0px; */
    width: fit-content;
}
a.finaloopLink:hover {
	background: #FFB237;
}

.mt10 {
	margin-top: 10px !important;
}
.ib {
	display: inline-block !important;
}
.ml5 {
	margin-left: 5px !important;
}

.userSettingsPopupWrapper {
	clear: both;
}
.userSettingsPopupWrapper h2 {
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 10px;
	color: #313131;
}
.userSettingsPopupWrapper h3 {
	margin-bottom: 5px;
	margin-top: 5px;
	margin-left: 5px;
	font-size: 1em;
}
.userSettingsPopupWrapper label {
	margin-left: 3px;
}
.userSettingsPopupWrapper input[type="checkbox"] {
	margin-left: 10px;
}

.privacy a {
    font-size: 12px;
    padding: 0px 5px;
}
div.subHeader {
    background: #FF9D00;
    padding: 5px 0px;
}

div.subHeader > label {
    padding: 0px 25px;
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 0.48px;
    color: #fff;
    margin: 0;
}
div.subHeader > div.sub_label {
    display: block;
    color: #fff;
    /* margin: 0.25rem; */
    font-style: italic;
    font-size: 12px;
    padding: 0px 0px 0px 25px;
}
.box-wrapper {
    background: #FFFFFF;
    border: 1px solid #DADEE0;
    padding: 15px;
}
.boxHeader {
    margin-bottom: 10px;
}
div.boxHeader > label {
    /* padding: 0px 25px; */
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 0.48px;
    margin: 0;
}
div.boxHeader > div.sub_label {
    display: block;
    /* margin: 0.25rem; */
    font-style: italic;
    font-size: 12px;
    /* padding: 0px 0px 0px 25px; */
}
div.dashboard_notifications {
    margin: 2rem 0 1rem 0;
    font-size: 12px;
}

table#notification_dashboard_table tr.notification_item td
table#dashboard_user_feed tr.notification_item td,
table#dashboard_user_file_feed tr.notification_item td {
    color: #484848;
}

table#notification_dashboard_table tr.notification_item td a,
table#dashboard_user_feed tr.notification_item td a,
table#dashboard_user_file_feed tr.notification_item td a{
    display: block;
    min-height: 18px;
}

table#notification_dashboard_table td.notification-actions button.notification-action-button, 
table#dashboard_user_feed td.notification-actions button.notification-action-button,
table#dashboard_user_file_feed td.notification-actions button.notification-action-button{
    background: transparent;
    border: 0;
    padding: 0;
    text-decoration: underline;
    cursor: pointer;
}

table#notification_dashboard_table i.notification_icon,
table#dashboard_user_feed td i.notification_icon,
table#dashboard_user_file_feed td i.notification_icon {
    /* margin-right: 0.5rem; */
    font-size: 26px;
}

.kpi_table_wrapper > table {
    border: 2px solid #BBC4CC;
    border-collapse: separate;
    border-spacing: 0;
}

.kpi_table_wrapper > table > thead {
    display: table-header-group!important;
}

.kpi_table_wrapper > table tr {
    display: table-row!important;
}

.kpi_table_wrapper > table > thead > tr > th {
    border-right: 2px solid #e5e5e5;
    border-bottom: 0;
    color: #444444;
}

.kpi_table_wrapper > table > thead > tr > th.thin-border {
    border-right-width: 1px;
}

.kpi_table_wrapper > table > thead > tr > th:last-child {
    border-right: 0;
}

.kpi_table_wrapper table.column_table {
    border-right: 2px solid #e5e5e5;
    box-sizing: border-box;
    border-collapse: separate;
    border-spacing: 0;
}

.kpi_table_wrapper table.column_table.no-border {
    border-right-width: 0px;
}

.kpi_table_wrapper table.column_table.thin-border {
    border-right-width: 1px;
}

.kpi_table_wrapper table.column_table td {
    padding: 0.25rem;
    border: 0;
    display: table-cell!important;
}

.kpi_table_wrapper td.column_cell {
    padding: 0;
    border-bottom: 0;
    display: table-cell!important;
}

.kpi_filter_wrapper {
    margin-bottom: 1rem;
}

.kpi_filter_wrapper > .filter_block {
    display: inline-block;
    margin-right: 1rem;
    vertical-align: bottom;
}
.kpi_filter_wrapper > .filter_block > label {
    display: block;
}

.kpi_filter_wrapper > .filter_block > input[type="text"] {
    height: 2rem;
}

.kpi_filter_wrapper > .filter_block > button.slim_button {
    height: 2rem;
    box-sizing: border-box;
    background: #484848;
    border: none;
    border-radius: 2px;
    padding: 0 1rem;
    color: white;
    cursor: pointer;
}

.kpi_filter_wrapper > .filter_block > div.loading_spinner {
    height: 2rem;
    width: 2rem;
    background-image: url(/assets/styles/user/gifloader_4_orange.gif);
    background-repeat: no-repeat;
    background-size: contain;
}

.infoTextElem {
    background: url(/assets/styles/user/grid/layout/icons/info.png) no-repeat left 8px;
    width: 2rem;
    height: 2rem;
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 5px;
}

.modal_info_text textarea {
    width: 100%;
    height: 100%;
    min-height: 400px;
}

.modal_info_text .row_item_button {
    display: block;
    margin-left: auto;
    font-size: 0.9em;
    height: 33px;
    box-sizing: border-box;
    background: #484848;
    border: none;
    border-radius: 2px;
    padding: 0 1rem;
    color: white;
    cursor: pointer;
}

button.info-button {
    background: transparent;
    border: 0;
    height: 14px;
    width: 18px;
    position: relative;
    margin-right: 6px;
    vertical-align: top;
}

button.info-button i {
    font-size: 16px;
    color: #444444;
    position: absolute;
    right: 0;
    top: 0;
}

.info_text_flex .infoTextCheckboxBlock {
    display: inline-block;
}

ul.modal_info_company_admins {
    margin-top: 1rem;
}

ul.modal_info_company_admins > li.list_title {
    font-weight: bold;
}

button.row_item_button {
    height: 33px;
    box-sizing: border-box;
    background: #484848;
    border: none;
    border-radius: 2px;
    padding: 0 1rem;
    color: white;
    cursor: pointer;
    font-size: 13px;
}

button.no_label {
    margin-top: 24px;
    width: 100%;
}
[data-object-tbody] td.subheader {
    background: #f7f7f7;
}

.row .itemSet .item p.formItemText {
    height: 40px;
    line-height: 40px;
    text-indent: 4px;
    white-space: nowrap;
    overflow-x: hidden;
    text-overflow: ellipsis;
    margin: 0;
}

.dashboard_notifications .loop-tabs label, .filemanContainer .loop-tabs label, .messagehubContainer .loop-tabs label, .invoice-files .loop-tabs label {
    display: inline-block;
    margin: 0 0 -1px;
    padding: 15px 25px;
    font-weight: 800;
    font-size: 14px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #7B8289;
    border: 0px solid transparent;
    position: relative;
}

.dashboard_notifications .loop-tabs {
    margin-bottom: 20px;
    font-size: 12px;
}

/** Old Calendar modal styles **/

.tingle-modal.calendar_modal {
  overflow-y: auto;
}

.calendar_modal.user_calendar_modal .tingle-modal-box {
  width: 75vw;
  max-height: 90vh;
  overflow-y: auto;
  margin: auto;
}

.calendar_modal .tingle-modal-box__content {
  padding: 2rem;
}

.calendar_modal .calendar-modal-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.user_calendar_modal .calendarControls {
  margin-right: 2rem;
  width: 13rem;
  font-family: 'Montserrat', sans-serif;
}

.calendar_modal .calendar {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.user_calendar_modal .calendarControls input[type="radio"] {
  margin-right: 0.5rem;
}

.user_calendar_modal .calendarControls .calendar_control_item label {
  vertical-align: middle;
  font-size: 13px;
}

.user_calendar_modal .calendar-control-filters {
  display: block;
  height: 10rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #444444;
}

.calendar-control-filters ul.users_list > li {
  /* margin: 0.25rem 0; */
}

.calendar-control-filters button.calendar-filterbtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  background: transparent;
  border: 0;
  text-align: left;
  font-size: 12px;
  height: 1.2rem;
  padding: 0;
}

button.calendar-filterbtn .calendar-filterbtn-color {
  width: 1rem;
  height: 1rem;
  margin: 0.1rem 0;
}

button.calendar-filterbtn .calendar-filterbtn-text {
  /* -webkit-flex: 1; */
  /* -ms-flex: 1; */
  /* flex: 1; */
  padding: 0 0.5rem;
  line-height: 1.2rem;
  white-space: nowrap;
  overflow-x: hidden;
  text-overflow: ellipsis;
}

button.calendar-filterbtn.selected .calendar-filterbtn-text {
  /* text-decoration: underline; */
  font-style: italic;
  font-weight: 600;
}

button.calendar-filterbtn .calendar-filterbtn-text.bold {
  font-weight: bold;
}

button.calendar-filterbtn .calendar-filterbtn-check-mark {
  width: 1.2rem;
  display: none;
}
button.calendar-filterbtn.selected .calendar-filterbtn-check-mark {
  display: block;
}

#UserCalendar button.fc-button {
  height: 2rem;
  box-sizing: border-box;
  background: #484848;
  border: none;
  border-radius: 2px;
  padding: 0 1rem;
  color: white;
  cursor: pointer;
  font-size: 13px;
}

#UserCalendar button.fc-button:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
#UserCalendar button.fc-button:disabled {
  opacity: 1;
  background: #595959;
}

#UserCalendar button.fc-button.fc-button-active {
  background: #595959;
}

#UserCalendar table thead {
  display: table-header-group;
}

#UserCalendar table thead tr {
  display: table-row;
  margin-bottom: initial;
}

#UserCalendar table thead tr td {
  display: table-cell;
}

#UserCalendar table tbody tr {
  margin-bottom: initial;
  display: table-row;
  border-bottom: 1px solid #ddd;
}

#UserCalendar table tbody tr td {
  display: table-cell;
}

/** new Calendar styles **/

div#vcal {
  margin-top: 25px;
}
.calendarControls {
  margin-bottom: 25px;
}
.calendar-control-filters {
    margin-top: 15px;
}
.calendar-control-filters label {
	font-weight: 800;
	display: block;
	margin-bottom: 5px;
	font-size: 13px;
	text-decoration: underline;
	text-transform: uppercase;
}
ul.users_list, ul.statuses_list, ul.priorities_list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: auto;
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
[data-filter-wrapper="CompanyUsers"] button[data-filter-value="0"] .calendar-filterbtn-color {
	display:none;
}
[data-filter-wrapper="CompanyUsers"] button[data-filter-value="0"] .calendar-filterbtn-text,
[data-filter-wrapper="Statuses"] button.calendar-filterbtn .calendar-filterbtn-text,
[data-filter-wrapper="Priorities"] button.calendar-filterbtn .calendar-filterbtn-text{
	padding: 0 0.5rem 0 0;
}
.filterResult {
  padding-top: 5px;
}
.rowhide {
  display: none;
}
.rowrowhide {
  display: none;
}
.contentButtonDark {
  border: 1px solid #BBC4CC;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #6B747E;
  color: #FFF !important;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
  font-size: 15px;
  text-transform: uppercase;
  padding: 9px 20px 9px 20px;
  border-radius: 7px;
  font-weight: 800;
  position: relative;
}
.contentButtonSmallDark {
  color: 1px solid #BBC4CC;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #6B747E;
  color: #FFF !important;
  text-decoration: none;
  display: inline-block;
  cursor: pointer;
  font-size: 12px;
  text-transform: uppercase;
  padding: 8px 5px 8px 5px !important;
  border-radius: 7px;
  font-weight: 800;
  position: relative;
}

.contentButtonDark:hover, .contentButtonSmallDark:hover {
  color: 1px solid #BBC4CC;
  background: #7B8289;
}

@media (min-width: 768px) and (max-width: 991px) {
	ul.users_list {
	    display: grid;
	    grid-template-columns: repeat(2, 1fr);
	    grid-template-rows: auto;
	    grid-column-gap: 5px;
	    grid-row-gap: 5px;
	}
	.calendarControls .contentButton {
	    display: block;
		text-align: center;
		margin-bottom: 5px;
	}
	.calendarControls .contentButtonDark {
	    display: block;
		text-align: center;
		margin-bottom: 5px;
	}
}

@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
	ul.users_list {
	    display: grid;
	    grid-template-columns: repeat(1, 1fr);
	    grid-template-rows: auto;
	    grid-column-gap: 5px;
	    grid-row-gap: 5px;
	}
	.calendarControls .contentButton {
	    display: block;
		text-align: center;
		margin-bottom: 5px;
	}
	.calendarControls .contentButtonDark {
	    display: block;
		text-align: center;
		margin-bottom: 5px;
	}
}

/** Filemanager and messagehub specific customs **/

header.messageHubHeader, header.filemanHeader {
    height: auto;
    position: fixed;
    background-color: #fff;
    box-shadow: 0px 3px 6px #0000001a;
    padding: 0px 16px;
    z-index: 100;
    border: none;
    right: 0;
    left: 0;
}

header.messageHubHeader .header-content h1 ,
header.filemanHeader .header-content h1 {
    margin: 0;
    padding: 14px 0px;
    font-size: 22px;
    text-transform: uppercase;
}

header.messageHubHeader .header-content .search ,
header.filemanHeader .header-content .search {
    right: 0px;
    position: absolute;
    top: 0;
}

header.messageHubHeader .search button.side-nav-button.main-search ,
header.filemanHeader .search button.side-nav-button.main-search {
    margin: 5px 0 5px 0;
    font-size: 20px;
    padding: 8px 10px;
    border: none;
    background-color: #fff;
    vertical-align: middle;
    height: 40px;
}

.messagehubContainer, .filemanContainer {
    padding-top: 55px;
}

.messagehubContainer .loop-tabs,
.filemanContainer .loop-tabs {
    margin-bottom: 20px;
    font-size: 12px;
    position: relative;
    margin: 0 auto;
    max-width: 80%;
    padding-top: 35px;
}

.composeContainer .loop-tabs,
.invoice-files .loop-tabs {
	max-width: 100%;
	padding-top: 0px;
}

table#fileman, table#messagehub, table#sentmessages, div#composehub {
    margin-top: 25px;
}

#messagehub input[type="checkbox"],
#sentmessages input[type="checkbox"],
#fileman input[type="checkbox"] {
    vertical-align: middle;
}

.shareButton {
    /* margin-top: 5px; */
}

#fileman tfoot .shareButton i, .composeContainer .contentButton i {
    padding-right: 10px;
}
[data-filemanager-list] .contentButton i, [data-filemanager-selected-list] .contentButton i {
  padding-right: 0px;
}
#sentmessages .contentButton i,
#messagehub .contentButton i {
  padding-right: 0px;
}

#fileman th, #messagehub th, #sentmessages th, #selectedfiles th {
    text-transform: uppercase;
}

table#fileman .controls a {
  width: 55px;
}

table#fileman .controls a:nth-child(-n+3) {
  margin-bottom: 5px;
}

.messagehubContainer h1,
.filemanContainer h1 {
    margin: 0;
    font-size: 26px;
    text-transform: uppercase;
    text-align: left;
    /* float: left; */
    /* flex: 3; */
    display: inline-grid;
}

.messagehubContainer h2,
.filemanContainer h2 {
    margin: 0;
    font-size: 16px;
    text-transform: uppercase;
    padding-top: 5px;
    text-align: right;
    float: right;
    /* display: inline-grid; */
    /* flex: 3; */
}

.messagehubContainer span,
.filemanContainer span,
.invoice-files span{
    text-transform: uppercase;
    padding-right: 10px;
    line-height: 16px;
    vertical-align: bottom;
}

.messagehubContainer span.redNum {
    text-transform: uppercase;
    padding-right: 10px;
    line-height: 16px;
    color: red;
    vertical-align: baseline;
}

.messagehubContainer p ,
.filemanContainer p {
    margin-bottom: 10px;
    padding: 10px 0;
    font-style: italic;
}

.messagehubContainer hr ,
.filemanContainer hr {
	margin: 0;
	border-top: 1px solid #FF9D00;
}

.messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] label {
    padding: 0px 0px 5px 0px;
}

.messagehubContainer .loop-tabs .composeContainer [data-messagehub-subject] label,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-body] label,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-files-section] label,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-reply-to] label,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-objectlinks] label {
    padding: 20px 25px 5px 0px;
}

.messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] label:hover,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-subject] label:hover,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-body] label:hover,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-files-section] label:hover,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-reply-to] label:hover,
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-objectlinks] label:hover,
.invoice-files .loop-tabs [data-messagehub-files-section] label:hover {
    color: #7B8289;
    cursor: default;
}

.mooeditable,.mooeditable-container,.mooeditable-iframe{
  min-height: 300px!important;
  min-width: 100%!important;
}

.composeContainer [data-messagehub-linkcontrols] {
    display: flex;
}

.composeContainer [data-messagehub-toggle] {
    padding: 10px 10px 10px 0px;
}

.composeContainer [data-messagehub-toggle] a {
}

.contactContainer strong {
	text-transform: uppercase;
	color: #7B8289;
	font-size: 14px;
}

.contactContainer ul {
	margin-top: 10px;
}

.contactContainer ul li, .contactWrapper, .addContact {
	margin-bottom: 7px;
	background: #FF9D00;
	border-radius: 4px;
}

.contactContainer ul li:hover, .contactWrapper:hover, .addContact:hover {
	background:#FFB237;
}

.contactContainer ul li:last-child {
	margin-bottom: 0px;
}

.contactContainer ul li a, .contactWrapper a, .addContact a {
	text-transform: uppercase;
	color: #FFF;
	padding: 5px 10px;
	display: block;
  font-size: 12px;
}

.contactContainer ul li a i, .contactWrapper a i, .addContact a i {
	padding-right: 5px;
	font-size: 16px;
	vertical-align: top;
}

.tip-title {
    font-size: 12px;
    font-style: italic;
}
.tip-title strong {
    font-size: 12px;
    font-style: normal;
    text-transform: uppercase;
}

.tip-text {
    font-size: 12px;
}

.contactWrapper {
    display: grid;
    /* grid-template-columns: repeat(2, 1fr); */
    /* grid-template-rows: 27px; */
    /* grid-column-gap: 0px; */
    /* grid-row-gap: 0px; */
}

.contactContainer ul li a[data-messagehub-contact], .contactWrapper a[data-messagehub-contact] {
	grid-area: 1 / 1 / 2 / 2;
}

.contactContainer ul li a[data-messagehub-contact-edit], .contactWrapper a[data-messagehub-contact-edit] {
	grid-area: 1 / 2 / 2 / 3;
	justify-self: end;
}

.contactWrapper div {
    grid-area: 2 / 1 / 3 / 3;
}

.contactsABC {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  font-weight: 600;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: solid 1px #FF9D00;;
}
.contactsABC .button {
  border-radius: 4px;
  background: #FF9D00;
}
.contactsABC .button:hover {
  border-radius: 4px;
  background: #FFB237;
}

.contactEditorForm {
    padding: 10px;
    /* display: grid; */
    /* grid-row: 1; */
}

.contactEditorRow {
    margin-bottom: 10px;
}

.messagehubContainer .loop-tabs .contactEditorForm label {
    padding: 10px 5px;
    min-width: 160px;
    vertical-align: top;
}

.messagehubContainer .loop-tabs .contactEditorForm label:hover {
    color: #7B8289;
}

.messagehubContainer .loop-tabs .contactEditorForm input, .messagehubContainer .loop-tabs .contactEditorForm textarea {
    width: 100%;
}

.messagehubContainer .loop-tabs .contactEditorForm input[type="checkbox"] {
    width: 5%;
    margin-left: -3px;
    margin-top: 9px;
    height: 20px;
    border: 1px solid #BBC4CC;
}

.messagehubContainer .loop-tabs .contactEditorForm textarea {
    position: relative;
    height: 80px;
    padding: 5px 10px;
    margin-right: 10px;
    position: relative;
    background-color: #fff;
    border: 1px solid #BBC4CC;
    font-size: 14px;
    line-height: normal;
    color: #58616A;
    border-radius: 4px;
    resize: none;
    box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
    -webkit-transition: .1s linear border;
    -moz-transition: .1s linear border;
    -ms-transition: .1s linear border;
    -o-transition: .1s linear border;
    transition: .1s linear border;
    outline: none;
}

.contactEditorForm button.contentButton{
    width: 100%;
    margin-top: 15px;
}

#formeri {
	padding-top: 10px;
}

#formeri span,
div[data-messagehub-objectlink-values] span  {
	padding-right: 0px;
	margin: 5px;
	display: inline-block;
	background: #7B8289;
	padding: 10px;
	border-radius: 4px;
}

#formeri span:first-child,
div[data-messagehub-objectlink-values] span:first-child {
	margin-left: 0px;
}

#formeri span a,
div[data-messagehub-objectlink-values] span a {
	font-weight: 800;
	color: #fff;
	cursor: default;
}

#formeri span a i,
div[data-messagehub-objectlink-values] span a i {
	color: #ffdcdc;
	padding-left: 10px;
	cursor: pointer;
	font-size: 16px;
	height: 100%;
	vertical-align: top;
}

.uploaderContainer {
    margin-top: 25px;
}

.uploaderContainer select {
	width: 200px;
	height: 40px;
	padding: 5px;
	border-radius: 4px;
	border: 1px solid #BBC4CC;
	font-size: 14px;
	line-height: normal;
	color: #58616A;
	resize: none;
	border-radius: 4px;
	box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
	-webkit-transition: .1s linear border;
	-moz-transition: .1s linear border;
	-ms-transition: .1s linear border;
	-o-transition: .1s linear border;
	transition: .1s linear border;
	outline: none;
}

.uploaderSuccessContainer .success {
  padding-bottom: 5px;
  font-style: italic;
}
.uploaderSuccessContainer .success:last-child {
  padding-bottom: 25px;
}
.uploaderErrorContainer .error {
  padding-bottom: 5px;
  font-style: italic;
}
.uploaderErrorContainer .error:last-child {
  padding-bottom: 25px;
}

.helpContainer, .metaContainer {
    margin-top: 25px;
}

.filemanContainer .loop-tabs .tableContainer label, .filemanContainer .uploaderContainer label,
.filemanContainer .helpContainer label, .filemanContainer .metaContainer label {
	padding: 10px 0;
	text-align: left;
}

.filemanContainer .loop-tabs .uploaderContainer label:hover, .filemanContainer .loop-tabs .helpContainer label:hover,
.filemanContainer .loop-tabs .tableContainer label:hover, .filemanContainer .loop-tabs .metaContainer label:hover,
.filemanContainer .loop-tabs .metaContainer .card strong {
	color: #7B8289;
	cursor: default;
}

.filemanContainer .loop-tabs .tableContainer input[type="search"], .filemanContainer .uploaderContainer input[type="search"], .filemanContainer .metaContainer input[type="search"], .messagehubContainer .composeContainer input[type="text"], .messagehubContainer .composeContainer input[type="search"], .contactEditorRow input[type="text"], .invoice-files input[type="text"], .invoice-files input[type="search"]{
	height: 40px;
	width: 200px;
	padding: 5px 10px;
	margin-right: 10px;
	position: relative;
	background-color: #fff;
	border: 1px solid #BBC4CC;
	font-size: 14px;
	line-height: normal;
	color: #58616A;
	resize: none;
	border-radius: 4px;
	box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
	-webkit-transition: .1s linear border;
	-moz-transition: .1s linear border;
	-ms-transition: .1s linear border;
	-o-transition: .1s linear border;
	transition: .1s linear border;
	outline: none;
}
.searchContainer input[type="search"] {
	height: 40px;
	width: 100%;
	padding: 5px 10px;
	margin-right: 0px;
	position: relative;
	background-color: #fff;
	border: 1px solid #BBC4CC;
	font-size: 14px;
	line-height: normal;
	color: #58616A;
	resize: none;
	border-radius: 4px;
	box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
	-webkit-transition: .1s linear border;
	-moz-transition: .1s linear border;
	-ms-transition: .1s linear border;
	-o-transition: .1s linear border;
	transition: .1s linear border;
	outline: none;
}

.filemanContainer .loop-tabs .tableContainer  input[type="search"]:focus,
.messagehubContainer .loop-tabs .composeContainer  input[type="text"]:focus,
.messagehubContainer .composeContainer input[type="search"]:focus,
.searchContainer input[type="search"]:focus {
    border-color: #FF9D00;
    box-shadow: 0 0 5px #ff9d00, inset 0 0 2px rgb(0 0 0 / 12%);
}
.manualLink {
    position: absolute;
    right: 0px;
    top: 6px;
    font-size: 30px;
}
.search {
	display: none;
}
.search input[type="search"] {
	height: 35px;
	width: 200px;
	padding: 5px 10px;
	background-color: #fff;
	border: 1px solid #BBC4CC;
	font-size: 14px;
	line-height: normal;
	color: #58616A;
	resize: none;
	border-radius: 4px;
	box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
	-webkit-transition: .1s linear border;
	-moz-transition: .1s linear border;
	-ms-transition: .1s linear border;
	-o-transition: .1s linear border;
	transition: .1s linear border;
	outline: none;
}

.search input[type="search"]:focus {
    border-color: #FF9D00;
    box-shadow: 0 0 5px #ff9d00, inset 0 0 2px rgb(0 0 0 / 12%);
}

#addLinksContainer {
    display: flex;
}

#addLinksContainer select {
	height: 40px;
	width: 200px;
	padding: 5px 10px;
	background-color: #fff;
	border: 1px solid #BBC4CC;
	font-size: 14px;
	line-height: normal;
	color: #58616A;
	resize: none;
	border-radius: 4px;
	box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
	-webkit-transition: .1s linear border;
	-moz-transition: .1s linear border;
	-ms-transition: .1s linear border;
	-o-transition: .1s linear border;
	transition: .1s linear border;
	outline: none;
	margin-right: 10px;
}

#addLinksContainer select:focus {
    border-color: #FF9D00;
    box-shadow: 0 0 5px #ff9d00, inset 0 0 2px rgb(0 0 0 / 12%);
}

#share p {
    margin: 0;
}

#share .contentButton.shared {
    margin-bottom: 5px;
}

#drawcontainer {
    background: #fff;
    z-index: 100;
}

#drawcontainer ul {
    margin-left: 0px !important;
    /* z-index: 100; */
    font-size: 13px;
    border-left: solid 1px #BBC4CC;
    border-bottom: solid 1px #BBC4CC;
    border-right: solid 1px #BBC4CC;
    border-top: solid 1px #BBC4CC;
}

#drawcontainer ul li {
    background: none;
    border: 0;
    color: #484848;
    height: auto !important;
    line-height: 20px !important;
    width: 100% !important;
    padding: 10px 5px !important;
    border-radius: 4px;
    box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
}

#drawcontainer ul li:hover,
#drawcontainer ul li:focus {
    cursor: pointer;
    background-color: silver !important;
    color: #fefefe !important;
    border-radius: 0px;
    border-color: none;
    box-shadow: 0 0 0px #8ccfff, inset 0 0 0px rgba(0, 0, 0, 0.12);
}

/** end **/

.dashboard_notifications .loop-tabs label.active:before,
.messagehubContainer .loop-tabs label.active:before,
.filemanContainer .loop-tabs label.active:before,
.composeContainer .loop-tabs label.active:before,
.invoice-files .loop-tabs label.active:before{
    position:absolute;
    left: -1px;
    top: -1px;
    content:'';
    border-top: 51px solid #FF9D00;
    border-right: 51px solid transparent;
}

.dashboard_notifications .loop-tabs label.active:after,
.messagehubContainer .loop-tabs label.active:after,
.filemanContainer .loop-tabs label.active:after,
.composeContainer .loop-tabs label.active:after,
.invoice-files .loop-tabs label.active:after{
    position:absolute;
    left: -2px;
    top: -2px;
    content:'';
    border-top: 51px solid white;
    border-right: 51px solid transparent;
}

.dashboard_notifications .loop-tabs label.active,
.messagehubContainer .loop-tabs label.active,
.filemanContainer .loop-tabs label.active,
.composeContainer .loop-tabs label.active,
.invoice-files .loop-tabs label.active{
    /* color: #00c0f3; */
    /* border: 1px solid; */
    border-top: 1px solid #FF9D00;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #FF9D00;
    border-top-right-radius: 12px;
    padding: 15px 25px 15px 50px;
}

.dashboard_notifications .loop-tabs label:hover,
.messagehubContainer .loop-tabs label:hover,
.filemanContainer .loop-tabs label:hover,
.composeContainer .loop-tabs label:hover,
.invoice-files .loop-tabs label:hover{
    color: #979DA3;
}

.dashboard_notifications .loop-tabs section,
.messagehubContainer .loop-tabs section,
.filemanContainer .loop-tabs section,
.composeContainer .loop-tabs section,
.invoice-files .loop-tabs section{
    padding: 10px 0 0;
    border-top: 1px solid #FF9D00;
    display: none;
}

.dashboard_notifications .loop-tabs section.active,
.messagehubContainer .loop-tabs section.active,
.filemanContainer .loop-tabs section.active,
.composeContainer .loop-tabs section.active,
.invoice-files .loop-tabs section.active{
    display: block;
}
div#composehub {
    display: grid;
    grid-template-columns: repeat(1, 1fr auto);
    gap: 20px;
    grid-auto-rows: minmax(auto, auto);
}
.left {
    grid-column: 1;
}
.right {
    grid-column: 2;
}
.messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] .toField {
    display: block;
}

.messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] input {
    width: 100%;
}

.messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] a.contactList {
    display: none;
}
.staticBottom {
	padding: 20px 0px;
	border-top: 2px solid #FF9D00;
	background: #fff;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	-ms-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: space-between;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-align-content: stretch;
	-ms-flex-line-pack: stretch;
	align-content: stretch;
	-webkit-align-items: flex-start;
	-ms-flex-align: start;
	align-items: flex-start;
}
#cancelMessage {
	margin-left: 20px;
}
#sendMessage {
	margin-right: 20px;
}
.messagehubContainer .paginator {
  font-weight: normal;
  text-align: center;
  font-style: normal;
  font-size: 14px;
}
.messagehubContainer .paginator a {
  font-size: 14px;
  font-weight: normal;
  padding: 0px 5px;
  vertical-align: middle;
}
.messagehubContainer .paginator .paginatorPageCount,
.messagehubContainer .paginator .paginatorNumPages,
.messagehubContainer .paginator .paginatorPages {
  padding-right: 30px;
  padding-top: 15px;display: inline-block;
}
.messagehubContainer .paginator .paginatorPageCount strong {
  vertical-align: middle;
  padding-right: 5px;
  text-transform: uppercase;
}
.messagehubContainer .paginator .paginatorNumPages strong {
  padding-right: 5px;
  text-transform: uppercase;
}
.messagehubContainer .paginator .paginatorPages strong {
  padding: 0px 5px;
}
.messagehubContainer .paginator span {
  font-weight: normal;
  padding: 0px;
  font-size: 14px;
  vertical-align: middle;
}
.messagehubContainer .paginator .paginatorNumPages select {
  padding: 8px;
  text-transform: uppercase;
}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
	header.messageHubHeader ,
    header.filemanHeader {
        position: relative;
        margin-bottom: 0;
    }
    header.messageHubHeader .header-content h1 ,
    header.filemanHeader .header-content h1 {
        margin: 0;
        padding: 14px 0px 6px 0px;
        font-size: 20px;
        text-transform: uppercase;
    }
    header .header-content .header-logo {
        right: 45px;
        left: auto;
    }
    header.messageHubHeader .header-content .search ,
    header.filemanHeader .header-content .search {
        /* right: 0; */
        position: relative;
        /* top: 0; */
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
    .search input[type="search"] {
        height: 35px;
        width: 80%;
        padding: 5px 10px;
        background-color: #fff;
        border: 1px solid #BBC4CC;
        font-size: 14px;
        line-height: normal;
        color: #58616A;
        resize: none;
        border-radius: 4px;
        box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
        -webkit-transition: .1s linear border;
        -moz-transition: .1s linear border;
        -ms-transition: .1s linear border;
        -o-transition: .1s linear border;
        transition: .1s linear border;
        outline: none;
    }
    header.messageHubHeader .search button.side-nav-button.main-search ,
    header.filemanHeader .search button.side-nav-button.main-search {
        margin: 5px 0 5px 0;
        font-size: 20px;
        padding: 8px 10px;
        border: none;
        background-color: #fff;
        vertical-align: middle;
        height: 40px;
    }
    .messagehubContainer, .filemanContainer {
        padding-top: 0px;
    }
    .messagehubContainer .loop-tabs,
    .filemanContainer .loop-tabs {
        margin-bottom: 20px;
        font-size: 12px;
        position: relative;
        margin: 0 auto;
        max-width: 90%;
        padding-top: 35px;
    }
    .filemanContainer .loop-tabs label,
    .messagehubContainer .loop-tabs label {
        display: block;
        margin: 0 0 -1px;
        padding: 15px 25px;
        font-weight: 800;
        font-size: 14px;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: #7B8289;
        border: 0px solid transparent;
        position: relative;
        text-align: center;
    }
    .filemanContainer .uploaderContainer label,
    .filemanContainer .tableContainer label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-subject] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-body] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-files-section] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-reply-to] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-objectlinks] label {
        padding: 10px 0;
        text-align: left;
        display: inline-block;
    }
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] label {
        padding: 0px 0px 5px 0px;
    }
    .filemanContainer .loop-tabs .uploaderContainer label:hover,
    .filemanContainer .loop-tabs .tableContainer label:hover,
	.filemanContainer .loop-tabs .helpContainer label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-subject] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-body] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-files-section] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-reply-to] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-objectlinks] label:hover {
        background: none;
    }
    .composeContainer [data-messagehub-linkcontrols] {
        display: block;
 }
	.composeContainer [data-messagehub-toggle] {
		padding: 10px 0px 0px 0px;
		/* flex: 1; */
	}
	.composeContainer [data-messagehub-toggle]:last-child {
		padding: 10px 0px 10px 0px;
	}
	.composeContainer [data-messagehub-toggle] a {
		display: block;
		text-align: center;
	}
	#addLinksContainer {
		display: block;
	}

	#addLinksContainer select {
		height: 40px;
		width: 100%;
		padding: 5px 10px;
		background-color: #fff;
		border: 1px solid #BBC4CC;
		font-size: 14px;
		line-height: normal;
		color: #58616A;
		resize: none;
		border-radius: 4px;
		box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
		-webkit-transition: .1s linear border;
		-moz-transition: .1s linear border;
		-ms-transition: .1s linear border;
		-o-transition: .1s linear border;
		transition: .1s linear border;
		outline: none;
		margin-right: 0px;
		margin-bottom: 10px;
	}

	#addLinksContainer input[type="search"] {
		height: 40px;
		width: 100%;
		padding: 5px 10px;
		background-color: #fff;
		border: 1px solid #BBC4CC;
		font-size: 14px;
		line-height: normal;
		color: #58616A;
		resize: none;
		border-radius: 4px;
		box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
		-webkit-transition: .1s linear border;
		-moz-transition: .1s linear border;
		-ms-transition: .1s linear border;
		-o-transition: .1s linear border;
		transition: .1s linear border;
		outline: none;
		margin-right: 0px;
		margin-bottom: 10px;
	}

	#addLinksContainer select:focus,
	#addLinksContainer input[type="search"]:focus {
		border-color: #FF9D00;
		box-shadow: 0 0 5px #ff9d00, inset 0 0 2px rgb(0 0 0 / 12%);
	}
	#addLinksContainer a {
		width: 100%;
		text-align: center;
	}
	.staticBottom {
		padding: 20px 0px;
		border-top: 2px solid #FF9D00;
		background: #fff;
		display: block;
	}
	#cancelMessage {
		margin-bottom: 15px;
		margin-left: 0px;
		width: 100%;
	}
	#sendMessage {
        margin-right: 0px;
		width: 100%;
	}
    .messagehubContainer .loop-tabs label.active:before,
    .filemanContainer .loop-tabs label.active:before,
    .composeContainer .loop-tabs label.active:before {
        position:absolute;
        left: -1px;
        top: -1px;
        content:'';
        border-top: 51px solid #FF9D00;
        border-right: 51px solid transparent;
        display: none;
    }

    .messagehubContainer .loop-tabs label.active:after,
    .filemanContainer .loop-tabs label.active:after,
    .composeContainer .loop-tabs label.active:after {
        position:absolute;
        left: -2px;
        top: -2px;
        content:'';
        border-top: 51px solid white;
        border-right: 51px solid transparent;
        display: none;
    }
    .messagehubContainer .loop-tabs label.active,
    .filemanContainer .loop-tabs label.active,
    .composeContainer .loop-tabs label.active {
        color: #fff;
        /* border: 1px solid; */
        border-top: 0px solid #FF9D00;
        border-bottom: 0px solid #fff;
        border-right: 0px solid #FF9D00;
        border-top-right-radius: 0px;
        padding: 15px 25px 15px 25px;
        background: #FF9D00;
    }
    .messagehubContainer .loop-tabs label:hover,
    .filemanContainer .loop-tabs label:hover,
    .composeContainer .loop-tabs label:hover {
        color: #fff;
        background:#FFB237;
    }
    .messagehubContainer h1 ,
    .filemanContainer h1 {
        margin: 0;
        font-size: 22px;
        text-transform: uppercase;
        text-align: left;
        float: none;
    }

    .messagehubContainer h2 ,
    .filemanContainer h2 {
        margin: 0;
        font-size: 14px;
        text-transform: uppercase;
        padding-top: 5px;
        text-align: left;
        float: none;
    }
    table#fileman a.contentButton,
    table#messagehub a.contentButton,
    table#sentmessages a.contentButton{
        margin-bottom: 5px;
        padding: 9px 15px;
    }
    table#fileman a.contentButton:last-child,
    table#messagehub a.contentButton:last-child,
    table#sentmessages a.contentButton:last-child {
        margin-bottom: 0px;
    }
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] .toField {
        display: flex;
    }

    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] input {
        flex: auto;
    }

    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] a.contactList {
        font-size: 20px;
        vertical-align: bottom;
        padding: 6px 14px;
        background: orange;
        border-radius: 4px;
        border: none;
        color: #fff;
        font-weight: 400;
        display: inline-block;
    }
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] a.contactList:hover {
        background:#FFB237;
    }
    div#composehub {
        display: block;
        position: relative;
    }
    .left {

    }
    .right.expandedContacts {
        width: auto;
        overflow: auto;
        position: absolute;
        top: 70px;
        right: 0;
        background: #fff;
        padding: 20px;
        box-shadow: 0px 3px 6px #0000001A;
    }
    .right.collapsedContacts {
        display: none;
    }
    .contactWrapper {
		display: block;
	}
	.messagehubContainer .loop-tabs .contactEditorForm label {
		padding: 10px 5px;
		min-width: 160px;
		vertical-align: top;
		text-align: left;
		display: inline-block;
	}
	.messagehubContainer .loop-tabs .contactEditorForm label:hover {
		color: #7B8289;
		background: transparent;
		cursor: default;
	}
	.messagehubContainer .loop-tabs .contactEditorForm input, .messagehubContainer .loop-tabs .contactEditorForm textarea {
		width: 100%;
	}
	.messagehubContainer .loop-tabs .contactEditorForm input[type="checkbox"] {
		width: 5%;
		margin-left: -3px;
		margin-top: 9px;
		height: 20px;
		border: 1px solid #BBC4CC;
	}
  .messagehubContainer .paginator {
		font-weight: normal;
		text-align: center;
		font-style: normal;
		font-size: 14px;
	  margin: 15px 0px;
  }
	.messagehubContainer .paginator a {
		font-size: 14px;
		font-weight: normal;
		padding: 0px 5px;
		vertical-align: middle;
	}
	.messagehubContainer .paginator .paginatorPageCount,
	.messagehubContainer .paginator .paginatorNumPages,
	.messagehubContainer .paginator .paginatorPages {
		padding: 2px 0px;
		display: block;
		min-height: 30px;
	}
	.messagehubContainer .paginator .paginatorPageCount strong {
		vertical-align: middle;
		padding-right: 5px;
		text-transform: uppercase;
	}
	.messagehubContainer .paginator .paginatorNumPages strong {
		padding-right: 5px;
		text-transform: uppercase;
	}
	.messagehubContainer .paginator .paginatorPages strong {
		padding: 0px 5px;
	}
	.messagehubContainer .paginator span {
		font-weight: normal;
		padding: 0px;
		font-size: 14px;
		vertical-align: middle;
	}
	.messagehubContainer .paginator .paginatorNumPages select {
		padding: 8px;
		text-transform: uppercase;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	header.messageHubHeader ,
    header.filemanHeader {
        position: relative;
        margin-bottom: 0;
    }
    header.messageHubHeader .header-content h1 ,
    header.filemanHeader .header-content h1 {
        margin: 0;
        padding: 14px 0px 6px 0px;
        font-size: 20px;
        text-transform: uppercase;
    }
    header .header-content .header-logo {
        right: 45px;
        left: auto;
    }
    header.messageHubHeader .header-content .search ,
    header.filemanHeader .header-content .search {
        /* right: 0; */
        position: relative;
        /* top: 0; */
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
    .search input[type="search"] {
        height: 35px;
        width: 85%;
        padding: 5px 10px;
        background-color: #fff;
        border: 1px solid #BBC4CC;
        font-size: 14px;
        line-height: normal;
        color: #58616A;
        resize: none;
        border-radius: 4px;
        box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
        -webkit-transition: .1s linear border;
        -moz-transition: .1s linear border;
        -ms-transition: .1s linear border;
        -o-transition: .1s linear border;
        transition: .1s linear border;
        outline: none;
    }
    header.messageHubHeader .search button.side-nav-button.main-search ,
    header.filemanHeader .search button.side-nav-button.main-search {
        margin: 5px 0 5px 0;
        font-size: 20px;
        padding: 8px 10px;
        border: none;
        background-color: #fff;
        vertical-align: middle;
        height: 40px;
    }
    .messagehubContainer, .filemanContainer {
        padding-top: 0px;
    }
    .messagehubContainer .loop-tabs,
    .filemanContainer .loop-tabs {
        margin-bottom: 20px;
        font-size: 12px;
        position: relative;
        margin: 0 auto;
        max-width: 90%;
        padding-top: 35px;
    }
    .filemanContainer .loop-tabs label,
    .messagehubContainer .loop-tabs label {
        display: block;
        margin: 0 0 -1px;
        padding: 15px 25px;
        font-weight: 800;
        font-size: 14px;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: #7B8289;
        border: 0px solid transparent;
        position: relative;
        text-align: center;
    }
    .filemanContainer .loop-tabs .helpContainer label {
        text-align: left;
        padding-right: 0px;
        padding-left: 0px;
    }
    .filemanContainer .uploaderContainer label,
    .filemanContainer .tableContainer label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-subject] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-body] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-files-section] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-reply-to] label,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-objectlinks] label {
        padding: 10px 0;
        text-align: left;
        display: inline-block;
    }
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] label {
        padding: 0px 0px 5px 0px;
    }
    .filemanContainer .loop-tabs .uploaderContainer label:hover,
    .filemanContainer .loop-tabs .tableContainer label:hover,
	.filemanContainer .loop-tabs .helpContainer label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-subject] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-body] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-files-section] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-reply-to] label:hover,
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-objectlinks] label:hover {
        background: none;
    }
    .composeContainer [data-messagehub-linkcontrols] {
        display: flex;
	}
	.composeContainer [data-messagehub-toggle] {
		padding: 10px 10px 10px 0px;
		flex: 1;
	}
	.composeContainer [data-messagehub-toggle]:last-child {
		padding: 10px 0px 10px 0px;
	}
	.composeContainer [data-messagehub-toggle] a {
		display: block;
		text-align: center;
	}
	.staticBottom {
		padding: 20px 0px;
		border-top: 2px solid #FF9D00;
		background: #fff;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: row;
		-ms-flex-direction: row;
		flex-direction: row;
		-webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-justify-content: space-between;
		-ms-flex-pack: justify;
		justify-content: space-between;
		-webkit-align-content: stretch;
		-ms-flex-line-pack: stretch;
		align-content: stretch;
		-webkit-align-items: flex-start;
		-ms-flex-align: start;
		align-items: flex-start;
	}
	#cancelMessage {
		margin-left: 20px;
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
	}
	#sendMessage {
		margin-right: 20px;
		-webkit-order: 0;
		-ms-flex-order: 0;
		order: 0;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
	}
    .messagehubContainer .loop-tabs label.active:before,
    .filemanContainer .loop-tabs label.active:before,
    .composeContainer .loop-tabs label.active:before {
        position:absolute;
        left: -1px;
        top: -1px;
        content:'';
        border-top: 51px solid #FF9D00;
        border-right: 51px solid transparent;
        display: none;
    }
    .messagehubContainer .loop-tabs label.active:after,
    .filemanContainer .loop-tabs label.active:after,
    .composeContainer .loop-tabs label.active:after {
        position:absolute;
        left: -2px;
        top: -2px;
        content:'';
        border-top: 51px solid white;
        border-right: 51px solid transparent;
        display: none;
    }
    .messagehubContainer .loop-tabs label.active,
    .filemanContainer .loop-tabs label.active,
    .composeContainer .loop-tabs label.active {
        color: #fff;
        /* border: 1px solid; */
        border-top: 0px solid #FF9D00;
        border-bottom: 0px solid #fff;
        border-right: 0px solid #FF9D00;
        border-top-right-radius: 0px;
        padding: 15px 25px 15px 25px;
        background: #FF9D00;
    }
    .messagehubContainer .loop-tabs label:hover,
    .filemanContainer .loop-tabs label:hover,
    .composeContainer .loop-tabs label:hover {
        color: #fff;
        background:#FFB237;
    }
    .messagehubContainer h1 ,
    .filemanContainer h1 {
        margin: 0;
        font-size: 22px;
        text-transform: uppercase;
        text-align: left;
        float: none;
    }

    .messagehubContainer h2 ,
    .filemanContainer h2 {
        margin: 0;
        font-size: 14px;
        text-transform: uppercase;
        padding-top: 5px;
        text-align: left;
        float: none;
    }
    table#fileman a.contentButton,
    table#messagehub a.contentButton,
    table#sentmessages a.contentButton{
        margin-bottom: 5px;
    }
    table#fileman a.contentButton:last-child,
    table#messagehub a.contentButton:last-child,
    table#sentmessages a.contentButton:last-child {
        margin-bottom: 0px;
    }
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] .toField {
        display: flex;
    }

    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] input {
        flex: auto;
    }

    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] a.contactList {
        font-size: 20px;
        vertical-align: bottom;
        padding: 6px 14px;
        background: orange;
        border-radius: 4px;
        border: none;
        color: #fff;
        font-weight: 400;
        display: inline-block;
    }
    .messagehubContainer .loop-tabs .composeContainer [data-messagehub-to] a.contactList:hover {
        background:#FFB237;
    }
    div#composehub {
        display: block;
        position: relative;
    }
    .left {
        grid-column: 1;
    }
    .right.expandedContacts {
        width: auto;
        overflow: auto;
        position: absolute;
        top: 70px;
        right: 0;
        background: #fff;
        padding: 20px;
        box-shadow: 0px 3px 6px #0000001A;
        z-index: 100;
    }
    .right.collapsedContacts {
        display: none;
    }
	.messagehubContainer .loop-tabs .contactEditorForm label {
		padding: 10px 5px;
		min-width: 160px;
		vertical-align: top;
		text-align: left;
		display: inline-block;
	}
	.messagehubContainer .loop-tabs .contactEditorForm label:hover {
		color: #7B8289;
		background: transparent;
		cursor: default;
	}
  .messagehubContainer .paginator {
		font-weight: normal;
		text-align: center;
		font-style: normal;
		font-size: 14px;
	  margin: 15px 0px;
  }
	.messagehubContainer .paginator a {
		font-size: 14px;
		font-weight: normal;
		padding: 0px 5px;
		vertical-align: middle;
	}
	.messagehubContainer .paginator .paginatorPageCount,
	.messagehubContainer .paginator .paginatorNumPages,
	.messagehubContainer .paginator .paginatorPages {
		padding: 2px 0px;
	  display: block;
    min-height: 30px;
  }
	.messagehubContainer .paginator .paginatorPageCount strong {
		vertical-align: middle;
		padding-right: 5px;
		text-transform: uppercase;
	}
	.messagehubContainer .paginator .paginatorNumPages strong {
		padding-right: 5px;
		text-transform: uppercase;
	}
	.messagehubContainer .paginator .paginatorPages strong {
		padding: 0px 5px;
	}
	.messagehubContainer .paginator span {
		font-weight: normal;
		padding: 0px;
		font-size: 14px;
		vertical-align: middle;
	}
	.messagehubContainer .paginator .paginatorNumPages select {
		padding: 8px;
		text-transform: uppercase;
	}
}

select.objectlink_select {
    width: 100%;
    height: 40px;
    font-size: 13px;
    position: relative;
    background-color: #fff;
    padding: 5px;
    border: 1px solid #BBC4CC;
    line-height: normal;
    color: #606060;
    resize: none;
    border-radius: 4px;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.12);
}

table.object_link button.removeLink {
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
}

table.object_link button.removeLink.disabledLink {
    color: gray;
    cursor: auto;
}

.statusBox {
    border: none;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #484848 !important;
    padding: 3px 7px 3px 7px;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    border: 1px solid #BBC4CC;
    vertical-align: top;
    border-radius: 4px;
    margin: 0 5px 5px 0px;
}
#switchdock,
#switchmsg {
    font-size: 13px;
    min-height: 140px;
    box-shadow: 2px 7px 7px 6px #00000014;
    margin-left: 0px;
    margin-top: 0px;
    text-align: center;
}
#switchdock a,
#switchmsg a {
    padding: 14px 20px;
    display: block;
    border-bottom: 1px solid #ccc;
    text-transform: uppercase;
    line-height: normal;
}
#switchdock a:hover,
#switchmsg a:hover {
    background: #FFB237;
    color: #fff;
}

button.side-nav-button.notifications small {
    font-size: 10px;
    position: absolute;
    background: red;
    color: white;
    border-radius: 4px;
    top: 0px;
    left: 3px;
    font-weight: 600;
    padding: 1px;
}

div#hublink_list label {
    font-size: 16px;
    text-transform: uppercase;
    color:  white;
    background: #FF9D00;
    display: block;
    font-weight: 600;
    padding: 7px;
}

div#hublink_list a {
    border-bottom: 1px solid #FF9D00;
    display: flex;
}

div#hublink_list a:last-child {
    border-bottom: 0px solid #FF9D00;
}

div#hublink_list a span {
    font-size: 12px;
    text-align: left;
    padding: 0px 10px 0px 0px;
    flex: 1;
    text-transform: uppercase;
    display: block;
    font-weight: 600;
}

div#hublink_list a small {
    text-align: right;
    flex: inherit;
}

.noteblock {
    display:block;
    background: #F0F0F0;
    border: 1px solid #BBC4CC;
    min-height: 25px;
    position: relative;
    margin-bottom:10px;
    padding: 5px;
    font-size: 13px;
}

.noteblockheader {
    font-size: 15px;
    font-weight: bold;
}

.noteblock-danger {
    background: #ffe6e6;
    border: 1px solid #ffc4c4;
}

.noteblock-success {
    background: #edffed;
    border: 1px solid #b3ffb3;
}

.noteblock-warning {
    background: #fff3ba;
    border: 1px solid #fff45d;
}

/* Company form modal styles */
.tingle-modal-box__content .tingle-modal-box__content-wrapper {
	font-size: 14px;	
}

.tingle-modal-box__content-wrapper tr td {
	border: 0;
	padding: 0.25rem;
	min-height: 0;
	text-align: left;
}

.tingle-modal-box__content-wrapper tr td:first-child {
    padding-left: 0;
}

.tingle-modal-box__content-wrapper tr td:last-child {
	padding-right: 0;
}

.tingle-modal-box__content-wrapper tr td.empty_cell {
	padding: 0;
}

.tingle-modal-box__content .tingle-modal-box__content-wrapper table tr {
	border: 0;
	margin: 0;
}

.tingle-modal-box__content .tingle-modal-box__content-wrapper table td label.field_label {
	display: block;
	font-weight: 600;
	margin-bottom: 5px;
	text-align: left;
}

.tingle-modal-box__content .tingle-modal-box__content-wrapper table td label.checkbox_label {
	display: inline-block;
	font-weight: 600;
	text-align: left;
	vertical-align: middle;
	margin-top: 20px;
}

.tingle-modal-box__content .tingle-modal-box__content-wrapper table td .CAWrapper {
	width: 100%;
}

.tingle-modal-box__content .tingle-modal-box__content-wrapper table td input[type="text"],
.tingle-modal-box__content .tingle-modal-box__content-wrapper table td select {
	width: 100%;
	height: 33px;
	font-size: 13px;
	box-sizing: border-box;
}

.tingle-modal-box__content .tingle-modal-box__content-wrapper table td input[type="checkbox"] {
	vertical-align: middle;
	margin-top: 20px;
}

.tingle-modal-box__content .tingle-modal-box__content-wrapper table td input:disabled {
	background-color: #ebebe4;
}

.tingle-modal-box__content .tingle-modal-box__content-wrapper table td select {
	width: 100%;
	height: 33px;
	font-size: 13px;
	color: #606060;
	box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.12);
	border-radius: 2px;
	border: 1px solid #BBC4CC;
	padding: 5px;
	box-sizing: border-box;
}

.tingle-modal-box__content .tingle-modal-box__control-wrapper {
	display: flex;
	margin-top: 1rem;
}

.tingle-modal-box__control-wrapper button.anchor-right {
	margin-left: auto;
}

.tingle-modal-box__content .error_message {
    font-weight: bold;
    min-height: 20px;
    color: red;
    padding: 20px 0px;
    text-align: center;
}

.tingle-modal-box__content .create_company_form table button {
	/* width: 100%; */
}

.tingle-modal-box__content .create_company_form table button:disabled {
	color: #A7A7A7;
    background-color: #EBEBE4;
}

.mt1rem {
	margin-top: 1rem;
}

button.text_button {
    padding: 0.25rem 0;
    border: 0;
    background: transparent;
	font-size: 0.9em;
	cursor: pointer;
}

button.text_button:hover {
	text-decoration: underline;
}

.nonconformity-modal .tingle-modal-box {
    overflow-y: auto;
    max-height: 600px;
}

@media only screen and (max-width: 991px) {
	.tingle-modal-box__content-wrapper tr td {
		text-align: left;
	}

	.tingle-modal-box__content-wrapper tr td:first-child {
		padding: 0.25rem;
	}

	.tingle-modal-box__content-wrapper table tr.validation_row {
		margin-bottom: 1rem;
	}
}
/* overwrite tingle modal padding-top: 0 */
@media (max-width: 540px) {
	.tingle-modal--noOverlayClose {
		padding-top: 60px;
	}
}
div.actionInfo {
    padding: 15px 5px 15px 15px;
    /* border: 0px solid #c1c1c1; */
    background: #fafafa;
    margin-bottom: 10px;
}

.actionInfo .red {
	color: #A30000;
	font-size: 16px;
}

.actionInfo .airfaas-orange {
	color: #FF9D00;
	font-size: 16px;
}

.modal-hr {
    margin-top: 5px;
    margin-bottom: 10px;
}

.actionInfo .airfaas-red {
	color: #E00909;
	font-size: 16px;
}

div.actionInfo span {
	margin-left: 10px;
	font-weight: 800;
}

div.actionInfo .info {
	background-position-y: center;
}

div.actionInfo .info p {
	margin-left: 28px;
	margin-bottom: 13px;
    word-break: break-word;
    font-size: 12px;
    margin-bottom: 0;
    line-height: 17px;
	vertical-align: middle;
	padding-top:0;
}
.infoBg {
  background: #fafafa;
  margin-bottom: 20px;
  padding: 15px 5px 15px 15px;
  font-size: 13px;
  font-weight: 800;
}
.infoBg button.info-button {
  vertical-align: middle;
  margin-right: 6px;
}
.actionFlexWrapper.nc {
	display:flex;
	margin-bottom: 20px;
}
.actionFlexWrapper.nc .actionFlexLeft {
	flex:1;
	text-align: left;
	display:inline-block;
}
.actionFlexWrapper.nc .actionFlexRight {
	flex:1;
	text-align: right;
	display:inline-block;
}
.jexcel {
    width: 100% !important;
    white-space: normal;
}
.dot {
    height: 25px;
    width: 25px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
}

tr.yellow_row td {
    background-color: #F4C503;
    color:#fff;
}

tr.red_row td {
    background-color: #f10000;
    color:#fff;
}
tr.green_row td {
    background-color: #008b25; 
    color:#fff;
}

.pie_desc p {
    margin-bottom: 10px;
}

#pie_so_accuracy, #pie_po_accuracy {
    display: grid;
}
#pie_so_accuracy p, #pie_po_accuracy p {
    grid-column: 1;
    grid-row: 1;
}
#pie_so_accuracy svg, #pie_po_accuracy svg {
    grid-column: 1;
    grid-row: 1;
}

.QuotationPartsModal > .tingle-modal-box{
    width: 80%;
}

.modal-search-item {
    border: 2px solid #FF9D00;
    margin: 2px 0;
    padding: 5px;
}

.simple-select {
    height: 40px;
    width: 100%;
    font-size: 13px;
    position: relative;
    background-color: #fff;
    padding: 5px 10px;
    border: 1px solid #BBC4CC;
    line-height: normal;
    color: #58616A;
    resize: none;
    border-radius: 4px;
    box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
}
.id-header .header label {
  padding: 22px 0px;
}
.crate {
  padding-top: 20px;
}
.crate .contentButton {
  margin-top: 8px;
}
div#tosearchresults div div span, div#fromsearchresults div div span {
  font-size: 14px;
  text-transform: uppercase;
}

div#tosearchresults div div ul li, div#fromsearchresults div div ul li {
  font-size: 12px;
  /* display: inline-block; */
  padding: 5px 5px;
}

div#tosearchresults [data-searchresults] {
  width: 95% !important;
  /* display: block !important; */
  flex-wrap: wrap;
}
div#tosearchresults [data-searchresults] div {
  box-shadow: 0px 1px 0px 2px #ccc !important;
  padding: 5px 10px !important;
  margin-left: 0px !important;
  flex: 1 1 0px;
}
div#fromsearchresults [data-searchresults] div {
  box-shadow: 0px 1px 0px 2px #ccc !important;
  padding: 5px 10px !important;
  margin-left: 0px !important;
}
[data-closer] {
  padding: 8px;
  color: white;
  background: #58616A;
  line-height: initial;
  margin-bottom: 5px;
}
[data-filemanager-preview-container] {
  text-align: right;
  margin-bottom: 5px;
}
[data-filemanager-preview-container] a {
  padding: 10px;
  color: white;
  line-height: initial;
  margin-bottom: 5px;
}

[data-filemanager-preview-container] a {
  padding: 10px;
  color: white;
  line-height: initial;
  margin-bottom: 5px;
}
[data-meta-tags] a, [data-metax-view] a, [data-filemanager-selected-meta] span {
  padding: 10px;
  color: white;
  line-height: initial;
  margin-bottom: 5px;
}
[data-meta-viewer] {
	padding-top: 15px;
}
[data-meta-viewer] .card .tags {
	padding-top: 5px;
}
[data-filemanager-list] .tag ,[data-meta-viewer] .tag, [data-filemanager-selected-list] .tag {
  padding: 5px;
  padding-right: 12px;
  background: #FF9D00;
  color: #FFF !important;
  border-radius: 7px;
  border: 0px;
  margin-right: 5px;
  margin-bottom: 4px;
  cursor: pointer;
  text-transform: none;
  position: relative;
  white-space: nowrap;
}
[data-filemanager-list] .tag [data-remove-tag], [data-meta-viewer] .tag [data-remove-tag],
[data-filemanager-list] .tag [data-remove-custom], [data-meta-viewer] .tag [data-remove-custom] {
	border-radius: 50%;
	position: absolute;
	top: -5px;
	right: -5px;
	padding: 0px 4px;
	background: red;
	font-size: 15px;
	text-transform: none;
}
a[data-filemanager-meta-addrow] {
  padding: 10px;
  color: #7B8289;
  line-height: initial;
  margin-bottom: 5px;
}
[data-filemanager-selected-meta] span {
  margin-right: 3px;
}
#switchmsg label {
  font-size: 13px;
  text-align: center;
  display: block;
  text-transform: uppercase;
  font-weight: 600;
}
#switchmsg span {
  font-style: italic;
}
#switchmsg input[type="search"] {
  border-color: #FF9D00;
  box-shadow: 0 0 5px #ff9d00, inset 0 0 2px rgb(0 0 0 / 12%);
  background-color: #fff;
  border: 1px solid #BBC4CC;
  font-size: 14px;
  line-height: normal;
  color: #58616A;
  resize: none;
  border-radius: 4px;
  box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
  -webkit-transition: .1s linear border;
  -moz-transition: .1s linear border;
  -ms-transition: .1s linear border;
  -o-transition: .1s linear border;
  transition: .1s linear border;
  outline: none;
  height: 30px;
  padding: 3px 5px;
}
.addMetaCustom input[type="search"] {
  border-color: #FF9D00;
  box-shadow: 0 0 5px #ff9d00, inset 0 0 2px rgb(0 0 0 / 12%);
  background-color: #fff;
  border: 1px solid #BBC4CC;
  font-size: 14px;
  line-height: normal;
  color: #58616A;
  resize: none;
  border-radius: 4px;
  box-shadow: inset 0 0 2px rgb(0 0 0 / 12%);
  -webkit-transition: .1s linear border;
  -moz-transition: .1s linear border;
  -ms-transition: .1s linear border;
  -o-transition: .1s linear border;
  transition: .1s linear border;
  outline: none;
  height: 25px;
  padding: 3px 5px;
}
#switchmsg input[type="search"]:focus {
  border-color: #FF9D00;
  box-shadow: 0 0 5px #ff9d00, inset 0 0 2px rgb(0 0 0 / 12%);

}
#switchdock, #switchmsg {
  padding: 5px;
}
.helpBox {
}
.helpBoxWrapper {
  display: grid;
  grid-template-columns: auto auto auto auto;
  grid-gap: 15px;
  padding-top: 25px;
}
.helpBox span {
  line-height: normal;
  vertical-align: baseline;
  padding-right: 0px;
  padding-left: 5px;
}
.helpBox p {
  font-style: normal;
}
.helpBox p strong {
color: red;
}
.errorBoxWrapper {
  display: grid;
  grid-template-columns: auto;
  grid-gap: 15px;
  padding-top: 25px;
}
.errorBox span {
  line-height: normal;
  vertical-align: baseline;
  padding-right: 0px;
  padding-left: 5px;
}
.errorBox p {
  font-style: normal;
}
.errorBox p strong {
color: red;
}
small.metaBoxWrap {
  justify-content: center;
  margin-top: 10px;
  display: grid;
  grid-template-columns: auto auto;
  grid-gap: 10px;
}
@media (min-width: 768px) and (max-width: 991px) {
  .helpBox {
  }
  .helpBoxWrapper {
      display: grid;
      grid-template-columns: auto auto;
      grid-gap: 15px;
      padding-top: 25px;
  }
  .helpBox span {
      line-height: normal;
      vertical-align: baseline;
      padding-right: 0px;
      padding-left: 5px;
  }
  .errorBoxWrapper {
      display: grid;
      grid-template-columns: auto;
      grid-gap: 15px;
      padding-top: 25px;
  }
  .errorBox span {
      line-height: normal;
      vertical-align: baseline;
      padding-right: 0px;
      padding-left: 5px;
  }
}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
  .helpBox {
  }
  .helpBoxWrapper {
      display: grid;
      grid-template-columns: auto;
      grid-gap: 15px;
      padding-top: 25px;
  }
  .helpBox span {
      line-height: normal;
      vertical-align: baseline;
      padding-right: 0px;
      padding-left: 5px;
  }
  .helpBox p {
    text-align: center;
	  font-style: normal;
  }
  .errorBoxWrapper {
      display: grid;
      grid-template-columns: auto;
      grid-gap: 15px;
      padding-top: 25px;
  }
  .errorBox span {
      line-height: normal;
      vertical-align: baseline;
      padding-right: 0px;
      padding-left: 5px;
  }
  .errorBox p {
    text-align: center;
	  font-style: normal;
  }
}
.infoMessages {
    display: block;
    text-align: center;
}

/* ------------------------------------------------------------------------------------------------------------*/
/* Add custom CSS above Global settings */
/* ------------------------------------------------------------------------------------------------------------*/

/* Globals */

@media (max-width: 400px) {
  .hidden-xxs {
      display: none !important;
  }
}

@media (max-width: 767px) {
  .hidden-xs {
      display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
      display: none !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
      display: none !important;
  }
}

@media (min-width: 1200px) {
  .hidden-lg {
      display: none !important;
  }
}

.clearfix:after {
  clear: both;
}

.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.pull-right {
  float: right !important;
}

.pull-left {
  float: left !important;
}

.hide {
  display: none ! important;
}

.show {
  display: block !important;
}

.show-block {
display: block;
}

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

.invisible {
  visibility: hidden;
}

.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.hidden {
  display: none !important;
  visibility: hidden !important;
}

.first-child {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.affix {
  position: fixed;
}

@-ms-viewport {
  width: device-width;
}

.text-left {
  text-align: left;
}

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

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

.text-justify {
  text-align: justify;
}

.text-nowrap {
  white-space: nowrap;
}

.text-lowercase {
  text-transform: lowercase;
}

.text-uppercase {
  text-transform: uppercase;
}

.text-capitalize {
  text-transform: capitalize;
}

.no-margin {
  margin: 0;
}

.bottom15 {
  margin-bottom: 15px;
}

.mleft5 {
margin-left: 5px;
}
.mright5 {
margin-right: 5px;
}
.mtop5 {
margin-top: 5px;
}
.mbottom5 {
margin-bottom: 5px;
}
.mleft10 {
margin-left: 10px;
}
.mright10 {
margin-right: 10px;
}
.mtop10 {
margin-top: 10px;
}
.mbottom10 {
margin-bottom: 10px;
}
.mleft15 {
margin-left: 15px;
}
.mright15 {
margin-right: 15px;
}
.mtop15 {
margin-top: 15px;
}
.mbottom15 {
margin-bottom: 15px;
}
.pleft5 {
padding-left: 5px;
}
.pright5 {
padding-right: 5px;
}
.ptop5 {
padding-top: 5px;
}
.pbottom5 {
padding-bottom: 5px;
}
.pleft10 {
padding-left: 10px;
}
.pright10 {
padding-right: 10px;
}
.ptop10 {
padding-top: 10px;
}
.pbottom10 {
padding-bottom: 10px;
}
.pleft15 {
padding-left: 15px;
}
.pright15 {
padding-right: 15px;
}
.ptop15 {
padding-top: 15px;
}
.pbottom15 {
padding-bottom: 15px;
}
.divideri span {
  display: block;
  position: relative;
  border-bottom: 1px solid #BBC4CC;
  margin: 20px 60px;
}

.globalSpinner {
    display:block;
    width: 40px;
    height: 30px;
    margin: 0 auto;

    background-image: url(/assets/styles/user/loading.gif);
    background-repeat: no-repeat;
    background-position: center;
    flex: 1 100%;
}

.red_tag{
    color: #FFF;
    background: #CC0018;
    font-size: 10px;
    padding: 5px;
    border: 0px solid #000;
    border-radius: 4px;
    margin-bottom: 0px;
    vertical-align: middle;
    margin-right: 2px;
}