@font-face{font-family:"Outfit";font-display:swap;src:url(/fonts/Outfit-Regular.ttf);}
@font-face{font-family:"OutfitM";font-display:swap;src:url(/fonts/Outfit-Medium.ttf);}
@font-face{font-family:"OutfitSB";font-display:swap;src:url(/fonts/Outfit-SemiBold.ttf);}
* {
	padding:0;
	margin:0;
	box-sizing:border-box;
	font-family:Outfit;
}

@keyframes circle-show {
	0% {
		opacity:0;
		transform:scale(.9, .9);
	}
}

@keyframes side-show {
	0% {
		opacity:0;
		left:27%;
	}
}


::-webkit-scrollbar {
	width:16px;
}

/* Track */
::-webkit-scrollbar-track {
	background:rgba(0, 0, 0, .2);
}

/* Handle */
::-webkit-scrollbar-thumb {
	background:#7f7f7f; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: #9f9f9f; 
}

.scaled-down {
	transform:scale(.85, .85);
	left:-9% !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow:0 0 0 30px white inset !important;
}

.reffer-link-outer {
	position:absolute;
	top:40px;
	width:100%;
	height:65px;
}

.reffer-link {
	width:200px;
	height:65px;
	color:#fff;
	background:#007c91;
	line-height:65px;
	font-size:16px;
	font-family:OutfitSB;
	text-align:center;
	position:relative;
	box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.2),
    0px 2px 2px 0px rgba(0, 0, 0, 0.14),
    0px 3px 1px -2px rgba(0, 0, 0, 0.12);
	transition:box-shadow .3s;
	display:block;
	margin:0px auto 0;
	text-decoration:none;
	border-radius:4px;
}

.reffer-link:hover {
	box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2),
    0px 8px 10px 1px rgba(0, 0, 0, 0.14),
    0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}

@keyframes update-show {
	0% {
		opacity:0;
		transform:scale(.9, .9);
	}
	100% {
		opacity:1;
		transform:scale(1, 1);
	}
}

.update-popup-container {
	width:1100px;
	height:600px;
	top:110px;
	left:calc(50% - 550px);
	position:absolute;
	background:#fff;
	box-shadow:0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.20);
	border-radius:8px;
	overflow:hidden;
	animation:update-show .4s;
	animation-delay:1s;
	animation-fill-mode:forwards; 
	opacity:0;
	transform:scale(.9, .9); 
}

.update-popup-header {
	background:#002f6c;
	color:#efefef;
	height:100px;
	font-family:Outfit;
	font-size:34px;
	line-height:100px;
	padding:0 20px;
	position:relative;
}

.update-popup-content {
	position:relative;
	width:100%;
	height:calc(100% - 170px);
	overflow-y:scroll;
	padding:20px 0;
}

.update-popup-small {
	font-size:18px;
	font-family:Outfit;
}

.update-popup-footer {
	background:#fff;
	height:70px;
	border-top:1px solid #afafaf;
}

.save-new-version {
	background:#002f6c;
	width:110px;
	height:40px;
	margin-top:15px;
	margin-right:15px;
	float:right;
	color:#fff;
	font-size:15px;
	font-family:OutfitM;
	border-radius:20px;
	box-shadow:0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0,0,0,.12);
	transition:all .3s;
}


.dark-mode .save-new-version {
	color:rgba(255,255,255,.7);
	background:#003c8f;
}


#preloader {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
#loader,
#loader-white {
    display:block;
    position:absolute;
    left:50%;
    top:42%;
    width:150px;
    height:150px;
    margin:-75px 0 0 -75px;
    border-radius:50%;
    border:3px solid transparent;
    border-top-color:#2962ff;
    animation:spin 1.3s linear infinite;
}
#loader-white {
	top:50%;
}
#loader:before,
#loader-white:before {
    content:"";
    position:absolute;
    top:5px;
    left:5px;
    right:5px;
    bottom:5px;
    border-radius:50%;
    border:3px solid transparent;
    border-top-color:#2962ff;
    animation:spin-b 2s linear infinite;
}
#loader:after,
#loader-white:after {
    content:"";
    position:absolute;
    top:15px;
    left:15px;
    right:15px;
    bottom:15px;
    border-radius:50%;
    border:3px solid transparent;
	border-top-color:#2962ff;
    animation:spin-a 1s linear infinite;
}

#loader-white,
#loader-white:before,
#loader-white:after {
    border-top-color:#fff;
}

@keyframes spin {
    0% {transform:rotate(0deg);}
    100% {transform:rotate(360deg);}
}

@keyframes spin-a {
    0% {transform:rotate(60deg);}
    100% {transform:rotate(420deg);}

}

@keyframes spin-b {
    0% {transform:rotate(30deg);}
    100% {transform:rotate(390deg);}
}


.list-item-header {
	font-size:14px;
	font-family:OutfitSB;
}

.nowrap-list-item {
	text-overflow:ellipsis;
	overflow:hidden;
	position:relative;
	white-space:nowrap;
	height:100%;
	padding-right:6px;
	float:left;
	font-family:inherit;
	font-size:inherit;
}

.no-deco {
	text-decoration:none;
}

.no-items-text {
	font-size:17px;
	margin:15px;
	display:block;
	transition:color .3s;
}

.note-modal-content {
	margin:120px auto;
}

.note-dropdown-menu {
	padding:2px;
}

.floating {
	z-index:10004;
	box-shadow:0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0,0,0,.12);
	transition:all .3s;
	position:fixed;
	overflow:hidden;
}

.floating-button {
	bottom:0px;
	transform:translateY(-50px);
	height:56px;
	line-height:56px;
	color:rgba(255,255,255,.8);
	cursor:pointer;
	border-radius:16px;
	text-align:center;
	background:#002f6c;
	font-size:16px;
	padding:6px;
	z-index:10004;
	box-shadow:0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0,0,0,.12);
	transition:all .3s;
	position:fixed;
	overflow:hidden;
}

.floating-window {
	border-radius:4px;
	color:#000;
	background:#002f6c;
}

.floating-window-content,
.view-person-content,
.view-address-content {
	transition:all .3s;
	padding:15px;
	background:#f3f6fc;
	height:calc(100% - 120px);
	position:relative;
}

.view-address-content {
	height:calc(100% - 168px);
}

.floating-button .floating-window-content {
	opacity:0;
}

.floating-window .floating-window-content {
	opacity:1;
}

.add-contact-floating, 
.add-task-floating,
.add-address-floating,
.add-order-floating,
.add-device-floating {
	width:170px;
	left:calc(50% - 110px);
}

.floating-button:hover, .floating-button:focus, .save-new-version:hover {
	box-shadow:0px 8px 10px -5px rgba(0, 0, 0, 0.2),
    0px 16px 24px 2px rgba(0, 0, 0, 0.14),
    0px 6px 30px 5px rgba(0, 0, 0, 0.12);;
	background:#005b9f;
}

.floating-button:active, .save-new-version:active {
	box-shadow:0px 10px 13px -6px rgba(0, 0, 0, 0.2),
    0px 20px 31px 3px rgba(0, 0, 0, 0.14),
    0px 8px 38px 7px rgba(0, 0, 0, 0.12);
}

.floating-header,
.view-person-header {
	height:48px;
	width:100%;
	line-height:48px;
	text-align:center;
	background:#002f6c;
	color:rgba(255,255,255,0.8);
	transition:all .3s;
	font-size:17px;

}

.floating-window .floating-header i {
	display:none;
}

.floating-window .floating-header {
	text-align:left;
	height:60px;
}

.floating-window .floating-header .button-text-40 {
	font-size:18px;
	font-family:Outfit;
	line-height:60px;
	padding:0px 18px;
}

.view-contact {
	width:500px;
	height:630px;
	left:calc(50% - 250px);
	color:#000;
	border-radius:4px;
	top:100px;
	animation:circle-show .25s;
}

.view-person-window,
.view-address-window,
.view-contact-window,
.view-contact-service-window,
.add-device-box,
.link-customer-window,
.add-group-box {
	color:#000;
	top:10%;
	animation:circle-show .25s;
	position:absolute;
	overflow:hidden;
	border-radius:22px;
}

.view-contact-window {
	width:800px;
	height:630px;
	left:calc(50% - 400px);
}

.view-person-window {
	height:652px;
	width:600px;
	left:calc(50% - 300px);
}

.view-address-window {
	height:704px;
	width:600px;
	left:calc(50% - 300px);
}

.address-type-tabs {
	width:100%;
	height:48px;
	background:#dfdfdf;
}

.address-type-tab:hover {
	background:rgba(0, 0, 0, 0.04);
}

.address-type-tab {
	width:50%;
	float:left;
	height:48px;
	text-align:center;
	border-bottom:3px solid rgba(0,0,0,0);
	color:#6f6f6f;
	cursor:pointer;
	line-height:46px;
	transition:all .3s;
	position:relative;
	overflow:hidden;
}

.type-tab-active {
	color:#003c8f;
	border-bottom:3px solid #003c8f;
	background:#f3f6fc;
	transition:all .3s;
}

.task-view-floating,
.view-task-window {
	position:absolute;
	top:10%;
	width:800px;
	height:645px;
	left:calc(50% - 400px);
	border-radius:22px;
	overflow:hidden;
	opacity:1;
	animation:circle-show .25s;
	box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2),
    0px 24px 38px 3px rgba(0, 0, 0, 0.14),
	0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}

.button-text-48 {
	line-height:48px;
}

main, header, fieldset, input, button, aside, footer, section, nav {
	display:block;
}

body {
	background: #EEF6FF;
	transition:background .3s;
}

button {
	border:0;
	cursor:pointer;
	background:none;
}

label {
	font-weight:normal;
}

.list-item:hover {
	background:rgba(0, 0, 0, 0.08);
}

.list-item:active {
	background:rgba(0, 0, 0, 0.12);
}

button:focus, button:active {
	outline:none;
}

input:focus,
select:focus,
#note-view-comments:focus {
	outline:0 !important;
}

button::-moz-focus-inner {
    padding:0;
    border:0;
}

h1, h2, h3, h4, h5, h6 {
	font-weight:normal;
	margin:0;
}

.sidebar-footer-content {
	font-size:11px;
	position:absolute;
	width:100%;
	height:20px;
	text-align:center;
	left:0;
	bottom:0;
}

.ml-15 {
	margin-left:15px;
}

.ml-30 {
	margin-left:30px;
}

.f-r {
	float:right !important;
}

input.pl-25 {
	padding-left:34px;
}


.display-none {
	display:none;
}

.overlay,
.overlay-fixed,
.overlay-inner,
.overlay-container,
.my-printers-overlay,
.over-task-view {
	z-index:111105;
	top:0;
	left:0;
	background:rgba(0,0,0,0.5);
	width:100%;
	height:100%;
	backdrop-filter:blur(8px);
}

.overlay {
	position:fixed;
	opacity:0;
	transition:all .4s;
}

.overlay-fixed {
	position:fixed;
	animation:show .2s;
	overflow-x:auto;
}

.overlay-inner {
	position:absolute;
	animation:show .2s;
}

.overlay-container {
	position:absolute;
	animation:show .4s;
}

.my-printers-overlay {
	position:fixed;
	animation:show .4s;
}

@keyframes show {
	0% {opacity:0;backdrop-filter: blur(0px);}
	100% {opacity:1;backdrop-filter: blur(8px);}
}

.overlay-visible {
	opacity:1;
}

.alert-box {
	background:#B00020;
	width:340px;
	height:480px;
	position:absolute;
	left:calc(50% - 200px);
	top:200px;
	border-radius:4px;
	box-shadow:0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
	transform:scale(0.4,0.4);
	transition:all .4s;
}

.overlay-visible .alert-box {
	transform:scale(1,1);
}

.scroll-bar {
	background:#efefef;
}


.alert-box-img {
	position:relative;
	margin:30px auto 0;
	height:160px;
	width:160px;
	text-align:center;
	display:block;
}

.alert-box-text {
	width:340px;
	padding:20px 50px;
	height:200px;
	text-align:center;
	font-size:20px;
	font-family:OutfitM;
	color:#fff;
}

.alert-box-close {
	padding:0 20px;
	height:44px;
	background:#fff;
	color:#b00020;
	border-radius:4px;
	margin:0px auto;
	position:relative;
	font-family:OutfitM;
	font-size:16px;
	white-space:nowrap;
	transition:all .3s;
}

.alert-box-close:hover {
	background:#efefef;
}

.alert-box-close:active{
	backgrounD:#cfcfcf;
}

.popup-normal {
	background:#fff;
	box-shadow:0 12px 17px 2px rgba(0,0,0,0.14), 0 5px 22px 4px rgba(0,0,0,0.12), 0 7px 8px -4px rgba(0,0,0,0.20);
	width:500px;
	height:300px;
	top:calc(50% - 200px);
	left:calc(50% - 250px);
	position:absolute;
	padding:10px;
	border-radius:8px;
}

.popup-normal-big {
	font-size:38px;
	padding:30px;
	text-align:center;
}

.popup-normal-content {
	width:100%;
	height:calc(100% - 40px);
}

.popup-normal-title {
	width:100%;
	height:50px;
	font-size:24px;
}

.popup-normal-inner {
	width:100%;
	height:160px;
}

.popup-normal-image {
	width:160px;
	height:160px;
	float:left;
}

.popup-image-img {
	width:100%;
	height:100%;
	padding:10px;
}

.popup-normal-description {
	width:320px;
	font-size:15px;
	height:180px;
	overflow-y:scroll;
	float:left;
}

.popup-normal-footer {
	height:60px;
	width:100%;
}

.popup-normal-close-btn {
	background:#004ba0;
	width:100px;
	height:40px;
	font-family:OutfitM;
	transition:all .3s;
	float:right;
	color:#fff;
	border-radius:4px;
}
.popup-normal-close-btn:hover {
	background:#0077c2;
}

.main-search-user-input-container {
	width:100%;
	height:max-content;
	flex:1 1;
	transition:all .2s;
	z-index:3;
}

.main-search-user-input-icon {
	background:url('/images/search-24px.svg') no-repeat;
	height:28px;
	width:28px;
	float:left;
	margin-left:46px;
	margin-top:20px;
	filter:opacity(40%);
	transition:all .3s;
	z-index:5;
	position:absolute;
}

.main-search-user-input {
	width:calc(100% - 40px);
	height:64px;
	float:right;
	border:0;
	padding:0 34px;
	font-size:16px;
	background:0;
	position:relative;
	z-index:4;
}

.main-search-focus .main-search-user-input {
	position:absolute;
	width:calc(100% - 380px);
	background:#F3F4F6;
	margin:10px 20px 0px 40px;
	height:44px;
	border-radius:22px;
}

.main-search-user-input::placeholder {
	transition:color .3s;
}

.main-search-user-input:focus + i {
	filter:opacity(100%);
}

.main-search-user-field {
	min-height:0px;
	max-height:650px;
	position:absolute;
	width:calc(100% - 360px);
	background:#fff;
	padding-top:56px;
	box-shadow:0 10px 74px 8px rgb(0 0 0 / 44%), 0 10px 46px 8px rgb(0 0 0 / 22%);
	margin-left:30px;
	border-radius:16px;
	overflow:hidden;
	padding-bottom:8px;
	transition:all .3s;
}

.search-href {
	width:calc(100% - 20px);
	display:block;
	height:38px;
	margin:6px 10px;
}

.search-href:focus .main-search-user-item {
	background:rgba(0,0,0,.12);
	outline:0;
}

.main-search-user-item {
	height:38px;
	width:100%;
	line-height:38px;
	padding:0 20px;
	cursor:pointer;
	font-size:13px;
	color:#000;
	text-decoration:none;
	background:#F3F4F6;
	border-radius:4px;
	transition:all .3s;
}

.main-search-user-item:hover {
	background:#E2E8F0;
}

.main-search-user-header {
	height:40px;
	font-size:18px;
	line-height:40px;
	padding:0px 46px 0 30px;
}

.main-search-user-results-container {
	max-height:250px;
	width:100%;
	overflow-y:scroll;
}

.main-search-user-item-customer-name {
	width:37%;
	float:left;
}

.main-search-user-item-customer-nip,
.main-search-user-item-person-name  {
	width:15%;
	float:left;
}

.main-search-user-item-customer-mail {
	width:20%;
	float:left;
}

.main-search-user-item-customer-phone {
	width:14%;
	float:left;
}

.main-search-user-item-customer-cell {
	width:14%;
	float:left;
}

.title-main-search-user-14,
.title-main-search-user-15,
.title-main-search-user-20, 
.title-main-search-user-37, 
.title-main-search-user-37-big,
.title-main-search-user-15-big {
	float:left;
	line-height:inherit;
	font-size:13px;
}

.title-main-search-user-14 {
	width:14%;
}

.title-main-search-user-15 {
	width:15%;
}

.title-main-search-user-20 {
	width:20%;
}

.title-main-search-user-37 {
	width:37%;
}

.title-main-search-user-37-big {
	width:37%;
	font-size:16px;
}

.title-main-search-user-15-big {
	width:15%;
	line-height:inherit;
	font-size:16px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}


.date-time,
.main-navbar,
.top-bar,
.topics
.company-card,
.my-printers-item,
.no-msg-background,
.thread-message,
.messenger,
.cart-container,
.delivery-container,
.main-ready-content,
.ready-error-message,
.adress-card,
.product-card,
.product-section-item,
.product-section-item-cart-input-count-decrement,
.product-section-item-cart-input-count-increment,
.product-section-item-cart-input-count,
.offer-item-window,
.account-settings,
.new-service-added-box,
.offer-card,
.points-card,
.blog-card,
.loyalty-card,
.services,
.customers-card,
.new-order-address-picker {
	box-shadow:0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12), 0 2px 4px -1px rgba(0,0,0,0.20);
	transition:color .3s, box-shadow .3s, background .3s, transform .3s;
}

.task-view-container,
.view-contact-window,
.view-address-window,
.view-person-window,
.complaint-form-container,
.add-device-box,
.link-customer-window,
.add-group-box {
	box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2),
    0px 24px 38px 3px rgba(0, 0, 0, 0.14),
	0px 9px 46px 8px rgba(0, 0, 0, 0.12);
	transition:color .3s, box-shadow .3s, background .3s, transform .3s;
}

.date-time,
.points-card,
.blog-card,
.services {
	border-radius:8px;
	overflow:hidden;
}

.orders,
.fast-order,
.order-products,
.user-profile-card {
	border-radius:24px 24px 0 0;
}

.card-inner,
.new-order-address-picker {
	border-radius:24px;
}

.customers-card:hover {
	box-shadow:0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.20);
}

.go-to-cart-link,
.delivery-edit-data-link,
.main-header-cart-button,
.go-to-next-step,
.confirmation-button,
.product-section-item-cart-btn,
.cart-sidebar-scroll-up,
.cart-sidebar-scroll-down,
.new-service-added-box a,
#service-back,
#service-submit,
#service-reset,
#service-generate-file,
.product-page-add-cart,
.company-options-item:not(:disabled),
.adress-save-changes:not(:disabled),
.adress-cancel-changes:not(:disabled),
.product-section-close,
.fast-order-add-cart,
.alert-box-close,
.page-reward-take-btn,
.popup-normal-close-btn,
.add-full-width-container,
.task-view-save,
.task-view-go-to,
.floating-task-view-save,
.complaint-form-btn,
.button-main,
.form-warning-close {
	box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0,0,0,.12);
	border-radius:22px;
}

.go-to-cart-link:hover,
.delivery-edit-data-link:hover,
.main-header-cart-button:hover,
.go-to-next-step:hover,
.confirmation-button:hover,
.product-section-item-cart-btn:hover,
.cart-sidebar-scroll-up:hover,
.cart-sidebar-scroll-down:hover,
.new-service-added-box a:hover,
#service-back:hover,
#service-submit:hover,
#service-reset:hover,
#service-generate-file:hover,
.product-page-add-cart:hover,
.company-options-item:not(:disabled):hover,
.adress-save-changes:not(:disabled):hover,
.adress-cancel-changes:not(:disabled):hover,
.product-section-close,
.fast-order-add-cart:hover,
.alert-box-close:hover,
.page-reward-take-btn:hover,
.popup-normal-close-btn:hover,
.add-full-width-container:hover,
.task-view-save:hover,
.task-view-go-to:hover,
.floating-task-view-save:hover,
.button-main:hover,
.customer-data-persons-add:hover,
.customer-data-comments-edit:hover,
.customer-data-comments-maximize:hover,
.complaint-form-btn:hover,
.form-warning-close:hover {
	box-shadow:0px 8px 10px -5px rgba(0, 0, 0, 0.2),
    0px 16px 24px 2px rgba(0, 0, 0, 0.14),
    0px 6px 30px 5px rgba(0, 0, 0, 0.12);
}

.button-main:hover,
.task-view-save:hover,
.customer-data-persons-add:hover,
.customer-data-comments-edit:hover,
.customer-data-comments-maximize:hover,
.complaint-form-btn:hover,
.task-view-go-to:hover {
	background:#005b9f;
}

.button-main:active,
.task-view-save:active,
.customer-data-persons-add:active,
.customer-data-comments-edit:active,
.customer-data-comments-maximize:active,
.form-warning-close:active,
.complaint-form-btn:active,
.task-view-go-to:active {
	box-shadow:0px 10px 13px -6px rgba(0, 0, 0, 0.2),
    0px 20px 31px 3px rgba(0, 0, 0, 0.14),
    0px 8px 38px 7px rgba(0, 0, 0, 0.12);
}

.card-container,
.full-height-card-container {
	background:#fff;
	transition:color .3s, box-shadow .3s, background .3s, transform .3s;
	border-radius:24px;
	position:relative;
}

.full-height-card-container {
	border-radius:24px 24px 0 0;
}

.full-height-card-content {
	width:100%;
	height:calc(100% - 160px);
	overflow:hidden;
}

.full-height-card-content-nofooter {
	width:100%;
	height:calc(100% - 60px);
	overflow-y:scroll;
}

.full-height-card-footer {
	width:100%;
	height:100px;
	box-shadow:0 -4px 3px rgba(0,0,0,0.22);
}

.card-header {
	width:100%;
	height:66px;
}

.card-title,
.card-title-stats {
	font-size:18px;
	font-family:OutfitSB;
	padding:20px 25px;
}

.card-header-stats {
	width:100%;
	height:26px;
}

.card-list-item {
	border-top:1px solid #efefef;
	height:50px;
	width:100%;
}

/*header_start*/

.top-bar-separator {
	height:64px;
  	width:1px;
  	background:rgba(0, 0, 0, 0.12);
	float:left;
}

.right-top {
	float:right;
	height:64px;
	z-index:2;
}

.text-orders {
	z-index:1;
	position:relative;
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
	overflow:hidden;
	width:100%;
	height:100%;
	display:block;
}

/* order_end */

/* messages_start */
.no-msg-background {
	width:750px;
	height:600px;
	float:right;
	background:#fff;
	margin-top:50px;
}

.no-msg-text,
.index-no-msg-text {
	font-family:OutfitM;
	font-size:44px;
	color:rgba(200,200,200,0.8);
    text-align:center;
    padding-top:240px;
    text-shadow:1px 4px 6px #fff, 0 0 0 #000, 1px 4px 6px #fff;
}

.index-no-msg-text {
	padding-top:100px;
}

/* messages_end */

.main-header-cart-button .ripple-effect {
	background:rgba(255,255,255, 0.6);
	display:block;
	position:absolute;
	z-index:0;
	border-radius:50%;
	width:1px;
	height:1px;
	opacity:0;
}

.main-header-cart-button p {
	z-index:1;
	position:relative;
}

.profile-button {
	width:auto;
	float:left;
	height:52px;
	margin:6px 20px 6px 12px;
	transition:all .3s;
	z-index:1;
  	position:relative;
	overflow:hidden;
	border-radius:16px;
}

.notify-button {
	width:52px;
	float:left;
	margin-top:6px;
	border-radius:50%;
	position:relative;
	transition:all .3s;
}

.notify-button-icon {
	width:52px;
	height:52px;
	cursor:pointer;
	z-index:1;
	transition:all .3s;
	position:relative;
	overflow:hidden;
	border-radius:50%;
}

.notify-button-img, .profile-button-img {
	width:24px;
	height:24px;
	margin:14px;
	float:left;
}

.notify-button-img {
	background:url(/images/notification.png);
	background-size:cover;
}

.profile-button-img {
	background:url(/images/user-icon.png);
	background-size:cover;
}

.notify-panel {
	width:280px;
	background:#EFF6FF;
	box-shadow:0 3px 6px rgba(0,0,0,.16),0 3px 6px rgba(0,0,0,.23);
	position:absolute;
	z-index:100000000;
	top:48px;
	transition:all .2s, background .3s;
	left:-114px;
	overflow:hidden;
	border-radius:16px;
}

.notify-panel-collapsed {
	height:0px;
	padding:0 10px;
	transform:scale(0.2,0.2);
	opacity:0;
}

.notify-panel-expanded {
	height:250px;
	padding:10px;
	transform:scale(1,1);
	opacity:1;
}

.notify-panel-header {
	height:45px;
	width:100%;
	text-align:center;
	padding:10px;
	font-size:15px;
	border-bottom:1px solid #e4eaec;
}

.notify-panel-content {
	height:160px;
	width:100%;
	background:#E4F0F3;
	padding:10px;
	overflow-y:scroll;
}

.notify-panel-footer {
	height:45px;
	width:100%;
	text-align:center;
	padding:12px;
	font-size:13px;
	border-bottom:1px solid #e4eaec;
	border-top:1px solid #e4eaec;
}

.notify-panel-item {
	padding:4px;
	width:100%;
	margin-bottom:10px;
	height:50px;
	box-shadow:0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
	position:relative;
	background:#fff;
	font-size:13px;
	color:#444;
}

.profile-button-text {
	width:auto;
	height:48px;
	float:left;
	margin-right:20px;
	font-size:16px;
	font-family:OutfitSB;
	line-height:52px;
}

#profile-menu {
	transition:all .2s, background .3s;
	position:absolute;
	right:20px;
	z-index:100000002;
	top:54px;
	box-shadow:0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
  	background:#EFF6FF;
	overflow:hidden;
	width:250px;
	border-radius:16px;
}

.profile-menu-item {
	width:100%;
	height:48px;
	cursor:pointer;
	border-radius:4px;
	transition:all .3s;
	overflow:hidden;
	position:relative;
}

.profile-menu-item:hover {
	background:rgba(0,0,0,.08);
}

.profile-menu-item:active {
	background:rgba(0,0,0,.12);
}

.profile-menu-item-a {
	text-decoration:none;
	font-size:16px;
	color:#000;
	display:block;
	width:100%;
	height:100%;
	padding:0 20px 0 70px;
	cursor:pointer;
	overflow:hidden;
	line-height:48px;
}

.profile-menu-item i {
	position:absolute;
	top:10px;
	left:22px;
	font-size:26px;
}

.profile-button-active {
  background:#fff;
  box-shadow:0 -22px 20px rgba(0,0,0,0.22);
}

.profile-menu-collapsed {
	height:0px;
	padding:0 10px;
	transform:scale(0.2,0.2);
	opacity:0;
}

.profile-menu-expanded {
	height:200px;
	transform:scale(1,1);
	opacity:1;
	padding:8px 0;
}

.notify-button-icon:hover, .profile-button:hover {
	background:rgba(0, 0, 0, 0.08);
}

.notify-button-icon-active,
.notify-button-icon-active:hover {
	background:#fff;
	box-shadow:0 -14px 20px rgba(0,0,0,0.22);
}

.profile-button-active:hover {
	background:#fff;
}

.image-logo {
	width:370px;
	float:left;
	margin-top:10px;
}

.main-header-inner {
	width:1200px;
	height:135px;
	margin:64px auto 0;
	position:relative;
}

.main-header-logo {
	height:135px;
	position:relative;
	width:400px;
	float:left;
	margin-top:2px;
}

.mobile-logo {
	display:none;
}

.main-header-logo-image {
	position:relative;
	width:322px;
}

.top-bar-links {
	width:131px;
	height:64px;
	float:left;
}

.main-header-right {
	width:100%;
	max-width:450px;
	height:64px;
	float:left;
	position:relative;
}

.main-header-left {
	width:260px;
	height:64px;
	float:left;
	position:relative;
}

.main-header-search-outer {
	width:100%;
	height:64px;
	float:left;
	position:relative;
	margin-left:10px;
}

.main-header-search-form {
	width:100%;
	height:64px;
	padding-top:7px;
}

.main-header-search-bar {
	height:50px;
	width:calc(100% - 10px);
	background:#dfdfdf;
	float:left;
	border:0;
	font-size:14px;
	padding:7px 15px;
	color:#000;
	border-radius:25px;
	font-family:Outfit-M;
	transition:all .3s;
}

.main-header-search-bar::-webkit-input-placeholder,
.main-header-search-bar::-moz-placeholder,
.main-header-search-bar:-ms-input-placeholder {
	color:#999;
}

.main-header-search-submit {
	width:60px;
	height:50px;
	border:0;
	color:#999;
	font-size:22px;
	border-bottom:20px solid rgba(0,0,0,0);
	border-top:20px solid rgba(0,0,0,0);
	border-left:1px solid #999;
	transition:all .3s;
	position:absolute;
	right:10px;
}

.main-header-search-submit i {
	margin-top:-8px;
}

.main-header-search-submit:hover {
	color:#000;
}

.main-header-search-bar:focus {
	background:#fff;
	border-radius:6px;
	box-shadow:0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);

}

.main-header-cart-outer {
	width:260px;
	height:64px;
	float:left;
	margin-right:10px;
	position:relative;
}

.main-header-cart-button {
	margin-top:7px;
	height:50px;
	width:260px;
	background:#A00;
	color:white;
	overflow:hidden;
	position:absolute;
	transition:all .3s;
	border-radius:25px;
}

.main-header-cart-button:hover {
	background:#D00;
}

.main-header-cart-button i {
	margin-right:14px;
}

.main-header-cart-button p {
	height:50px;
	display:inline-block;
	line-height:50px;
	font-size:16px;
	font-family:Outfit;
	vertical-align:5px;
}

.main-header-cart-button p span {
	font-family:OutfitM;
}

/*header_end*/

#wrapper {
	width:100%;
	margin:0px auto;
	height:auto;
	position:relative;
}

/*left-sidebar-menu_start*/
.menu-left-sidebar {
	width:280px;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:10000;
	transition:background-color .3s, box-shadow .3s;
}

.menu-left-sidebar-logo {
	width:240px;
	margin:44px 20px 00px;
	transition:all .3s;
	height:90px;
	padding-top:4px;
}

.menu-left-sidebar-logo-img {
	width:220px;
	height:50px;
	background:url(/images/app_logo.png) no-repeat;
	background-size:100%;
	transition:all .3s;
	margin:0px 10px;
}

.menu-left-sidebar-inner {
	list-style:none;
	width:100%;
	height:calc(100% - 160px);
    transition:background .3s;
    padding-top:10px;
    border-radius:24px;
    overflow-y:auto;
    overflow-x:hidden;
}

.menu-left-sidebar-item {
	float:left;
	height:44px;
	position:relative;
	z-index:0;
	width:240px;
	margin:4px 20px;
	border-radius:22px;
	transition:all .3s;
}

.menu-left-sidebar-text {
	display:inline-block;
	vertical-align:6px;
	margin-left:15px;
	font-size:16px;
}

.menu-left-sidebar-item:hover {
	background:rgba(0,0,0,0.1);
}

.menu-left-sidebar-item-link {
	padding:11px 15px 0 20px;
	height:100%;
	display:block;
	text-decoration:none;
	color:#222;
	white-space:nowrap;
	transition:all .3s;
	position:relative;
	border-radius:inherit;
}

.menu-left-sidebar-item-link span {
	margin-top:-1px;
}

.menu-ripple {
	overflow:hidden;
	position:relative;
	width:100%;
	height:100%;
	z-index:1;
	position:absolute;
	top:0;
	left:0;
	border-radius:inherit;
}

.menu-left-sidebar-item-acitve {
	background:#002f6c;
}

.menu-left-sidebar-item-acitve.menu-left-sidebar-item-link {
	color:rgba(255,255,255,.8);
}

.menu-left-sidebar-item-acitve:hover {
	background:#005cb2;
}
/*left-sidebar-menu_end*/

.contact-box {
	position:absolute;
	width:80%;
	height:150px;
	bottom:0;
	left:10%;
	text-align:center;
	font-size:13px;
	line-height:27px;
	border-top:1px solid #cecece;
}

.contact-box-icon-mail {
	width:20px;
	height:20px;
	background:url('/images/mail.png');
	vertical-align:-6px;
	display:inline-block;
	background-size:100%;
}

.contact-box-icon-phone {
	width:20px;
	height:20px;
	background:url('/images/phone.png');
	vertical-align:-6px;
	display:inline-block;
}

.contact-box-header {
	font-family:Outfit;
	text-transform:uppercase;
	font-size:22px;
}

.contact-box-agent-name {
	font-size:15px;
	font-family:OutfitM;
}

/*top2_start*/

.main2-header {
	width:calc(100% - 250px);
	height:68px;
	position:fixed;
	z-index:999;
	top:0;
	right:0;
	transition:background-color .3s;
	background:#EEF6FF;
}

.top2-bar {
	width:100%;
	position:relative;
}

.top2-bar-inner {
	width:100%;
	height:64px;
	position:relative;
	display:flex;
	padding-top:4px;
}

/*top2-end*/


/*panel-index2_start*/

.main-content {
	width:calc(100% - 280px);
	margin-top:65px;
	z-index:1;
	position:relative;
	float:right;
	padding:0px 0px 30px;
}

.index-content {
	width:calc(100% - 280px);
	margin-top:65px;
	z-index:1;
	position:relative;
	float:right;
}

.full-height-main-content {
	width:calc(100% - 280px);
	margin-top:65px;
	z-index:1;
	position:relative;
	float:right;
}

.calendar-content {
	width:calc(100% - 280px);
	margin-top:65px;
	z-index:1;
	position:relative;
	float:right;
	height:calc(100vh - 65px);
    overflow-y:scroll;
}

.container {
	margin-right:auto;
	margin-left:auto;
	margin-top:16px;
}

.main-content .container {
	padding-right:30px;
 	padding-left:30px;
	margin-top:-100px;
}

.index-content .container {
	width:calc(100% - 330px);
	float:left;
}

.service-container {
	width:calc(100% - 330px);
	float:left;
	background:#fff;
	position: relative;
    border-radius: 24px 24px 0 0;
    float: left;
    overflow: hidden;
    margin-top: 16px;
	height:calc(100% - 82px);
	transition:background .3s;
}

.new-service-href {
	text-decoration:none;
	width:100%;
	height:100%;
	display:block;
	position:relative;
	z-index:1111111;
}

.card-row {
	height:240px;
	margin-bottom:25px;
	border-radius:24px;
	background:#fff;
}

.card {
	width:calc(25% - 6px);
	float:left;
	padding-left:24px;
	position:relative;
	height:130px;
	cursor:pointer;
}

.card a {
	text-decoration:none;
}

.card-mouse-shadow {
	box-shadow:0 0 120px 120px rgba(0,0,0, 0.12);
	width:1px;
	height:1px;
	border-radius:50%;
	position:absolute;
}

.card-inner {
	width:100%;
	height:100%;
	overflow:hidden;
	position:relative;
	transition:all .3s;
	color:#000;
}

.card-orders {
	background: #E0E7FF;
}

.card-prices {
	background: #FFEDD5;
}

.card-tasks-today {
	background: #DCFCE7;
}

.card-tasks-after {
	background: #FCE7F3;
}

.card-counter {
	font-family:OutfitSB;
	font-size:54px;
	line-height:54px;
	height:54px;
	width:100%;
	transition:color .3s;
	top:14px;
	left:20px;
	position:absolute;
}

.card-name {
	font-size:20px;
	width:100%;
	height:60px;
	line-height:22px;
	transition:color .3s;
	position:absolute;
	left:20px;
	top:84px;
	font-family:OutfitM;
}
/*panel-index2_end*/

.main-index-content {
	width:1200px;
	z-index:1;
	margin:0 auto;
	position:relative;
}


.main-myprinters-content {
	width:calc(100% - 280px);
	z-index:1;
	float:right;
	margin:100px auto;
	position:relative;
	transition:.2s -webkit-filter linear;
}

.orders {
	width:calc(100% - 400px);
	height:calc(100vh - 346px);
	background:#fff;
	float:left;
}

#history-orders {
	width:calc(100% - 30px);
	height:calc(100vh - 185px);
	border-radius:16px 16px 0 0
}

.orders-container {
	overflow-y:scroll;
	height:calc(100% - 40px);
}

.services {
	width:calc(100% - 30px);
	height:calc(100vh - 316px);
	background:#fff;
	float:left;
	transition:background-color .3s;
}

.order-products {
	margin-top:16px;
	width:calc(100% - 330px);
	height:calc(100vh - 82px);
	overflow:hidden;
	position:relative;
	background:#fff;
}

.agent-select-outer {
	width:250px;
	height:60px;
	right:50px;
	top:35px;
	position:absolute;
}

.agent-select {
	width:180px;
	height:46px;
	position:relative;
	background:none;
	border-radius:4px;
	border:1px solid #000;
	color:#000;
	font-size:16px;
	cursor:pointer;
	margin-left:16px;
	margin-top:10px;
	padding:0 6px;
	position:relative;
}


.agent-select option {
	cursor:pointer;
	font-size:16px;
	font-family:Outfit;
	color:#000;
}

.agent-select-label {
	font-size:12px;
	color:#000;
	background:rgb(245,245,245);
	height:17px;
	top:0px;
	position:absolute;
	left:22px;
	padding:0 6px;
}

.orders-header2 {
	width:100%;
	height:180px;
}

.order-info {
	width:100%;
}

.orders-header-title {
	font-size:18px;
	height:50px;
	padding:24px;
	color:#000;
	font-family:OutfitSB;
	transition:color .3s;
}

.orders-cards {
	list-style:none;
	width:100%;
	height:50px;
	background:#efefef;
	transition:background-color .3s;
}

.home-orders,
.order-card,
.orders-card {
	height:50px;
	float:left;
	line-height:50px;
	font-size:14px;
	font-family:OutfitM;
	text-align:center;
	cursor:pointer;
	position:relative;
	overflow:hidden;
	transition:all .3s;
}

.orders-card {
	padding:0 30px;
	border-bottom:3px solid transparent;
}

.home-orders:hover,
.order-card:hover,
.orders-card:hover {
	background:rgba(0,0,0,0.08);
}

.home-orders:active,
.order-card:active,
.orders-card:active {
	background:rgba(0,0,0,0.12);
}

.orders-card-active {
	color:#003c8f;
	border-bottom:3px solid #003c8f;
}

.text-orders::-moz-selection { /* Code for Firefox */
     background:0;
}

.text-orders::selection {
    background:0;
}

.ripple-effect {
	background:rgba(0,0,0,.16);
	display:block;
	position:absolute;
	z-index:2;
	border-radius:50%;
	width:1px;
	height:1px;
	opacity:0;
	transform:scale(1.15,1.15);
	animation:ripple-show .3s ease-out;
}

.ripple-light,
.menu-left-sidebar-item-acitve .ripple-effect {
	background:rgba(255,255,255,.4);
	display:block;
	position:absolute;
	z-index:0;
	border-radius:50%;
	opacity:0;
	transform:scale(1.15,1.15);
	animation:ripple-show .3s ease-out;
}

@keyframes ripple-show {
	0% {
		transform:scale(0,0);
	}
}

.service-date,
.service-client {
	float:left;
}

.service-date {
	width:210px;
	text-align:center;
}

.service-client {
	width:calc(100% - 420px);
	height:100%;
}

.state-inactive, .state-0, .state-1, .state-2, .state-3, .state-9, .state-6, .state-7, .state-4, .state-none {
	margin:-3px 20px 0 0;
	padding:4px;
}

.state-inactive-small {
	filter:grayscale(1);
	opacity:0.3;
	transition:all .3s;
	width:0;
	overflow:hidden;
}

.order-item-hover {
	width:68px;
}

.state-inactive-small .order-state-small {
	width:20px;
	height:20px;
	line-height:20px;
	margin:-4px auto 0;
	border-radius:50%;
	font-size:12px;
}

.order-state-small-item {
	padding-top:14px;
}

.order-state-small-item:not(.state-inactive-small) {
	width:68px;
	padding-top:20px;
}

.state-inactive-small:hover .order-state-small {
	width:24px;
	height:24px;
	line-height:24px;
	margin:-5px auto 0;
}

.state-inactive-small .order-state-small-title {
	font-size:8px;
	font-family:OutfitM;
	height:20px;
	color:#000;
	line-height:20px;
	transition:font-size .3s;
	margin-top:0;
}
.state-inactive-small:not(:disabled):hover .order-state-small-title {
	font-size:10px;
}

.state-inactive-small:not(:disabled):hover {
	filter:grayscale(0);
	opacity:1;
}

.state-0-big, .state-0-small .order-state-small, .state-0 {
	background:#c8a415;
	color:#fff;
	transition:all .2s;
}

.state-1-big, .state-1-small .order-state-small, .state-1 {
	background:#00b8d4;
	color:#fff;
	transition:all .2s;
}

.state-2-big, .state-2-small .order-state-small, .state-2 {
	background:#1976d2;
	color:#fff;
	transition:all .2s;
}

.state-3-big, .state-3-small .order-state-small, .state-3 {
	background:#388E3C;
	color:#fff;
	transition:all .2s;
}

.state-4-big, .state-4-small .order-state-small, .state-4 {
	background:#b53d00;
	color:#fff;
	transition:all .2s;
}

.state-6-big, .state-6-small .order-state-small, .state-6 {
	background:#00838f;
	color:#fff;
	transition:all .2s;
}

.state-7-big, .state-7-small .order-state-small, .state-7 {
	background:#5d4037;
	color:#fff;
	transition:all .2s;
}

.state-9-big, .state-9-small .order-state-small, .state-9 {
	background:#8e8e8e;
	color:#fff;
	transition:all .2s;
}

.state-inactive-big, .state-inactive {
	background:#E0E0E0;
	color:#fff;
	transition:all .2s;
}


.order-main-u {
	margin:15px 20px 0 0;
	padding:0;
	height:24px;
	line-height:24px;
}

.state-none {
	background:#000;
}

.state-dot {
	width:12px;
	height:12px;
	border-radius:50%;
	top:20px;
	left:35px;
	position:absolute;
}

.state-counter {
	border-radius:14px;
	text-align:center;
	width:28px;
	height:28px;
	padding-top:5px;
	top:10px;
	position:absolute;
	right:-6px;
	font-size:13px;
	transition:all .3s;
	font-family:OutfitM;
	z-index:3;
}

.state-counter:after {
	content:'';
	position:absolute;
	top:0;
	left:0;
	background:#c8a415;
	width:28px;
	height:28px;
	border-radius:50%;
	animation:new-counter 2.4s infinite ease-out;
	z-index:-1;
	opacity:0.8;
	transition:height .3s, width .3s;
}

@keyframes new-counter {
	0% {transform:scale(1,1);opacity:1;}
	30% {transform:scale(2,2);opacity:0;}
	100% {transform:scale(2,2);opacity:0;}
}

.order-history {
	height:100px;
	position:relative;
	margin:0px auto;
	text-align:center;
	width:1000px;
}

.order-history-item {
	float:left;
	width:250px;
}

.order-history-state-icon {
	width:20px;
	height:20px;
	margin-left:115px;
	border-radius:50%;
	line-height:20px;
	color:#fff;
	font-size:13px;
	font-family:OutfitM;
}

.order-history-state-title {
	height:24px;
}

.order-history-state {
	position:relative;
}

.order-history-divider {
	width:200px;
	height:2px;
	position:absolute;
	top:34px;
	left:150px;
}

.active .order-history-state-icon {
	background:#1976d2;
}

.active .order-history-state-text,
.finish .order-history-state-text {
	font-size:14px;
	font-family:OutfitSB;
}

.active .order-history-state-title,
.finish .order-history-state-title {
	font-size:16px;
	font-family:OutfitSB;
}

.active .order-history-state-date,
.finish .order-history-state-date {
	font-size:14px;
}

.active .order-history-divider {
	background:#afafaf;
}

.complete .order-history-state-icon,
.finish .order-history-state-icon {
	background:url("/images/complete_white.svg") #1976d2;
	background-size:100%;
	font-size:0;
}

.complete .order-history-state-text {
	font-size:0px;
}

.complete .order-history-state-title {
	font-size:12px;
	font-family:Outfit;
	line-height:28px;
}

.complete .order-history-state-date {
	font-size:12px;
}

.complete .order-history-divider {
	background:#1976d2;
}

.inactive .order-history-state-icon {
	background:#afafaf;
}

.inactive .order-history-state-text {
	font-size:0px;
}

.inactive .order-history-state-title {
	font-size:12px;
	color:#afafaf;
	font-family:OutfitM;
}

.inactive .order-history-state-date {
	font-size:0;
}

.inactive .order-history-divider { 
	background:#afafaf;
}

.date-time {
	height:400px;
	margin-left:50px;
	width:350px;
	background:#fff;
	float:left;
	position:relative;
	transition:background-color .3s, color .3s;
}

.names-day {
	margin-top:10px;
	font-size:14px;
	line-height:22px;
	width:94%;
	margin-left:3%;
	height:94px;
}

.megaton-names-day {
	font-family:OutfitSB;
}

.topics {
	width:calc(100% - 490px);
	float:right;
	height:350px;
	background:#fff;
	margin-top:50px;
	margin-bottom:50px;
	transition:background-color .3s;
	opacity:0.2;
}

.fast-order {
	width:375px;
	float:left;
	margin-left:25px;
	height:calc(100vh - 346px);
	background:#fff;
	transition:background-color .3s;
}

.small-header {
	height:72px;
	width:100%;
}

.small-header-title {
	font-size:18px;
	height:50px;
	padding:24px;
	color:#000;
	transition:color .3s;
	font-family:OutfitSB;
}

.page-header {
	width:100%;
	height:0;
	margin:0;
	transition:background .3s;
}



.page-slim-header {
	width:100%;
	height:120px;
	background:#002f6c;
	margin:0;
}

.page-header-title {
	height:100%;
	width:100%;
	padding:37px 35px;
	color:white;
	font-size:28px;
}

.main-header-title {
	height:86px;
	width:100%;
	padding:24px;
	color:#000;
	font-size:28px;
	float:left;
	font-family:OutfitM;
}

.weather-box {
	width:500px;
	height:100px;
	float:right;
}

.page-header-search-form {
	width:500px;
	border-bottom:1px solid #afafaf;
	height:50px;
	position:absolute;
	top:30px;
	left:calc(50% - 250px);
}

.page-header-search-form:focus-within {
	border-bottom:1px solid #fff;
}

.page-header-search-form-btn {
	width:50px;
	height:50px;
	border:0;
	transition:all .3s;
	position:relative;
	right:10px;
	float:left;
}

.page-header-search-form i {
	color:#afafaf;
	font-size:22px;
	position:relative;
	margin-top:-8px;
}

.page-header-search-form-input {
	width:calc(100% - 50px);
	height:100%;
	position:relative;
	background:none;
	border:none;
	color:#fff;
	font-size:20px;
}

.page-header-search-form-input:focus + .page-header-search-form {
	color:#fff;
}

.search-results-full {
	height:calc(100vh - 405px);
	overflow-y:scroll;
}

#time {
	text-align:center;
	width:100%;
	height:100%;
	position:relative;
}

.today-is {
	font-weight:normal;
	font-family:Outfit;
	font-size:20px;
	margin-bottom:15px;
	position:relative;
}

.date-time-week-day {
	font-size:25px;
	height:25px;
	position:relative;
}

.date-time-month-day {
	font-size:76px;
	height:95px;
	position:relative;
}

.date-time-month {
	display:inline;
	font-size:20px;
	position:relative;
}

.date-time-year {
	display:inline;
	font-size:20px;
	position:relative;
}

#hour {
	font-size:48px;
	height:70px;
	width:100%;
	position:absolute;
	text-align:center;
	z-index:1;
	transition:color .3s;
	color:#000;
}

.hour-bg {
	height:70px;
	width:100%;
	padding-top:6px;
	background:#ddd;
	transition:background-color .3s;
}

#hour-floor {
	font-size:48px;
	height:70px;
	color:#cacaca;
	width:100%;
	text-align:center;
	z-index:0;
	position:absolute;
	transition:color .3s;
}

.order-href {
	color:black;
	text-decoration:none;
	transition:color .3s;
	position:relative;
	z-index:4;
}

.order-details .order-details-item {
	list-style:none;
	float:left;
	font-size:14px;
	font-family:OutfitSB;
	color:#9f9f9f;
}

.order-details-product .order-details-item {
	list-style:none;
	float:left;
	font-size:15px;
}

.order-view-details-products {
	width:100%;
	height:calc(100% - 470px);
	overflow-y:scroll;
	scrollbar-gutter:stable;
    width:calc(100% - 48px);
    margin:0 24px;
	background: /* Shadow covers */ linear-gradient(white 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), white 70%) 0 100%, /* Shadows */ radial-gradient(50% 0, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(50% 100%, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
	background: linear-gradient(white 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), white 70%) 0 100%, radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
	background-repeat: no-repeat;
	background-color: white;
	background-size: 100% 40px, 100% 0px, 100% 14px, 0% 1px;
	background-attachment: local, local, scroll, scroll;
}

.order-details {
  	background:#fff;
  	height:48px;
	clear:both;
	transition:color .3s, background .3s;
	width:calc(100% - 48px);
	margin:0 24px;
}

.order-details-product {
	height:52px;
	border-bottom:1px solid #dfdfdf;
	color:#000;
	transition:all .3s;
	line-height:52px;
}

.order-details-product:hover {
	background:rgba(0, 0, 0, 0.08);
}

.order-details-product:active {
	background:rgba(0, 0, 0, 0.12);
}

.sum-box .order-details-item {
	font-size:18px;
	font-family:OutfitSB;
}

.order-details-item-product {
	width:calc(100% - 670px);
	overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
	padding-left:6px;
}

.order-details-item-quantity {
	width:80px;
	text-align:right;
	float:left;
}

.order-details-item-price-notax,
.order-details-item-price-tax {
	width:140px;
	text-align:right;
}

.order-details-item-value-notax {
	width:130px;
	text-align:right;
	float:left;
}

.order-details-item-value-tax {
	width:130px;
	text-align:right;
	float:left;
	padding-right:6px;
}

.order-details-item-tax {
	width:40px;
	padding-left:50px;
	text-align:center;
}

.orders-title-order-datetime {
	font-size:16px;
	font-family:OutfitM;
}

.sum-box {
	width:100%;
	height:80px;
	padding:16px 0 0 0;
	bottom:0;
	position:absolute;
	right:0;
	transition:all .3s;
	background:#fff;
	box-shadow:0 -3px 3px rgba(0,0,0,0.12);
}

.sum-box-inner {
	width:460px;
	height:58px;
	float:right;
}

.main-orders-footer {
	text-align:center;
	padding:10px 0 0 ;
}

.go-to-all-orders {
	text-decoration:none;
	padding:8px;
	font-size:16px;
	color:#24b1ec;
	transition:all .2s;
	border-radius:4px;
}

.go-to-all-orders:hover {
	background:rgba(100,100,255,0.1);
}

.go-to-all-orders:active {
	background:rgba(100,100,255,0.2);
}

.no-bg {
	background:#002171;
}

#login {
	top:160px;
	left:calc(50% - 260px);
	width:320px;
	height:500px;
	background:#fff;
	box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.3), 0px 24px 38px 3px rgba(0, 0, 0, 0.24), 0px 9px 46px 8px rgba(0, 0, 0, 0.22);
	border:0;
	position:relative;
	overflow:hidden;
	border-radius:4px;
	animation:login-box-show .6s .2s forwards;
	z-index:1;
	position:absolute;
	border-top:10px solid #1976d2;
	border-bottom:10px solid #1976d2;
	top:380px;
	height:20px;
}

.login-form-bg {
	height:280px;
	width:600px;
	background:#0d47a1;
	position:absolute;
	top:260px;
	z-index:0;
	left:calc(50% - 300px);
}

@keyframes login-box-show {
	100% {
		top:160px;
		height:500px;
	}
}

.login-logo {
	width:140px;
	height:140px;
	position:absolute;
	right:40px;
	animation:login-logo-show .4s .4s forwards;
	opacity:0;
	top:100px;
	filter:drop-shadow(0px 0px 20px black);
}

@keyframes login-logo-show {
	100% {
		top:60px;
		opacity:1;
	}
}

.logout-confirm-outer {
	width:100%;
	height:100%;
	background:#4cbf60;
	position:absolute;
	left:0;
	z-index:1;
	transition:all 1s;
}

.logout-confirm-image {
	border-radius:50%;
	background:#40a653;
	margin-left:125px;
	margin-top:30px;
	width:200px;
	height:200px;
}

.logout-confirm-text {
  	color:white;
  	font-size:30px;
	text-align:center;
	font-family:OutfitM;
	padding:40px;
}

#log-again {
	width:100%;
	height:60px;
	border:0;
	bottom:0;
	position:absolute;
	background:#282828;
	color:#fff;
	text-align:center;
	font-size:18px;
	font-family:OutfitM;
	transition:all .2s;
}

#log-again:hover {
	background:#484848;
}

#log-again:active {
	background:#686868;
}

.logout-confirm-outer-in {
	top:0;
}

.logout-confirm-outer-out {
	top:-100%;
}

#register {
	margin:20px auto 0;
	width:500px;
	height:620px;
	background:#fafafa;
	box-shadow:0 2px 7px rgba(0,0,0,0.4);
	border:0;
}

.login-banner {
	height:130px;
	width:320px;
	margin:0px auto;
	text-align:center;
	animation:opacity-show 1s .6s forwards;
	opacity:0;
}

@keyframes opacity-show {
	100% {
		opacity:1;
	}
}

.login-user-icon {
	height:170px;
	width:170px;
	margin-top:20px;
}

#login-inner {
	padding:30px;
	margin-top:50px;
	animation:opacity-show 1s .6s forwards;
	opacity:0;
}

.single-input {
	position:relative;
	height:45px;
	margin-bottom:45px;
}

.login-input {
	font-size:17px;
	display:block;
	width:100%;
	height:45px;
	background:0;
	border:1px solid #8f8f8f;
	border-radius:4px;
	color:#000;
	position:absolute;
	bottom:0;
	padding:0 10px;
	font-family:OutfitM;
	transition:border .15s;
	color:#002f6c
}

.login-label {
	color:#666;
	font-size:18px;
	background:0;
	position:absolute;
	transition:all .15s;
	top:8px;
	left:8px;
	padding:0 3px;
	font-family:Outfit;
}

.login-input:focus,
.login-input:valid {
	border:2px solid #00c;
}

.login-input:focus ~ .login-label,
.login-input:valid ~ .login-label {
	font-size:12px;
	color:#00c;
	top:-11px;
	font-family:OutfitM;
	background:#fff;
}

.login-buttons-row {
	width:100%;
	height:60px;
}

#login-submit {
	background:#002171;
	color:#fff;
	width:100%;
	height:50px;
	border:0;
	font-size:16px;
	margin-top:50px;
	border-radius:4px;
	transition:all .3s;
	font-family:OutfitM;
	position:relative;
	overflow:hidden;
	box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.2),
    0px 2px 2px 0px rgba(0, 0, 0, 0.14),
    0px 3px 1px -2px rgba(0, 0, 0, 0.12); 
}

#login-submit:hover {
	background:#004ba0;
	box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2),
    0px 8px 10px 1px rgba(0, 0, 0, 0.14),
    0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}

.maps-list-link {
	display:block;
	float:left;
	height:60px;
	padding-top:20px;
	width:180px;
	color:#fff;
	background:#228;
	text-align:center;
	text-decoration:none;
	font-size:16px;
}

.maps-list-link:hover {
	background:#006;
}

.maps-list-link:active,
.maps-list-link:active i{
	background:#ccc;
	color:#000;
}

.maps-list-link i {
	background:#006;
	color:#fff;
	float:left;
	height:60px;
	margin-top:-21px;
	font-size:24px;
	width:60px;
	line-height:60px;
}

.login-log {
	margin-top:16px;
}

.register-no-form {
	margin-right:154px;
	width:180px;
}

.message {
	width:530px;
	height:343px;
	background:#EBB03C;
	padding:20px;
	margin:50px auto 0;
	position:relative;
	text-align:center;
	border:15px solid #202020;
}

.message-text {
	font-weight:bold;
	font-size:22px;
}

#message-i {
	color:#373737;
	font-size:90px;
}

.confirm-option-one {
	margin-right:20px;
}



.maps-container-footer {
	padding:0 30px;
}





@media all and (max-width:1544px) {
	.date-time {
		margin-top:50px;
		height:350px;
		margin-right:50px;
		margin-left:0px;
	}

	.orders {
		width:65%;
	}

	.date-time-month-day {
		height:76px;
	}

	#hour {
		margin-top:0;
	}

	.fast-order {
		width:calc(35% - 25px);
	}

	.topics {
		width:100%;
	}

	.order-place {
		width:calc(100% - 530px);
	}

	.fast-order-product-name {
		width:calc(100% - 140px);
	}

	.card-name {
		font-size:1.5vw;
	}

	.orders-card {
		padding:0 3%;
	}
}

.dark-mode-check,
.fav-check {
	display:none;
}

.fav-check-label {
	display:block;
	width:100%;
	height:100%;
	padding-left:60px;
	line-height:50px;
	z-index:5;
	position:relative;
	cursor:pointer;
}

.fav-check-visual {
	display:block;
	position:absolute;
	top:0;
	left:20px;
}

.fav-check-visual:before {
	font-family:'Material Icons Outlined';
    content:"favorite";
	color:#4caf50;
	font-size:24px;
	position:absolute;
	opacity:0;
	transition:opacity .3s;
}

.fav-check-visual:after {
	font-family:'Material Icons Outlined';
    content:"favorite_border";
	font-size:24px;
	position:absolute;
	opacity:1;
	transition:opacity .3s;
}

.fav-check:checked ~ .fav-check-visual:before {
	opacity:1;
}

.fav-check:checked ~ .fav-check-visual:after {
	opacity:0;
}


.dark-mode-check-visual {
	width:52px;
	height:32px;
	background:rgba(0,0,0,0.14);
	position:absolute;
	display:block;
	border-radius:15px;
	top:8px;
	left:10px;
	border:2px solid #519657;
	transition:all .2s;
}

.dark-mode .dark-mode-check-visual {
	background:rgba(255,255,255,0.14);
}

.dark-mode-check ~ .dark-mode-check-visual:after {
	content:'';
	width:16px;
	height:16px;
	border-radius:50%;
	background:#519657;
	position:absolute;
	top:6px;
	left:6px;
	transition:all .2s;
}

.dark-mode-check:checked ~ .dark-mode-check-visual:after {
 	left:23px;
	width:22px;
	height:22px;
	top:3px;
	background:#fff;
}

.dark-mode-check:checked ~ .dark-mode-check-visual {
	background:#087f23;
	border:2px solid #087f23;
}
/*setttings_page_START*/

.account-settings {
	width:100%;
	height:auto;
	min-height:200px;
	background:#fff;
	float:left;
}

.account-settings-column {
	width:50%;
	height:auto;
	padding:30px;
	float:left;
	position:relative;
}

.account-settings-column-header {
	width:100%;
	height:40px;
	border-bottom:1px solid #000;
	position:relative;
}

.account-settings-column-title {
	font-size:16px;
	font-family:OutfitSB;
}

.account-settings-item {
	height:50px;
	padding-top:18px;
	float:left;
	width:100%;
	position:relative;
}

.account-settings-item-description {
	width:40%;
	height:100%;
	float:left;
	font-size:16px;
	position:relative;
}

.account-settings-item-value {
	width:60%;
	height:100%;
	float:left;
	padding-top:4px;
	position:relative;
}

.account-settings-item-value .account-settings-input-text {
	width:300px;
	height:40px;
	background:#dedede;
	color:#222;
	padding:8px;
	border:0;
	border-radius:4px;
	margin-top:-8px;
	font-size:14px;
	font-family:OutfitM;
	transition:all .3s;
}

.account-settings-input-text:focus {
	background:#fafafa;
	box-shadow:0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
}
/*setttings_page_END*/

/*services_page_START*/


.btn-icon {
	font-size:34px;
}

.btn-text {
	vertical-align:7px;
	font-size:14px;
	margin-left:8px;
	font-family:OutfitM;
}

.small-box {
	position:fixed;
	left:50px;
	height:46px;
	width:240px;
	background:#1b5e20;
	color:#fff;
	z-index:1111111111;
	text-align:center;
	padding:12px;
	border-radius:8px;
	font-family:"OutfitM";
	font-size:14px;
	box-shadow:	0px 11px 15px -7px rgba(0, 0, 0, 0.2),
    0px 24px 38px 3px rgba(0, 0, 0, 0.14),
	0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}

.small-box-visible {
	animation:small-box-show 5s;
	bottom:-50px;
	transform:scale(0.1, 0.8);
}

@keyframes small-box-show {
	4% {transform:scale(1.2);bottom:120px;}
	6% {transform:scale(1);	bottom:100px;}
	85% {transform:scale(1);bottom:100px;}
	92% {transform:scale(0.1,0.8);bottom:-70px;	}
}

.small-box-warning {
	position:fixed;
	left:50px;
	height:46px;
	width:320px;
	background:#b71c1c;
	color:#fff;
	z-index:1111111111;
	text-align:center;
	padding:12px;
	border-radius:8px;
	font-family:"OutfitM";
	font-size:14px;
	box-shadow:	0px 11px 15px -7px rgba(0, 0, 0, 0.2),
    0px 24px 38px 3px rgba(0, 0, 0, 0.14),
	0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}
/*services_page_END*/


.button-icon {
	height:24px;
	width:24px;
	display:inline-block;
	margin-top:3px;
} 

.icon-left-arrow {
	background:url(/images/arrow_back-24.svg);
}

.icon-save {
	background:url(/images/save-24.svg);
	filter:invert(1) opacity(.8);
	transition:all .3s;
}

.button-text {
	font-size:15px;
	vertical-align:7px;
	line-height:44px;
	padding:0 4px 0 8px;
}

.full-width-page-header-title {
	height:100%;
	width:350px;
	padding:37px 35px;
	font-size:28px;
	font-family:Outfit;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	float:left;
}

.backwards-link-full-width-header {
	height:20px;
	line-height:20px;
	font-size:15px;
	text-decoration:none;
	display:block;
	position:absolute;
	top:90px;
	left:25px;
	animation:text-opacity-translate .4s;
}

@keyframes text-scale {
	from {transform:scale(0,0);}
	to {transform:scale(1,1);}
}

@keyframes text-opacity-translate {
	0% {opacity:0; transform:translateX(30px);}
	100% {opacity:1; transform:translateX(0px);}

}

@keyframes text-opacity {
	0% {opacity:0;}
	100% {opacity:1;}

}

.backwards-link-full-width-header i {
	font-size:20px;
}

.backwards-link-span {
	vertical-align:5px;
	padding-left:8px;
	font-family:OutfitSB;
}

.full-width-container-agent-box {
	position:absolute;
	top:0;
	right:334px;
	width:auto;
	height:56px;
}

.full-width-container-agent-label {
	position:relative;
	font-size:12px;
	font-family:OutfitM;
	top:-17px;
	left:56px;
	z-index:2;
}

.full-width-container-user-label {
	position:absolute;
	font-size:12px;
	font-family:OutfitM;
	top:1px;
	right:134px;
	z-index:2;
}

.full-width-container-state-label {
	position:relative;
	font-size:12px;
	font-family:OutfitM;
	top:-17px;
	left:42px;
	z-index:2;
}

.full-width-container-agent-select {
	height:48px;
	width:200px;
	border:0;
	font-size:16px;
	position:relative;
	top:5px;
	background:#fff;
	transition:background .3s, color .3s;
	border-left:1px solid #afafaf;
	padding-top:3px;
}

.full-width-container-agent-select option {
	height:44px;
}

.full-width-container-select-box {
	z-index:1;
	height:54px;
	min-width:160px;
	max-width:160px;
	overflow:hidden;
	float:left;
	position:relative;
	margin-right:20px;
}

.full-width-container-select-lower {
	height:54px;
	width:180px;
	position:absolute;
	top:680px;
	left:35px;
	overflow:hidden;
}

.full-width-container-select {
	height:52px;
	border-radius:4px;
	border:none;
	width:100%;
	font-size:16px;
	position:relative;
	padding:16px 6px 0 6px;
	cursor:pointer;
	transition:color .3s, background .3s;
	background:#F1F5F9;
	color:#1f1f1f;
}

.full-width-container-select-label {
	position:absolute;
	top:2px;
	left:8px;
	padding:0 4px;
	background:none;
	font-size:13px;
	color:#7f7f7f;
	font-family:OutfitSB;
	z-index:1;
}

.full-width-container-search {
	height:90px;
	width:calc(100% - 300px);
	float:right;
	padding:30px 24px 0 0;
	display:flex;
}

.full-width-container-search-calendar {
	margin-top:-170px;
	height:56px;
	width:calc(100% - 250px);
	float:left;
	margin-left:250px;
	position:absolute;
}

.full-width-container-search-bar {
	background: #EEF6FF;
	border:0;
	width:100%;
	height:48px;
	border-radius:24px;
	padding:0 20px;
	font-size:16px;
	transition:all .3s;
}	

.full-width-container-search-bar:focus {
	background:#DBEAFE;
	box-shadow:0px 2px 6px 2px #00000026,  0px 1px 2px 0px #0000004D;
}

.full-width-container {
    float:left;
    width:calc(100% - 330px);
    position:relative;
}

.max-width-container {
	margin-top:-60px;
    float:left;
    width:100%;
    position:relative;
}

.full-width-container-side-nav {
	width:250px;
	height:calc(100vh - 450px);
	position:relative;
	float:left;
}

/*complaint_page_START */
.complaint-card {
	width:100%;
	height:calc(100vh - 82px);
	position:relative;
	background:#fff;
	border-radius:24px 24px 0 0;
	float:left;
	overflow:hidden;
	margin-top:16px;
	transition:background .3s;
}

.complaint-card-head {
	width:100%;
	height:100px;
	position:relative;
}

.complaint-card-header {
	width:100%;
	height:50px;
	position:relative;
	background:#eaeaea;
}

.full-width-container-side-nav-title {
	width:230px;
	float:left;
	line-height:50px;
	height:50px;
	color:#4f4f4f;
	font-size:16px;
	padding:0 20px;
	font-family:OutfitSB;
}

.full-width-container-side-nav-item {
	width:230px;
	height:44px;
	line-height:44px;
	font-family:OutfitM;
	font-size:14px;
	transition:all .3s;
	cursor:pointer;
	border-radius:0 25px 25px 0;
	padding:0 60px;
	position:relative;
	overflow:hidden;
}

.full-width-container-side-nav-item:hover {
	background:#e3e3e3;
}

.active-side-nav, .active-side-nav:hover {
	background:#cfcfcf;
}

.scroll-container {
	height:calc(100% - 160px);
	width:calc(100% - 48px);
	overflow-y: scroll;
	position: relative;
	margin:0 24px;
}

.loading-status {
	display:block;
	width:100%;
	height:100px;
	padding-top:110px;
	font-size:40px;
	text-align:center;
}

.loading-status-addresses {
	display:block;
	width:100%;
	height:100px;
	padding-top:30px;
	font-size:30px;
	text-align:center;
}

.loading-status-overlay {
	display:block;
	width:100%;
	background:rgba(0,0,0,0.4);
	height:100px;
	line-height:100px;
	margin-top:350px;
	font-size:40px;
	text-align:center;
	color:#fff;
	animation:scaled-show .3s;
}

@keyframes scaled-show {
	0% {transform:scale(1,0)}
	100% {transform:scale(1,1)}
}

.add-full-width-container {
	height:56px;
	width:180px;
	border:0;
	background:#002f6c;
	transition:all .3s;
	font-size:14px;
	overflow:hidden;
	border-radius:16px;
	top:28px;
	left:24px;
	position:absolute;
}

.page-title {
	height:56px;
	width:250px;
	top:40px;
	left:24px;
	font-size:24px;
	position:absolute;
}

.customer-title {
	height:56px;
	width:calc(100% - 140px);
	top:26px;
	left:24px;
	font-size:24px;
	position:absolute;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	padding-top:14px;
}

.action-form-header {
	height:60px;
	width:100%;
	position:relative;
	background:#002f6c;
	text-align:center;
	line-height:60px;
	font-size:18px;
	color:rgba(255,255,255,0.8);
}


.action-form-footer {
	height:70px;
	width:100%;
	position:relative;
	padding:10px 25px;
	background:#f3f6fc;
	transition:background .3s;
}

.complaint-edit-footer {
	height:70px;
	width:100%;
	position:relative;
	padding:10px 0;
}

.add-full-width-container:hover {
	background:#005cb2;
}

.titles-outer {
	width:100%;
	height:58px;
	scrollbar-gutter: stable;
    overflow: hidden;
}

.small-titles-outer {
	width:100%;
	height:48px;
	scrollbar-gutter: stable;
    overflow: hidden;
	border-bottom:2px solid #dfdfdf;
	line-height:48px;
}

.tiny-titles-outer {
	width:100%;
	height:36px;
	padding-right:100px;
	scrollbar-gutter: stable;
    overflow: hidden;
	border-bottom:2px solid #dfdfdf;
}

.tiny-header-outer {
	width:100%;
	background:#EEF6FF;
	height:36px;
}

.complaint-card-header-titles {
	width:calc(100% - 48px);
    margin:0 24px;
	height:60px;
	font-size:14px;
	line-height:60px;
	color:#94A3B8;
	transition:background .3s, color .3s, border .3s;
    overflow: auto;
	border-bottom: 2px solid #E2E8F0;
}


.complaint-title-id,
.complaint-title-number,
.complaint-title-state,
.complaint-title-product,
.complaint-title-customer,
.complaint-title-date {
	height:100%;
	float:left;
	font-family:OutfitSB;
}


.complaint-title-id {
	width:40px;
	text-align:right;
}

.complaint-title-number {
	width:110px;
	text-align:right;
}

.complaint-title-state {
	width:82px;
	margin:0 20px;
	text-align:center;
}

.complaint-title-product {
	width:calc(50% - 222px);
}

.complaint-title-customer {
	width:calc(50% - 180px);
}

.complaint-title-date {
	width:120px;
}

.complaint-item {
	width:100%;
	height:54px;
	position:relative;
	animation-name:animateIn;
	animation-duration:200ms;
	animation-delay:calc(var(--animation-order) * 30ms);
	animation-fill-mode:both;
	animation-timing-function:ease-in-out;
	border-bottom:1px solid #E2E8F0;
	transition:height .3s, background .3s, border .3s;
}

.complaint-content {
	width:100%;
	height:53px;
	background:#fff;
	transition:all .3s;
	cursor:pointer;
	position:absolute;
	z-index:1;
}

.complaint-content .complaint-row {
	height:53px;
	overflow:hidden;
	width:100%;
	position:absolute;
	z-index:1;
	transition:opacity .3s;
	opacity:1;
}

.complaint-content:after {
	content:'';
	width:100%;
	height:100%;
	position:absolute;
	z-index:0;
	box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.2),
    0px 2px 2px 0px rgba(0, 0, 0, 0.14),
    0px 3px 1px -2px rgba(0, 0, 0, 0.12);
	opacity:0;
	transition:opacity .3s;
	left:0;
	top:0;
	border-radius:22px;
}

.complaint-content-expanded:after {
	opacity:1;
}

.complaint-content-expanded {
	margin:20px;
	width:calc(100% - 40px);
	height:410px;
	border-radius:22px;
	padding:0 20px;
	cursor:unset;
	background:#f3f6fc;
}

.complaint-item-expanded {
	height:450px;
}

.complaint-content-expanded .complaint-row {
	height:0;
	opacity:0;
}

.complaint-details {
	height:0;
	width:calc(100% - 40px);
	opacity:0;
	transition:opacity .3s;
	overflow:hidden;
}

.complaint-content-expanded .complaint-details {
	opacity:1;
	height:100%;
	position:absolute;
	z-index:2;
}

@keyframes animateIn {
	0% {
	  opacity:0;
	  transform:translateY(40px);
	}
}

.service-item {
	width:100%;
	height:54px;
	position:relative;
	overflow:hidden;
	border-bottom:1px solid #E2E8F0;
	transition:all .3s;
	cursor:pointer;
	animation-name:animateIn;
	animation-duration:200ms;
	animation-delay:calc(var(--animation-order) * 30ms);
	animation-fill-mode:both;
	animation-timing-function:ease-in-out;
}

.complaint-content:hover,
.service-item:hover {
	background:#efefef;
	animation-play-state:running;
}

.complaint-content-expanded:hover {
	background:#f3f6fc;
}

.complaint-id {
	width:40px;
	height:100%;
	float:left;
	line-height:54px;
	font-size:14px;
	text-align:right;
}

.complaint-number {
	width:110px;
	height:100%;
	float:left;
	line-height:54px;
	font-size:14px;
	text-align:right;
}

.complaint-product {
	width:calc(50% - 222px);
	height:100%;
	float:left;
	line-height:54px;
	font-size:14px;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	padding-right:10px;
}

.complaint-customer {
	width:calc(50% - 180px);
	float:left;
	height:100%;
	line-height:54px;
	font-size:14px;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	padding-right:10px;
}

.complaint-date {
	width:124px;
	float:left;
	line-height:54px;
	height:100%;
	font-size:14px;
}

.complaint-state {
	width:82px;
    text-align:center;
    font-size:11px;
	margin:14px 20px 0;
	border-radius:4px;
	float:left;
	height:24px;
	line-height:17px;
	font-family:OutfitSB;
}

.complaint-state-box {
	width:102px;
	float:left;
	height:100%;
	font-size:14px;
	z-index:1;
}


.complaint-form-container {
	width:900px;
	height:600px;
	overflow:hidden;
	border-radius:24px;
	left:calc(50% - 450px);
	position:absolute;
	top:10%;
	opacity:1;
	animation:complaint-form-entrance .3s;
}

@keyframes complaint-form-entrance {
	0% {opacity:0;transform:scale(.9)}
}

.complaint-form {
	height:calc(100% - 130px);
	overflow:hidden;
	border-bottom:1px solid #cecece;
	background:#f3f6fc;
	transition:background .3s;
}

.form-header {
    width:100%;
    height:60px;
    padding:0 14px;
}

.form-content {
	padding:15px;
}

.form-title {
    height:100%;
    line-height:60px;
    width:200px;
    font-size:24px;
    float:left;
}

.form-image {
    float:right;
    width:174px;
    height:100%;
}

.form-row {
	height:60px;
	width:100%;
	position:relative;
}

.form-row-big {
    height:140px;
    width:100%;
	position:relative;
}

.form-column {
	width:50%;
	height:100%;
	float:left;
	position:relative;
}

.form-item-outer {
	height:100%;
	width:100%;
	padding:0 10px;
}

.complaint-label {
	left:20px;
	top:-10px;
	font-size:14px;
	position:absolute;
	padding:0px 4px;
	z-index:1;
	color:#64748B;
	font-family:OutfitM;
	background:#f3f6fc;
}

.complaint-text {
	height:44px;
	border:2px solid #94A3B8;
	position:relative;
	border-radius:8px;
	width:100%;
	line-height:60px;
	transition:background .3s, color .3s;
	font-size:17px;
	padding:0 12px;
	background:none;
}

.complaint-textarea {
	border:2px solid #94A3B8;
	height:120px;
	resize:none;
	width:100%;
	position:relative;
	border-radius:8px;
	line-height:30px;
	transition:background .3s, color .3s;
	font-size:16px;
	padding:12px;
	background:none;
}

.form-submit {
    width:100%;
    height:60px;
    font-family:OutfitM;
    font-size:18px;
    background:#002f6c;
    color:#fff;
    border:0;
    border-radius:4px;
    box-shadow:0px 2px 4px -1px rgba(0, 0, 0, 0.2),
    0px 4px 5px 0px rgba(0, 0, 0, 0.14),
    0px 1px 10px 0px rgba(0, 0, 0, 0.12);
    transition:all .3s;
    cursor:pointer;
}

.form-submit:hover {
    box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2),
    0px 8px 10px 1px rgba(0, 0, 0, 0.14),
    0px 3px 14px 2px rgba(0, 0, 0, 0.12);
}

.complaint-form-close {
	height:44px;
	padding:0 20px;
	position:relative;
	transition:all .3s;
	float:left;
	border-radius:22px;
	margin:0 30px 0 0;
	color:#242424;
	overflow:hidden;
}

.complaint-form-close:hover {
	background-color:rgba(0,0,0,0.08);
}

.complaint-form-close:active {
	background-color:rgba(0,0,0,0.12);
}

/*complaint_page_END */

/*customers_page_START */
.sidebar-no-tasks {
	width:100%;
	height:50px;
	padding-top:20px;
	font-size:20px;
	font-family:OutfitM;
	text-align:center;
	display:block;
	transition:opacity .3s;
	white-space:nowrap;
}

.box-calendar-day-picker-buttons {
    height:60px;
    padding-top:20px;
}

.box-calendar-day-picker-date {
	width:250px;
	height:24px;
	text-align:center;
	font-family:OutfitM;
	font-size:16px;
}

.sidebar-picker-btn {
	float:left;
	border-radius:8px;
	height:30px;
	display:block;
	overflow:hidden;
	position:relative;
	transition:all .3s;
	background: #DBEAFE;
	color:#3B82F6 !important;
}

.sidebar-picker-btn:hover {
	background:#BFDBFE;
}

.sidebar-picker-btn:active {
	background:#BFDBFE;
}

.sidebar-picker-btn i {
	line-height:30px;
}

.arr {
	width:20%;
}

.tod {
	width:50%;
	margin:0 5%;
	font-size:18px;
	line-height:18px;
}

.time-box {
	margin:10px 0 25px;
	border-radius:24px;
	background:#fff;
	padding-bottom:6px;
	margin-right:15px;
	transition:all .3s;
	height:105px;
	width:290px;
	overflow:hidden;
}

#calendar-sidebar-time {
	text-align:center;
	width:100%;
	height:100%;
	position:relative;
}

.calendar-sidebar-date-time-week-day {
	font-size:18px;
	height:18px;
	position:relative;
}

.calendar-sidebar-date-time-month-day {
	font-size:38px;
	height:55px;
	position:relative;
}

.calendar-sidebar-date-time-month {
	display:inline;
	font-size:18px;
	position:relative;
}

.calendar-sidebar-date-time-year {
	display:inline;
	font-size:18px;
	position:relative;
}

#calendar-sidebar-hour {
	font-size:30px;
	height:44px;
	width:100%;
	position:absolute;
	text-align:center;
	z-index:1;
	transition:color .3s;
	color:#000;
}

.calendar-sidebar-hour-bg {
	height:44px;
	width:100%;
	padding-top:6px;
	background:#ddd;
	transition:background-color .3s;
}

#calendar-sidebar-hour-floor {
	font-size:30px;
	height:44px;
	color:#cacaca;
	width:100%;
	text-align:center;
	z-index:0;
	position:absolute;
	transition:color .3s;
}

.box-calendar-container {
	position:fixed;
	top:60px;
	width:320px;
	right:0;
	height:calc(100vh - 60px);
	padding:10px 0px 10px 15px;
	transition:all .3s;
	z-index:105800000;
}

.box-calendar-day-tasks {
	overflow-y:scroll;
	width:270px;
	height:calc(100vh - 345px);
}

.calendar-sidebard-add-task {
	font-size:12px;
	margin:5px 0;
	border-radius:4px;
	padding:2px;
	cursor:pointer;
	transition:all .3s;
	z-index:1;
	position:relative;
	background-color:rgba(0,0,0,0);
	color:#7f7f7f;
	text-align:center;
	width:250px;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	height:40px;
	float:left;
	border:2px dashed #afafaf;
}

.calendar-sidebard-add-task:hover {
	background-color:rgba(0,0,0,0.08);
}

.calendar-sidebard-add-task:active {
	background-color:rgba(0,0,0,0.12);
}

.sidebar-add-task-text {
	line-height:33px;
	vertical-align:7px;
	font-size:14px;
	font-family:OutfitSB;
	margin-left:5px;
	transition:all .3s;
}

.box-calendar-day-picker {
	opacity:1;
	transition:opacity .3s;
	width:250px;
}

.box-calendar-day-tasks-outer {
	width:290px;
	background:#fff;
	border-radius:24px 24px 0 0;
	padding-left:20px;
	scrollbar-gutter:stable;
	overflow-x:hidden;
    overflow-y:auto;
	transition:all .3s;
}

.calendar-sidebar-page-task-item {
	font-size:12px;
	margin:1px 0px;
	border-radius:4px;
	padding:2px;
	cursor:pointer;
	transition:all .3s;
	z-index:1;
	position:relative;
	background-color:var(--bg_category);
	color:#fff;
	width:250px;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	height:40px;
	float:left;
}

.calendar-sidebar-page-task-item:after {
	content:'';
	top:0;
	border-radius:4px;
	box-shadow:inset 0 2px 50px 1px rgba(255,255,255,.4);
	opacity:0;
	transition:all .3s;
	left:0;
	position:absolute;
	width:100%;
	height:100%;
}

.calendar-sidebar-page-task-item:hover {
	z-index:2;
}

.calendar-sidebar-page-task-item:hover:after {
	opacity:1;
}


.customers-main-container {
	width:calc(100% - 330px);
	height:calc(100vh - 230px);
	position:relative;
	float:left;
	margin-top:-28px;
}

.customers-actions {
	width:100%;
	height:290px;
	position:relative;
	margin-top:-30px;
	margin-bottom:30px;
}

.customers-actions-shortcuts {
	width:205px;
	height:100%;
	position:relative;
	float:left;
}

.customers-actions-item {
	width:180px;
	height:66px;
	position:relative;
	transition:all .3s;
	padding:10px 10px;
	cursor:pointer;
	border-radius:16px;
	margin:0 16px;
	overflow:hidden;
}

.customers-actions-item:hover {
	background:#e2e2e2;
}

.customers-actions-link {
	color:#000;
}

.customers-actions-icon {
	width:32px;
	height:32px;
	float:left;
	display:block;
	margin-top:8px;
	background-size:100% 100%;
}

.customers-actions-text {
	width:128px;
	padding:12px 8px 0;
	font-size:16px;
	font-family:Outfit;
	display:block;
	height:100%;
	float:left;
}

.customers-actions-charts {
	width:calc(100% - 410px);
	height:100%;
	position:relative;
	float:left;
}

.customers-overdue {
	width:calc(100% - 400px);
	height:calc(100vh - 402px);
	position:relative;
	float:left;
	border-radius:24px 24px 0 0;
}

.customers-overdue-task-item {
	height:40px;
	border-bottom:1px solid #E2E8F0;
	width:100%;
	cursor:pointer;
	position:relative;
	overflow:hidden;
	transition:border .3s, color .3s, background .3s;
}

.customers-favs-item {
	height:82px;
	padding:7px 12px;
	border-bottom:1px solid #E2E8F0;
	position:relative;
	overflow:hidden;
	transition:border .3s, color .3s, background .3s;
	width:100%;
}

.customers-overdue-content,
.customers-favs-content {
	overflow-y:scroll;
	height:calc(100% - 66px);
	transition:border .3s;
	background: /* Shadow covers */ linear-gradient(white 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), white 70%) 0 100%, /* Shadows */ radial-gradient(50% 0, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(50% 100%, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
    background: linear-gradient(white 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), white 70%) 0 100%, radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
    background-repeat: no-repeat;
    background-color: white;
    background-size: 100% 40px, 100% 0px, 100% 14px, 0% 1px;
    background-attachment: local, local, scroll, scroll;
	transition:all .3s;
	scrollbar-gutter: stable;
	width:calc(100% - 48px);
	margin:0 24px;
}

.customers-overdue-task-item:hover,
.customers-favs-item:hover {
	background:rgba(0, 0, 0, 0.08);
}

.customers-overdue-task-item:active,
.customers-favs-item:active {
	background:rgba(0, 0, 0, 0.12);
}

.customers-favs-href {
	text-decoration:none;
	color:unset;
	font-family:OutfitSB;
	font-size:16px;	
	position:relative;
	z-index:10;
}

.customer-favs-name {
	height:24px;
	width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.customer-favs-name:hover {
	text-decoration:underline;
	color:#3f3f3f;
}

.customer-favs-phone,
.customer-favs-mail {
	font-size:14px;
	height:20px;
	position:relative;
	z-index:10;
}

.customer-favs-mail a {
	color:#03a9f4;
}

.customer-favs-mail a:hover {
	color:#0077c2;
}

.customers-overdue-task-item-title {
	width:calc(50% - 160px);
	font-size:13px;
	float:left;
	height:40px;
	line-height:40px;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	padding-right:10px;
}

.customers-overdue-task-item-category {
	width:50px;
	font-size:13px;
	float:left;
	height:40px;
	line-height:40px;
	padding-top:11px;
	padding-left:20px;
}

.customers-overdue-task-item-category-dot {
	width:18px;
	height:18px;
	background:var(--bg_category);
	display:block;
	border-radius:50%;
}

.customers-overdue-task-item-customer {
	width:calc(50% - 100px);
	font-size:13px;
	float:left;
	padding-right:10px;
	height:40px;
	line-height:40px;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
}

.customers-overdue-task-item-day {
	width:90px;
	font-size:13px;
	float:left;
	height:40px;
	line-height:40px;
}

.customers-overdue-task-item-time {
	width:60px;
	font-size:13px;
	float:left;
	height:40px;
	line-height:40px;
}


.customers-favs {
	width:370px;
	height:calc(100vh - 402px);
	position:relative;
	float:left;
	margin-left:30px;
	border-radius:24px 24px 0 0;
}

.customers-actions-charts-inner {
	border-left:1px solid #e2e2e2;
	height:100%;
	width:100%;
	padding-right:20px;
}

.customers-actions-charts-content {
	height:240px;
	width:100%;
	padding-top:40px;
}

.chart-container {
	width:calc(50% - 50px);
	float:left;
	height:170px;
	margin-left:50px;
	margin-top:10px;
	position:relative;
}

.contact-list-href {
	width:194px;
	height:46px;
	position:absolute;
	right:8px;
	top:8px;
	font-size:14px;
	color:#0d47a1;
	font-family:Outfit;
	text-decoration:none;
	border-radius:23px;
	transition:all .3s;
	overflow:hidden;
	line-height:46px;
	padding:0 0 0 16px;
}

.contact-list-href i { 
	vertical-align:-7px;
}

.contact-list-href:hover {
	background:rgba(0, 0, 0, 0.04);
}

.scale-mid {
	transform:translateY(90px);
	position:relative;
}

.scale-low {
	transform:translateY(180px);
	position:relative;
}

.chart-label {
	position:absolute;
	top:-20px;
	width:100%;
	text-align:center;
	height:20px;
	font-size:12px;
	z-index:100000000;
}

.chart-scale {
	transform:translate(-30px,-10px);
	text-align:right;
	width:20px;
	position:absolute;
	height:120%;
}

.scale-item {
	font-size:13px;
	height:calc(100% / 6);
	position:relative;
	animation-name:animateScaleItem;
	animation-duration:300ms;
	animation-delay:calc(var(--animation-order) * 100ms);
	animation-fill-mode:both;
	animation-timing-function:cubic-bezier(.8,.2,0,1.91);
}

@keyframes animateScaleItem {
	0% {
		font-size:0;
		opacity:0;
	}
}


.month-chart, .week-chart {
	height:100%;
	width:100%;
	float:left;
	position:relative;
}

.chart-grid {
	height:100%;
	width:100%;
	position:absolute;
	z-index:0;
	top:0;
	left:0px;
}

.chart-border {
	border-bottom:1px dashed #dfdfdf;
	height:calc(100% + 5px);
	margin-top:-5px;
	width:100%;
	position:absolute;
	z-index:0;
	animation-name:animateGridBorder;
	animation-duration:300ms;
	animation-fill-mode:both;
	animation-timing-function:ease-in-out;
}

.chart-scale-grid {
	width:calc(100% - 1px);
	height:100%;
	margin-left:1px;
	position:relative;
}

@keyframes animateGridBorder {
	0% {
		height:0;
		width:0;
		transform:translateY(200px);
	}
}

.chart-scale-grid-line {
	height:calc(100% / 5);
	border-top:1px dashed #dfdfdf;
	position:relative;
	width:100%;
	animation-name:animateGridLine;
	animation-duration:300ms;
	animation-delay:calc(var(--animation-order) * 100ms);
	animation-fill-mode:both;
	animation-timing-function:cubic-bezier(.8,.2,0,1.91);
}

@keyframes animateGridLine {
	0% {
		width:0;
		opacity:0;
	}
}


.month-bars-container, .week-bars-container {
	width:100%;
	float:left;
	height:100%;
	position:relative;
}

.month-bar-container, .week-bar-container {
	width:25%;
	float:right;
	height:100%;
	position:relative;
}

.month-bar, .week-bar {
	width:50%;
	position:absolute;
	background:#004ba0;
	margin:0 25%;
	bottom:0;
	border-radius:8px;
	animation-name:animateChart;
	animation-duration:300ms;
	animation-delay:calc(var(--animation-order) * 150ms);
	animation-fill-mode:both;
	animation-timing-function:cubic-bezier(.8,.2,0,1.91);
}

.month-bar:hover, .week-bar:hover {
	border-top:1px solid orange;
	border-right:1px solid orange;
	border-left:1px solid orange;
	cursor:pointer;
}

@keyframes animateChart {
	0% {
		opacity:0;
		height:0;
	}

	100% {
		opacity:1;
	}
}


.month-label , .week-label{
	text-align:center;
	width:100%;
	height:20px;
	font-size:12px;
	position:absolute;
	bottom:-30px;
	font-family:Outfit;
	animation-name:animateLabel;
	animation-duration:200ms;
	animation-delay:calc(var(--animation-order) * 70ms);
	animation-fill-mode:both;
	animation-timing-function:ease-in-out;
}

@keyframes animateLabel {
	0% {
	opacity:0;
	transform:translateY(10px) scale(0.4);
	}

	100% {
	opacity:1;
	}
}

.icon-new-customer {
	background:url(../images/customer_add-24.svg);
	background-size:100% 100%;
}

.icon-new-contact {
	background:url(../images/contact_add-24.svg);
	background-size:100% 100%;
}

.icon-new-task {
	background:url(../images/task_add-24.svg);
	background-size:100% 100%;
}

.icon-list-customers {
	background:url(../images/customers_list_24dp.svg);
	background-size:100% 100%;
}

.icon-list-contacts {
	background:url(../images/contacts_list_24dp.svg);
	background-size:100% 100%;
}

.icon-list-tasks {
	background:url(../images/tasks_list_24dp.svg);
	background-size:100% 100%;
}

.show-list-item {
	opacity:0;
	margin-top:30px;
}

.customers-favorite {
	width:260px;
	height:100%;
	position:relative;
	float:left;
}

.contact-column-1-header {
	width:calc(100% - 115px);
	height:auto;
	float:left;
	padding-left:30px;
	font-size:15px;
	font-family:OutfitM;
	color:#94A3B8;
}

.contact-column-2-header {
	width:100px;
	height:auto;
	float:left;
	font-size:15px;
	font-family:OutfitM;
	color:#94A3B8;
}

.customers-list {
	margin:16px 0 0;
	width:calc(100% - 330px);
	height:calc(100vh - 82px);
	overflow:hidden;
	border-radius:24px 24px 0 0;
}

.customers-list-header {
	height:60px;
	width:calc(100% - 48px);
	margin:0 24px;
	position:relative;
	line-height:60px;
	border-bottom:2px solid #E2E8F0;
	transition:background .3s, border .3s;
	font-size:14px;
	color:#94A3B8;
	scrollbar-gutter:stable;
	font-family:OutfitM;
	overflow:hidden;
}

.customers-list-content {
	height:calc(100% - 230px);
	overflow-y:scroll;
	scrollbar-gutter:stable;
	width:calc(100% - 48px);
	margin:0 24px;
}

.customers-list-footer {
	height:70px;
	width:100%;
	background:#fff;
	box-shadow:0 -3px 3px rgba(0,0,0,0.12);
	transition:background .3s;
	position:relative;
}

.customers-list-pagination {
	text-align:center;
	padding:10px;
}

.pagination-item {
	float:left;
	width:40px;
	height:40px;
	border-radius:50%;
	text-align:center;
	line-height:40px;
	margin:0px 10px;
	cursor:pointer;
	transition:background .3s;
}

.pagination-item-hidden {
	display:none;
}

.pagination-item:not([disabled]):hover {
	background:rgba(0, 0, 0, 0.14);
}

.pagination-active {
	background:#002f6c;
	color:rgba(255,255,255,.8);
}

.pagination-active:hover {
	background:#005cb2;
}

.customers-list-item {
	border-bottom:1px solid #dfdfdf;
	width:100%;
	height:50px;
	animation-name:animateIn;
	animation-duration:200ms;
	animation-delay:calc(var(--animation-order) * 30ms);
	animation-fill-mode:both;
	animation-timing-function:ease-in-out;
	color:#000;
	transition:color .3s, background .3s;
	line-height:50px;
	font-size:15px;
	overflow:hidden;
	position:relative;
}

.customers-list-item:hover {
	background:rgba(0, 0, 0, 0.08)
}

.customers-list-item:active {
	background:rgba(0, 0, 0, 0.12);
}

.customers-list-id {
	width:100px;
	text-align:right;
	padding-right:20px;
	height:inherit;
	line-height:inherit;
	float:left;
	font-family:inherit;
}

.customers-list-name,
.customers-list-city,
.customers-list-nip,
.customers-list-street {
	text-align:left;
	height:inherit;
	line-height:inherit;
	float:left;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	font-family:inherit;
	padding-right:15px;
}

.customers-list-name {
	width:calc(100% - 650px);
}

.customers-list-nip {
	width:150px;
}

.customers-list-street {
	width:250px;
}

.customers-list-city {
	width:150px;
}

#input-add-contact-customer,
#input-add-contact-person,
#input-contact-edit-person {
	width:100%;
	min-width:300px;
}

.address-invoice-options {
	width:120px;
	float:left;
}

.address-invoice-header,
.address-delivery-header {
	width:calc(100% - 48px);
	margin:0 24px;
	line-height:36px;
	height:36px;
	font-family:OutfitSB;
	font-size:13px;
	color:#9f9f9f;
}

.address-title {
	font-size:14px;
	font-family:OutfitSB;
	text-align:center;
	width:calc(100% - 48px);
	margin:0 24px;
	height:36px;
	line-height:36px;
}

.address-invoice-item,
.address-delivery-item {
	width:100%;
	height:52px;
	line-height:52px;
	border-bottom:1px solid #dfdfdf;
	font-size:15px;
}

.address-invoice-item:hover,
.address-delivery-item:hover {
	background:rgba(0, 0, 0, 0.08);
}

.address-delivery-details {
	width:calc(100% - 100px);
	height:inherit;
	float:left;
}

.address-delivery-options {
	float:left;
	width:100px;
	height:inherit;
	padding-top:5px;
}

.address-invoice-name {
	width:34%;
}

.address-invoice-short-name,
.address-delivery-short-name {
	width:10%;
	padding-left:8px;
}

.address-invoice-postal,
.address-delivery-postal {
	width:6%;
}

.address-invoice-city {
	width:22%;
}

.address-delivery-name {
	width:17%;
}

.address-delivery-city,
.address-delivery-street {
	width:13%;
}

.address-delivery-phone {
	width:12%;
}

.address-delivery-mail,
.address-delivery-person,
.address-invoice-nip,
.address-invoice-street {
	width:14%;
}

/*calendar-page-start*/
.calendar-page-container {
	width:100%;
	min-height:100%;
	position:relative;
}

.calendar-page-inner {
	width:100%;
	position:relative;
	padding:20px 20px 40px;
	display:flow-root;
	background:#fff;
}

.calendar-page-header {
	width:100%;
	height:200px;
	overflow:hidden;
	position:relative;
}

.calendar-page-image {
	color:#FFFFFF;
	background-size:cover;
	background-color:#FAFAFA;
	background-repeat:no-repeat;
	background-position:0 50%;
	height:200px;
	position:relative;
}

.calendar-page-image:before {
	content:'';
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.4);
	top:0;
	left:0;
	z-index:1;
	position:absolute;
}

.calendar-page-month-picker {
	position:absolute;
	width:100%;
	height:50px;
	text-align:center;
	z-index:2;
	bottom:20px;
	color:#fff;
}

.calendar-page-pick-month {
	color:#fff;
	font-size:38px;
	line-height:50px;
	width:50px;
	height:50px;
	border-radius:50px;
	transition:all .3s;
}

.calendar-page-pick-month:hover {
	background:rgba(0, 0, 0, 0.16);
}

.calendar-page-pick-month:active {
	background:rgba(0, 0, 0, 0.36);
}

.calendar-page-curr-month {
	display:inline-block;
	color:#fff;
	font-size:22px;
	line-height:50px;
	vertical-align:10px;
}

.calendar-page-image-summer {
	background-image:url(/images/calendar_header_summer.svg);
	background-position:0 20%;
}

.calendar-page-image-spring {
	background-image:url(/images/calendar_header_spring.svg);
	background-position:0px 81%;
}

.calendar-page-image-winter {
	background-image:url(/images/calendar_header_winter.webp);
}

.calendar-page-image-autumn {
	background-image:url(/images/calendar_header_autumn.webp);
}

.calendar-page-row {
	float:left;
	width:100%;
	min-height:150px;
	height:auto;
	display:flex;
}

.calendar-page-day {
	width:calc(100% / 7);
	float:left;
	border:1px solid #E2E8F0;
	display:block;
	position:relative;
	transition:all .2s;
	cursor:pointer;
	padding:30px 0px 8px;
}

.calendar-page-day:after {
	content:'';
	width:100%;
	height:100%;
	position:absolute;
	z-index:0;
	top:0;
	left:0;
	opacity:0;
	box-shadow:0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.20);
	transition:opacity .3s;
}

.calendar-page-day:hover:after {
	opacity:1;
}

.calendar-page-day:hover {
	z-index:2;
	background:#fff;
	transform:scale(1.06, 1.06);
}

.calendar-page-day-number {
	text-align:right;
	height:30px;
	padding:4px 10px;
	color:#7f7f7f;
	position:absolute;
	right:4px;
	top:0;
	width:30px;
}

.calendar-page-task-item {
	font-size:12px;
	margin:2px;
	border-radius:4px;
	padding:2px;
	cursor:pointer;
	transition:all .2s;
	z-index:1;
	position:relative;
	background-color:var(--bg_category);
	color:#fff;
}

.calendar-page-task-item:after {
	content:'';
	top:0;
	border-radius:4px;
	box-shadow:0 2px 60px 10px rgba(0,0,0,.64);
	opacity:0;
	transition:all .2s;
	left:0;
	position:absolute;
	width:100%;
	height:100%;
}

.calendar-page-task-item:hover {
	transform:scale(1.1,1.1);
	z-index:2;
}

.calendar-page-task-item:hover:after {
	opacity:1;
}

.task-item-cat-1 {
	background:#1a237e;
	color:#fff;
}

.task-row {
	white-space:nowrap;
	text-overflow:ellipsis;
	width:100%;
	overflow:hidden;
}

.task-item-customer {
	font-size:14px;
}

.task-view-container {
	position:absolute;
	top:10%;
	width:800px;
	height:645px;
	left:calc(50% - 400px);
	border-radius:24px;
	overflow:hidden;
	opacity:1;
	animation:circle-show .25s;
}

.task-view-header {
	height:70px;
	width:100%;
	position:relative;
	padding:15px;
	background:var(--bg_category);
	transition:background .3s;
}

.task-view-content {
	padding:15px;
	position:relative;
	height:calc(100% - 140px);
	background:#EFF6FF;
}

.task-view-footer {
	height:72px;
	width:100%;
	border-top:1px solid #CBD5E1;
	padding:12px 15px;
	background:#EFF6FF;
}

.arrow-discard {
	height:44px;
	width:44px;
	text-align:center;
	border-radius:22px;
	overflow:hidden;
	position:relative;
	transition:background .3s, color .3s;
	float:left;
}

.arrow-discard i {
	line-height:44px;
}

.task-view-delete,
.task-view-discard,
.note-view-btn,
.floating-task-view-save,
.button-discard,
.button-main,
.task-view-save,
.complaint-form-btn {
	padding:0 18px;
	height:44px;
	transition:background .3s, box-shadow .3s, color .3s;
}


.task-view-delete,
.task-view-discard,
.note-view-btn,
.button-discard,
.complaint-form-btn {
	float:left;
	margin-right:10px;
	border-radius:22px;
	position:relative;
	overflow:hidden;
}

.complaint-form-btn {
	float:left;
	margin-right:10px;
	border-radius:22px;
	position:relative;
	overflow:hidden;
	background:#002f6c;
	color:rgba(255,255,255,.8);
}

.task-view-save,
.floating-task-view-save,
.button-main,
.task-view-go-to {
	float:right;
	background:#002f6c;
	color:rgba(255,255,255,.8);
	position:relative;
	overflow:hidden;
}

.task-view-save:active,
.floating-task-view-save:active,
.button-main:active,
.complaint-form-btn:active {
	box-shadow:0px 10px 13px -6px rgba(0, 0, 0, 0.2),
    0px 20px 31px 3px rgba(0, 0, 0, 0.14),
    0px 8px 38px 7px rgba(0, 0, 0, 0.12);
}

.task-view-delete:hover,
.task-view-discard:hover,
.note-view-btn:hover,
.arrow-discard:hover,
.button-discard:hover {
	background:rgba(0,0,0,0.08);
}

.task-view-delete:active,
.task-view-discard:active,
.note-view-btn:active,
.button-discard:active,
.arrow-discard:active {
	background:rgba(0,0,0,0.12);
}

.button-text-40 {
	vertical-align:7px;
	display:inline-block;
	padding:0 4px 0 8px;
	line-height:44px;
	height:44px;
	font-size:15px;
}

.button-text-56 {
	vertical-align:7px;
	display:inline-block;
	padding:0 5px 0 7px;
	line-height:56px;
	height:56px;
	transition:all .3s;
	font-size:15px;
	color:rgba(255,255,255,.8);
}

.icon-56 {
	color:rgba(255,255,255,.8);
}

.task-view-go-to {
	width:150px;
	height:50px;
	border-radius:16px;
	float:left;
	line-height:50px;
	text-decoration:none;
	text-align:center;
	transition:color .3s, background .3s, opacity .2s;
	right:0;
	position:absolute;
	z-index:3;
	cursor:pointer;
}

.button-text-50 {
	height:50px;
	display:inline-block;
	width:calc(100% - 42px);
	vertical-align:7px;
	font-size:15px;
}

.input-container-standard {
	position:relative;
	height:75px;
	float:left;
}

.input-container-small {
	position:relative;
	height:55px;
	float:left;
}

.input-container-max {
	position:relative;
	height:75px;
	float:left;
	width:100%;
}

.input-container-textarea-small {
	position:relative;
	height:95px;
	float:left;
	width:100%;
}

.input-container-half {
	position:relative;
	height:75px;
	float:left;
	width:calc(50% - 7.5px);
}

.input-container-35 {
	position:relative;
	height:75px;
	float:left;
	width:35%;
}

.input-container-25 {
	position:relative;
	height:75px;
	float:left;
	width:calc(25% - 15px);
}

.input-container-40 {
	position:relative;
	height:75px;
	float:left;
	width:calc(40% - 15px);
}

.label-standard {
	position:absolute;
	font-size:13px;
	font-family:OutfitSB;
	top:-9px;
	left:8px;
	padding:0 6px;
	z-index:2;
	color:#64748B;
	background:#EFF6FF;
	transition:opacity .3s;
}

.label-note-pick {
	font-size:15px;
	padding:0 6px;
	color:#000;
	transition:opacity .3s;
}

.dark-mode .label-note-pick {
	color:#cfcfcf;
}

.column-divider {
	background:#cfcfcf;
	width:1px;
	height:100%;
	float:left;
	position:relative;
}

.task-view-row {
	width:100%;
	height:auto;
	position:relative;
	float:left;
}

.task-view-row-small {
	width:100%;
	position:relative;
	float:left;
	height:90px;
	border-top:1px solid #CBD5E1;
	padding-top:20px;
}

.task-view-new-contact {
	width:100%;
	height:236px;
	border:0;
	border-radius:4px 4px 0 0;
	border-bottom:1px solid rgba(0, 0, 0, 0.22);
	font-size:16px;
	padding:18px 12px 0;
	transition:all .3s;
	resize:none;
	background:#efefef;
	outline:0;
	display:block;
}

.task-view-contact-text {
	width:100%;
	height:326px;
	border-radius:8px;
	border:2px solid #94A3B8;
	font-size:16px;
	transition:background .3s, color .3s;
	resize:none;
	background:0;
	outline:0;
	display:block;
	overflow:hidden;
}

.task-view-contact-text-small {
	width:100%;
	height:236px;
	border-radius:8px;
	border:2px solid #94A3B8;
	font-size:16px;
	transition:background .3s, color .3s;
	resize:none;
	background:0;
	outline:0;
	display:block;
	overflow:hidden;
}

.task-view-contact-text .note-editor.note-frame,
.task-view-contact-text-small .note-editor.note-frame{
	border:0;
}

.textarea-small {
	width:100%;
	height:92px;
	border:0;
	border-radius:4px;
	border:2px solid #94A3B8;
	font-size:16px;
	padding:12px 12px 0;
	transition:background .3s, color .3s;
	resize:none;
	background:0;
	outline:0;
	display:block;
}

.input-standard {
	border-radius:8px;
	border:2px solid #94A3B8;
	height:50px;
	line-height:50px;
	font-size:16px;
	padding:0 12px 0;
	transition:background .3s, color .3s;
	background:0;
	position:relative;
}

.input-note-pick {
	border-radius:8px;
	border:2px solid rgba(0,0,0,.2);
	height:36px;
	line-height:36px;
	font-size:15px;
	padding:0 12px 0;
	transition:background .3s, color .3s;
	background:0;
	position:relative;
	box-sizing:content-box;
	width:150px;
}

.dark-mode .input-note-pick {
	border:2px solid rgba(255,255,255,.2);
}

.input-standard option,
.input-max option,
.input-note-pick option {
	background:#f3f6fc;
	color:#0f0f0f;
}

.input-max {
	border-radius:8px;
	border:0;
	border:2px solid #94A3B8;
	height:50px;
	line-height:50px;
	font-size:16px;
	padding:0 12px 0;
	transition:background .3s, color .3s;
	background:0;
	width:100%;
	position:relative;
}

.input-max ~ i {
	position:absolute;
	top:16px;
	font-size:20px;
	left:9px;
}



#input-task-view-title {
	background:rgba(255,255,255,0.15);
	height:40px;
	width:100%;
	padding:0px 10px;
	line-height:40px;
	border-radius:4px;
	border:0;
	color:#fff;
	font-size:16px;
}

#input-task-view-title::placeholder {
	color:#efefef;
}

#input-task-view-date,
#input-contact-edit-date {
	width:158px;
}

#input-task-view-start,
#input-task-view-end,
#input-contact-edit-start {
	width:120px;
}

#input-task-view-category {
	width:167px;
}

#input-task-view-customer-name {
	width:calc(100% - 165px);
	float:left;
	margin-right:15px;
	position:relative;
	z-index:1;
	transition:width .1s;
}

#input-task-view-contact-person {
	width:400px;
	position:relative;
}


.label-checkbox {
	display:inline-block;
	position:relative;
	margin-top:13px;
	cursor:pointer;
	position:relative;
	padding-left:59px;
	z-index:1;
	font-size: 15px;
}

#input-task-view-add-contact,
#input-task-view-allday,
#input-task-view-executed,
#default-person,
#default-address,
#is-customer-informed-contact {
	display:none;
}

.task-view-footer-right {
	float:right;
}

.task-view-pick-user {
	width:190px;
	position:relative;
	margin-top:-3px;
	padding-right:10px;
	float:left;
}

.task-view-executed-status {
	margin-right:20px;
	float:left;
	position:relative;
}

.task-view-add-contact-visual,
.task-view-allday-visual,
.task-view-executed-visual,
.default-person-visual,
.default-address-visual,
.customer-informed-visual {
	width:52px;
	height:32px;
	position:absolute;
	display:inline-block;
	background:rgba(0,0,0,0.14);
	border-radius:15px;
	border:2px solid #519657;
	transition:all .2s;
	top:7px;
	left:0;
	z-index:0;
}

.task-view-executed-status label {
	font-family:OutfitSB;
	font-size:13px;
	padding-top:3px;
	text-transform:uppercase;
}

#input-task-view-allday ~ .task-view-allday-visual:after,
#input-task-view-add-contact ~ .task-view-add-contact-visual:after,
#input-task-view-executed ~ .task-view-executed-visual:after,
#default-person ~ .default-person-visual:after,
#default-address ~ .default-address-visual:after,
#is-customer-informed-contact ~ .customer-informed-visual:after {
	content:'';
	width:16px;
	height:16px;
	border-radius:50%;
	background:#519657;
	position:absolute;
	top:6px;
	left:6px;
	transition:all .2s;
}

.dark-mode .task-view-allday-visual,
.dark-mode .task-view-add-contact-visual,
.dark-mode .task-view-executed-visual,
.dark-mode .default-person-visual,
.dark-mode .default-address-visual,
.dark-mode .customer-informed-visual {
	background:rgba(255,255,255,0.14);
}


#input-task-view-allday:checked ~ .task-view-allday-visual:after,
#input-task-view-add-contact:checked ~ .task-view-add-contact-visual:after,
#input-task-view-executed:checked ~ .task-view-executed-visual:after,
#default-person:checked ~ .default-person-visual:after,
#default-address:checked ~ .default-address-visual:after,
#is-customer-informed-contact:checked ~ .customer-informed-visual:after  {
	left:23px;
	width:22px;
	height:22px;
	top:3px;
	background:#fff;
}

#input-task-view-allday:checked ~ .task-view-allday-visual,
#input-task-view-add-contact:checked ~ .task-view-add-contact-visual,
#input-task-view-executed:checked ~ .task-view-executed-visual,
#default-person:checked ~ .default-person-visual,
#default-address:checked ~ .default-address-visual,
#is-customer-informed-contact:checked ~ .customer-informed-visual {
	background:#087f23;
	border:2px solid #087f23;
}


.task-view-customer-search-field {
	width:calc(100% + 18px);
	position:absolute;
	z-index:21;
	top:-10px;
	animation:show .4s;
	padding-top:70px;
	background:#fff;
	overflow:hidden;
	border-radius:16px;
	left:-9px;
	box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2),
    0px 24px 38px 3px rgba(0, 0, 0, 0.14),
	0px 9px 46px 8px rgba(0, 0, 0, 0.12);
	padding-bottom:10px;
}

.over-task-view {
	position:fixed;
	z-index:3;
	animation:show .4s;
}

.task-view-customer-search-container {
	position:relative;
	z-index:1;
	overflow-y:scroll;
	width:100%;
	height:320px;
}

.task-view-customer-search-item {
	width:calc(100% - 20px);
	height:40px;
	padding-left:20px;
	line-height:40px;
	cursor:pointer;
	position:relative;
	overflow:hidden;
	font-size:15px;
	transition:background .3s, height .3s, box-shadow .3s;
	color:#000;
	margin:6px 10px;
	border-radius:8px;
	background:#F3F4F6;
}

.task-view-customer-search-item:hover {
	background:#E2E8F0;
}

.task-view-customer-search-item-id {
	width:50px;
	height:100%;
	float:left;
}

.task-view-customer-search-item-name {
	width:calc(100% - 160px);
	height:100%;
	padding-left:20px;
	float:left;
}


/*customer_page_start */
.customer-tabs-row {
	height:60px;
	width:calc(100% - 48px);
	position:relative;
	display:flex;
	transition:background .3s, border .3s;
	margin:0 24px 14px;
	background:#EEF6FF;
	border-radius:16px;
}

.customer-tab {
	width:160px;
	border-radius:16px;
	height:59px;
	line-height:60px;
	font-size:16px;
	text-align:center;
	transition:all .3s;
	cursor:pointer;
	color:#94A3B8;
	position:relative;
	overflow:hidden;
}

.customer-tab-name {
	font-family:OutfitM;
	height:100%;
	display:inline-block;
}

.customer-options {
	width:50px;
	height:50px;
	line-height:50px;
	font-size:16px;
	text-align:center;
	transition:all .3s;
	cursor:pointer;
	color:#000;
	overflow:hidden;
	position:absolute;
	right:24px;
	top:30px;
	border-radius:50%;
}

.customer-options:hover {
	background:rgba(0, 0, 0, 0.08);
}

.customer-options i {
	font-size:30px;
	padding:10px;
}

.customer-options-box {
	height:170px;
	box-shadow:0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
	position:absolute;
	right:24px;
	top:75px;
	width:210px;
	transition:all .2s, background .3s;
	background:#EFF6FF;
	z-index:110;
	overflow:hidden;
	transform:scale(1,1);
	opacity:1;
	border-radius:16px;
	padding:8px 0;
}

.customer-options-item {
	height:50px;
	font-size:15px;
	line-height:50px;
	width:100%;
	cursor:pointer;
	overflow:hidden;
	position:relative;
	transition:background .3s, color .3s;
}

.customer-options-item i {
	vertical-align:-6px;
	margin-right:15px;
	margin-left:20px;
}

.customer-options-item:hover {
	background:rgba(0, 0, 0, 0.08);
}

.box-collapsed {
	height:0px;
	transform:scale(0.2,0.2);
	opacity:0;
}

.customer-tab-active .customer-tab-name {
	color:#2962ff;
	border-bottom:4px solid #2962ff;
}

.customer-tab-active {
	background:rgba(0,0,0,0.06);
}


.customer-data-container {
	width:100%;
	height:calc(100vh - 266px);
    overflow:hidden;
	padding:0 24px;
}

.customer-form {
	width:100%;
	padding:15px 0px;
}

.form-big-row {
	width:100%;
	height:50px;
}

.customer-form-container {
	width:39%;
	float:left;
	position:relative;
	overflow:hidden;
	height:calc(100% - 19px);
}

.customer-data-right {
	width:61%;
	float:left;
	position:relative;
}

.customer-data-persons {
	width:100%;
	float:left;
	height:200px;
	overflow-y:scroll;
	position:relative;
	border:2px solid #E2E8F0;
	border-radius:8px;
	transition:all .3s;
}

.customer-form-outer {
	width:calc(100% - 25px);
	float:left;
	height:calc(100% - 25px);
	overflow-y:auto;
	position:relative;
	border:2px solid #E2E8F0;
	border-radius:8px;
	margin-top:25px;
	transition:border .3s;
}

.customer-data-contact-person-item {
	height:56px;
	width:100%;
	border-bottom:1px solid #E2E8F0;
	padding:8px 0;
	position:relative;
	overflow:hidden;
	transition:border .3s, color .3s;
}

.customer-data-contact-person-item:hover {
	background:rgba(0, 0, 0, 0.08);
}

.customer-data-contact-person-cc1 {
	float:left;
	width:calc(100% - 50px);
	height:100%;
}


.customer-data-contact-person-c1 {
	float:left;
	width:42%;
	height:100%;
}

.customer-data-contact-person-c2 {
	float:left;
	width:25%;
	height:100%;
}

.customer-data-contact-person-c3 {
	float:left;
	width:33%;
	height:100%;
}

.customer-data-contact-person-c4 {
	position:relative;
	z-index:2;
	width:40px;
	height:50px;
	float:right;
}

.rounded-button {
	width:40px;
	height:40px;
	border-radius:50%;
	position:relative;
	transition:all .3s;
	float:left;
	margin-right:10px;
	overflow:hidden;
}

.rounded-button:hover {
	background:rgba(0, 0, 0, 0.08);
}

.rounded-button:active {
	background:rgba(0, 0, 0, 0.12);
}

.rounded-button i {
	line-height:40px;
	font-size:20px;
	color:#000;
}

.edit-item-button {
	border-radius:50%;
	transition:all .3s;
	position:relative;
	overflow:hidden;
	width:36px;
	height:36px;
	background:#1b5e20;
	box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2),0px 2px 2px 0px rgba(0, 0, 0, 0.14),0px 1px 5px 0px rgba(0,0,0,.12);
}

.edit-item-button:hover {
	background:#43a047;
	box-shadow:0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
}

.edit-item-button:active,
.delete-item-button:active {
	box-shadow:0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12);
}

.delete-item-button {
	background:#b71c1c;
	box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2),0px 2px 2px 0px rgba(0, 0, 0, 0.14),0px 1px 5px 0px rgba(0,0,0,.12);
}

.delete-item-button:hover {
	background:#e53935;
	box-shadow:0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12);
}

.edit-item-button i,
.delete-item-button i {
	color:#fff;
}

.customer-data-contact-person-name,
.customer-data-contact-person-mail,
.customer-data-contact-person-phone,
.customer-data-contact-person-title {
	float:left;
	width:100%;
	height:50%;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	padding-right:3px;
}

.customer-data-contact-person-cc1 i {
	font-size:16px;
	vertical-align:-3px;
}

.customer-data-contact-person-name {
	font-size:15px;
	font-family:OutfitSB;
}

.customer-data-contact-person-title {
	font-size:13px;
}

.customer-data-persons-outer,
.customer-data-comments-outer {
	position:relative;
}

.customer-data-persons-outer {
	height:230px;
	margin-top:25px;
}

.customer-data-comments-outer {
	height:calc(100vh - 540px);
}

.customer-data-comments {
	width:100%;
	float:left;
	height:calc(100vh - 540px);
	overflow-y:scroll;
	position:absolute;
	border:2px solid #E2E8F0;
	border-radius:8px;
	background:#fff;
	right:0px;
	z-index:11; 
	transition:all .3s;
	bottom:0;
}

#label-to-maximize {
	z-index:12;
}

.label-maximized {
	transform:translate(-494px, -240px);
}

.customer-data-comments-maximized {
	width:calc(100vw - 658px);
	height:calc(100vh - 300px);
}


.customer-data-comments-maximize,
.customer-data-comments-edit,
.customer-data-persons-add {
	position:absolute;
	height:40px;
	width:40px;
	right:40px;
	background:#002f6c;
	border-radius:20px;
	transition:width .3s, border-radius .3s, background .3s, box-shadow .3s;
	overflow:hidden;
	color:rgba(255,255,255,.8);
	white-space:nowrap;
	z-index:11;
	box-shadow:0px 3px 1px -2px rgba(0, 0, 0, 0.2),0px 2px 2px 0px rgba(0, 0, 0, 0.14),0px 1px 5px 0px rgba(0,0,0,.12);
}

.customer-data-comments-maximize,
.customer-data-comments-edit {
	bottom:75px;
	display:none;
	transition:all .3s;
}
.customer-data-comments-outer:hover .customer-data-comments-maximize,
.customer-data-comments-outer:hover .customer-data-comments-edit {
	display:block;
}

.customer-data-comments-maximize {
	bottom:20px;
}

.customer-data-persons-add {
	top:180px;
}

.customer-data-comments-edit i,
.customer-data-comments-maximize i,
.customer-data-persons-add i {
	width:40px;
	height:40px;
	vertical-align:-6px;
	display:inline-block;
}

.customer-data-comments-edit span,
.customer-data-comments-maximize span,
.customer-data-persons-add span {
	width:100px;
	height:40px;
	display:inline-block;
	text-align:left;
	font-size:14px;
	line-height:40px;
}

.customer-data-comments-maximize:hover,
.customer-data-comments-edit:hover,
.customer-data-persons-add:hover {
	width:140px;
}

.customer-data-comments-inner,
.customer-data-persons-inner {
	font-size:85%;
	margin:10px 10px 20px;
}

.customer-data-persons-inner {
	border-top:1px solid #dfdfdf;
	transition:border .3s;
}

.customer-data-comments-inner table {
	border-collapse:collapse;
}

.customer-data-comments-inner td {
	border:1px solid #e7e7e7;
	padding:6px 8px;
}

.customer-data-comments-label,
.customer-data-label {
	position:absolute;
	top:-14px;
	left:18px;
	background:#fff;
	padding:0px 4px;
	color:#94A3B8;
	font-family:OutfitM;
	font-size:16px;
	z-index:2;
	height:16px;
	transition:background .3s, color .3s, transform .3s;
}

.customer-data-label {
	top:11px;
}

.customer-data-comments-maximized .customer-data-comments-inner {
	font-size:100%;
}

.devices-groups-container {
	float:left;
	width:20%;
	height:100%;
	position:relative;
	border-right:1px solid #E2E8F0;
}

.devices-groups-inner {
	height:calc(100% - 112px);
	overflow-y:auto;
	width:calc(100% - 48px);
	margin:0 24px;
}

.devices-list-outer {
	float:left;
	width:80%;
	height:100%;
}

.devices-list-container {
	float:left;
	width:calc(100% - 48px);
	margin:0 24px;
	overflow-y:scroll;
	height:calc(100% - 50px);
	padding-bottom:70px;
}

.devices-groups-footer {
	bottom:0px;
	position:absolute;
	left:0;
	width:calc(100% - 24px);
	height:54px;
	margin-left:24px;
}

.devices-footer-btn {
	width:calc((100% / 3) - 24px);
	float:left;
	height:40px;
	overflow:hidden;
	background:#DBEAFE;
	margin-right:24px;
	position:relative;
	transition:background .3s;
	border-radius:8px;
	color:#3B82F6 !important;
}

.devices-footer-btn:hover {
	background:#BFDBFE;
}

.group-item {
	width:100%;
	height:34px;
	overflow:hidden;
	position:relative;
	margin:5px 0;
	line-height:34px;
	border-radius:17px;
	cursor:pointer;
	transition:all .3s;
	font-size:14px;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
}

.group-lvl-0 {
	padding:0 16px;
}

.group-lvl-1 {
	padding:0 32px;
}

.group-lvl-0:hover,
.group-lvl-1:hover {
	background:rgba(0,0,0,0.1);
}

.group-active {
	background:#002f6c;
	color:rgba(255,255,255,.8);
}

.group-active:hover {
	background:#005cb2;
}

.devices-device-counter {
	height:16px;
	font-size:12px;
	font-family:OutfitM;
	border-radius:6px;
	background:rgba(0,0,0,.14);
	display:block;
	position:absolute;
	right:10px;
	top:9px;
	line-height:16px;
	padding:0 8px;
	text-align:center;
}

.group-active .devices-device-counter {
	background:rgba(255,255,255,.24);
}

.devices-item {
	height:54px;
	padding:0 10px;
	line-height:54px;
	border-bottom:1px solid #E2E8F0;
	width:100%;
	transition:background .3s, color .3s;
}

.devices-item:hover {
	background:rgba(0,0,0,.08);
}

.devices-title { 
	width:calc(100% - 48px);
	height:48px;
	margin:0 24px;
	line-height:48px;
	font-size:14px;
	font-family:OutfitSB;
	color:#94A3B8;
	border-bottom:2px solid #E2E8F0;
	padding:0 10px;
	overflow:hidden;
	scrollbar-gutter:stable;
}

.devices-item-name,
.devices-item-sn,
.devices-item-group,
.devices-item-comments {
	float:left;
	height:inherit;
	line-height:inherit;
	font-family:inherit;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	padding-right:10px;
	color:inherit;
}

.devices-item-name {
	width:30%;
}

.devices-item-sn {
	width:15%;
}

.devices-item-group {
	width:15%;
}

.devices-item-comments {
	width:calc(40% - 80px);
}

.devices-item-actions {
	width:80px;
	float:left;
	height:inherit;
}

.devices-action-btn {
	width:36px;
	height:36px;
	text-align:center;
	line-height:30px;
	margin:9px 0 0 4px;
	float:left;
	position:relative;
	overflow:hidden;
	border-radius:50%;
	transition:background .3s;
}

.devices-action-btn:hover {
	background:rgba(0, 0, 0, 0.08);
}

.devices-action-btn i {
	font-size:20px;
	line-height:36px;
}

.devices-search {
	height:58px;
	width:100%;
	padding:10px 0;
}

.devices-search-field {
	width:calc(100% - 48px);
    margin:0 24px;
	background:#dfdfdf;
	border:0;
	border-radius:19px;
	height:38px;
	font-size:15px;
	text-align:center;
	padding:0 6px;
}

.devices-groups-title {
	padding:4px 8px;
	font-family:OutfitSB;
}

.device-service-history-box {
	width:70%;
	left:15%;
	top:10%;
	height:70%;
	border-radius:24px;
	box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2),
    0px 10px 14px 1px rgba(0, 0, 0, 0.14),
    0px 4px 18px 3px rgba(0, 0, 0, 0.12);
	z-index:1;
	position:absolute;
	animation:circle-show .3s;
	overflow:hidden;
}

.device-service-history-top {
	padding:15px;
	height:210px;
	width:100%;
	background:#EFF6FF;
}

.device-service-history-name {
	width:60%;
	height:80px;
	line-height:80px;
	font-size:28px;
	float:left;
}

.device-service-history-rightop {
	float:right;
	width:40%;
	height:90px;
}

.bordered-text {
	border:2px solid #CBD5E1;
	padding:0 6px;
	margin-left:6px;
	width:50%;
	float:right;
	border-radius:8px;
	height:34px;
	text-align:left;
	line-height:30px;
	font-family:OutfitM;
}

.bordered-text-long {
	border:2px solid #CBD5E1;
	padding:0 6px;
	width:100%;
	float:left;
	border-radius:8px;
	height:68px;
	text-align:left;
	line-height:30px;
	font-family:OutfitM;
	resize:none;
	background:0;
}

.device-service-history-group,
.device-service-history-sn {
	height:34px;
	line-height:34px;
	margin-bottom:12px;
	text-align:right;
}

.device-service-history-comments {
	width:100%;
	height:90px;
	clear:both;
}

.device-service-history-outer {
	background:#EFF6FF;
	width:100%;
	height:calc(100% - 282px);
}

.device-service-history-content {
	width:calc(100% - 30px);
	scrollbar-gutter:stable;
	height:calc(100% - 43px);
	overflow-y:scroll;
	background:#fff;
	margin:0 15px;
}

.device-service-history-footer {
	width:100%;
	height:72px;
	padding:12px 15px;
	border-top:1px solid #E2E8F0;
	background:#EFF6FF;
}

.device-service-history-item {
	width:100%;
	height:54px;
	line-height:54px;
	position:relative;
	color:#000;
	overflow:hidden;
	transition:background-color .3s;
	border-bottom:1px solid #E2E8F0;
}

.device-service-history-item:hover {
	background-color:rgba(0, 0, 0, 0.08);
}

.device-service-history-title { 
	margin:0 15px;
	height:44px;
	line-height:44px;
	font-family:OutfitSB;
	font-size:14px;
	background:#fff;
	width:calc(100% - 30px);
	scrollbar-gutter:stable;
	border-radius:24px 24px 0 0;
	overflow:hidden;
	color:#94A3B8;
	border-bottom: 2px solid #E2E8F0;
}

.device-service-history-id,
.device-service-history-number,
.device-service-history-date,
.device-service-history-counter,
.device-service-state-title {
	float:left;
	height:inherit;
	line-height:inherit;
	font-family:inherit;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow:hidden;
	padding-right:10px;
	color:inherit;
}

.device-service-history-id {
	width:100px;
	text-align:right;
}

.device-service-history-number {
	width:calc(30% - 77px);
}

.device-service-history-date,
.device-service-history-counter {
	width:calc(35% - 75px);
}

.device-service-state {
	width:82px;
	text-align:center;
	font-size:10px;
	font-family:OutfitSB;
	margin:14px 20px 0;
	border-radius:4px;
	float:left;
	height:24px;
	line-height:24px;
	padding:0;
}

.device-service-state-title {
	float:left;
	text-align:center;
	width:82px;
	margin:0 20px;
}

.add-device-box {
	width:650px;
	height:480px;
	left:calc(50% - 325px);
}

.add-group-box {
	width:450px;
	height:320px;
	left:calc(50% - 225px);
	top:20%;
}

.link-customer-window {
	width:720px;
	height:540px;
	left:calc(50% - 325px);
}



@media (max-width:1630px) {
	.service-container {
		width:calc(100% - 85px);
	}
	
	.customers-actions-text {
		width:118px;
		font-size:14px;
		padding:14px 8px 0;
	}

	.main2-header {
		z-index:100027;
	}

	.main-search-user-field {
		margin-left:0px;
		width:calc(100% - 85px);
	}

	.main-search-user-input {
		width:calc(100% - 10px);
	}

	.main-search-focus .main-search-user-input {
		width:calc(100% - 105px);
		margin:10px;
	}

	.main-search-user-input-icon {
		margin-left:16px;
	}

	.customers-actions-shortcuts {
		width:190px;
	}

	.customers-actions-item {
		width:170px;
	}

	.customers-actions-charts {
		width:calc(100% - 380px);
	}

	.order-products {
		margin:-60px 20px 0;
		width:calc(100% - 100px);
	}

	.page-header {
		width:100%;
	}
	
	.backwards-link-full-width-header {
		left:25px;
	}

	.customer-form-container {
		width:45%;
	}

	.customer-data-right {
		width:55%;
	}

	.customer-tab {
		width:150px;
	}

	.calendar-sidebar-date-time-week-day,
	.calendar-sidebar-date-time-month,
	.calendar-sidebar-date-time-year {
		color:transparent;
		transition:color .3s;
	}

	.box-calendar-container {
		width:60px;
		transition:width .3s;
	}

	.box-calendar-container:hover {
		width:320px;
	}

	.full-width-container {
		width:calc(100% - 85px);
	}

	.full-width-container-search-calendar {
		margin-left:220px;
	}

	.full-width-container-agent-box {
		right:80px;
	}

	.full-width-container-side-nav {
		width:220px;
	}

	.state-dot {
		left:25px;
	}

	.full-width-container-side-nav-item {
		width:200px;
		padding:0 50px;
	}

	.full-width-page-header-title {
		padding:37px 25px;
	}

	.full-width-container-side-nav {
		width:220px;
	}

	.full-width-container-select-lower {
		left:20px;
	}

	.calendar-sidebard-add-task {
		width:30px;
		height:30px;
		margin:6px 0;
		border-radius:4px;
		padding:1px;
	}

	.box-calendar-day-picker {
		opacity:0;
	}

	.calendar-sidebard-add-task .sidebar-add-task-text {
		color:transparent;
		vertical-align:2px;
	}

	.calendar-sidebar-page-task-item {
		width:30px;
		height:30px;
		margin:6px 0;
		border-radius:20px;
		color:transparent;
	}

	.box-calendar-day-tasks {
		overflow:hidden;
	}

	.time-box {
		width:50px;
		margin-left:-15px;
	}

	.box-calendar-day-tasks-outer {
		width:50px;
		margin-left:-15px;
		padding-left:10px;
	}

	.box-calendar-container {
		background:#EEF6FF;
	}

	.dark-mode .box-calendar-container {
		background:#0F172A;
	}

	.box-calendar-container:hover .calendar-sidebar-page-task-item {
		width:250px;
		height:40px;
		color:#fff;
		border-radius:4px;
		margin:1px 2px;
	}

	.box-calendar-container:hover .box-calendar-day-picker {
		opacity:1;
	}

	.box-calendar-container:hover .box-calendar-day-tasks-outer {
		width:290px;
		margin:0;
		padding-left:20px;
	}

	.box-calendar-container:hover .calendar-sidebard-add-task {
		margin:1px 2px 5px 2px;
		padding:2px;
		transition:all .3s;
		color:#7f7f7f;
		width:250px;
		height:40px;
	}

	.sidebar-no-tasks {
		opacity:0;
	}

	.box-calendar-container:hover .calendar-sidebard-add-task .sidebar-add-task-text {
		color:#7f7f7f;
		vertical-align:7px;
	}

	.box-calendar-container:hover .sidebar-no-tasks {
		opacity:1;
	}

	.box-calendar-container:hover .box-calendar-day-tasks {
		overflow-y:scroll;
	}

	.box-calendar-container:hover .time-box {
		width:290px;
		margin:10px 0 25px;
	}

	.box-calendar-container:hover .calendar-sidebar-date-time-week-day,
	.box-calendar-container:hover .calendar-sidebar-date-time-month,
	.box-calendar-container:hover .calendar-sidebar-date-time-year {
		color:inherit;
	}

	.customers-main-container,
	.index-content .container,
	.customers-list {
		width:calc(100% - 85px);
		padding:0;
	}

	.main-header-title {
		padding:37px 20px
	}

	.customer-data-comments-label {
		left:17px;
	}

	.customer-data-comments-maximized {
		width:calc(182% - 5px);
		height:calc(100vh - 300px);
	}

	.label-maximized {
		display:none;
		opacity:0;
	}

	.add-contact-floating, .add-task-floating, .add-address-floating, .add-order-floating, .add-device-floating {
		left:calc(50% - 80px);
	}

	#loader, #loader-white {
		margin:-75px 0 0 -150px;
	}

	.menu-left-sidebar-text {
		margin-left:20px;
	}
}

@media (max-width:1000px) {
	.customer-form-container {
		width:100%;
		float:left;
	}

	.customer-data-right {
		width:100%;
		float:left;
		padding:10px 10px 20px 20px;
		overflow-y:visible;
		height:100%;
	}

	.customer-data-container {
		width:100%;
		height:100%;
		overflow:hidden;
	}
	
	.customer-form-outer {
		width:calc(100% - 40px);
	}
	
	.customer-data-comments-inner {
		border:0;
		padding:10px;
		margin-top:20px;
		border-radius:0px;
	}
}


.box-editor-customer-comments {
	width:70%;
	height:calc(100% - 300px);
	margin:120px auto 0;
	position:relative;
	background:#f3f6fc;
	border-radius:24px;
	animation:circle-show .25s;
	overflow:hidden;
	opacity:1;
	box-shadow:0px 11px 15px -7px rgba(0, 0, 0, 0.2),
    0px 24px 38px 3px rgba(0, 0, 0, 0.14),
	0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}

.form-customer-comments {
	width:100%;
	height:calc(100% - 64px);
	padding:15px;
}

.comments-footer {
	height:100px;
	width:100%;
	padding:0 20px;
}

.form-big-label {
	width:110px;
	text-align:right;
	float:left;
	line-height:40px;
	font-size:14px;
	transition:color .3s;
}

.input-big-container {
	width:calc(100% - 140px);
	height:40px;
	float:left;
	margin-left:13px;
	position:relative;
	overflow:hidden;
	border-radius:8px;
}

.input-big {
	width:100%;
	height:40px;
	border:0;
	border-bottom:2px solid #E2E8F0;
	background:#F1F5F9;
	transition:all .3s;
	padding:0 8px;
	font-size:14px;
}

.input-underline-active {
	background:#3B82F6;
	height:2px;
	width:0;
	transition:all .3s;
	margin:-2px auto 0;
	z-index:10;
	position:relative;
}

.input-big:focus ~ .input-underline-active,
.input-standard:focus ~ .input-underline-active,
.input-max:focus ~ .input-underline-active,
.task-view-new-contact:focus ~ .input-underline-active,
.task-view-contact-text:focus ~ .input-underline-active,
.textarea-small:focus ~ .input-underline-active,
.service-select:focus ~ .input-underline-active,
.service-form-input:focus:not(:read-only) ~ .input-underline-active,
.service-form-textarea:focus:not(:read-only) ~ .input-underline-active {
	width:100%;
}

.input-search-focus {
	border:2px solid #F3F4F6 !important;
	height:46px;
	background:#F3F4F6;
	width:100% !important;
	margin:2px 0px 0;
	border-radius:8px;
	z-index:22 !important;
}

#input-task-add-customer-name:focus ~ .task-view-go-to,
#input-add-contact-customer:focus ~ .task-view-go-to,
#input-task-view-customer-name:focus ~ .task-view-go-to {
	opacity:0;
}

.form-big-buttons {
	width:312px;
	text-align:right;
	height:100%;
	display:flex;
	float:right;
	margin-top:10px;
}

.form-big-button {
	height:44px;
	padding:0 18px;
	margin-left:25px;
	position:relative;
	overflow:hidden;
}

.customer-view-send-mail {
	width:130px;
	height:38px;
	position:absolute;
	right:-90px;
	z-index:1;
	text-align:center;
	background:#2e7d32;
	padding-top:6px;
	top:0;
	overflow:hidden;
	text-decoration:none;
	color:#fff;
	font-size:14px;
	transition:all .3s;
}

.customer-view-send-mail:hover {
	right:0;
}

.customer-view-send-mail i {
	font-size:26px;
	color:#fff;
}

.customer-view-send-mail span {
	vertical-align:8px;
	margin-left:8px;
}

.customer-window-container {
	height:calc(100% - 172px);
	width:100%;
}

.customer-window-content {
	position:relative;
	z-index:1;
	min-height:100%;
}

.customer-active-tab {
	height:calc(100vh - 325px);
	overflow-y:scroll;
	padding-bottom:70px;
	background: /* Shadow covers */ linear-gradient(white 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), white 70%) 0 100%, /* Shadows */ radial-gradient(50% 0, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(50% 100%, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
    background: linear-gradient(white 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), white 70%) 0 100%, radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
    background-repeat: no-repeat;
    background-color: white;
    background-size: 100% 40px, 100% 0px, 100% 14px, 0% 1px;
    background-attachment: local, local, scroll, scroll;
	scrollbar-gutter:stable;
    width:calc(100% - 48px);
    margin:0 24px;
}

.customer-noscroll-active-tab {
	height:calc(100vh - 325px);
}

.addresses-invoice {
	height:calc(50% - 126px);
	overflow-y:scroll;
	scrollbar-gutter:stable;
    width:calc(100% - 48px);
    margin:0 24px;
}

.addresses-delivery {
	height:calc(50% - 16px);
	overflow-y:scroll;
	padding-bottom:70px;
	scrollbar-gutter:stable;
    width:calc(100% - 48px);
    margin:0 24px;
}

.customer-active-tab-tasks {
	height:calc(100vh - 375px);
	overflow-y:scroll;
	padding-bottom:60px;
	scrollbar-gutter:stable;
	width:calc(100% - 48px);
    margin:0 24px;
}

.customer-active-tab-devices {
	height:calc(100vh - 327px);
	overflow:hidden;
}

.customer-active-tab-footer {
	height:72px;
	width:100%;
	position:absolute;
	bottom:0;
	filter:drop-shadow(0px -2px 7px rgba(0,0,0,0.22));
	z-index:3;
}

.footer-wings {
	width:100%;
	height:34px;
}

.footer-wings-left {
	height:34px;
	float:left;
	width:calc(50% - 78px);
}

.footer-wings-right {
	width:calc(50% - 78px);
	height:34px;
	float:right;
}

.footer-wing-left-up {
	height:15px;
	background:#fff;
	width:calc(100% - 19px);
	float:left;
	border-radius:0 16px 0 0;
}

.footer-wing-right-up {
	float:right;
	height:15px;
	background:#fff;
	width:calc(100% - 19px);
	border-radius:16px 0 0 0;
}

.footer-wing-left {
	height:40px;
	background-image:radial-gradient(circle at 100% 0px, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 19px, #fff 0px);
	float:left;
	width:100%;
	position:relative;
	z-index:1;
}

.footer-wing-right {
	height:40px;
	background-image:radial-gradient(circle at 0% 0px, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 19px, #fff 0px);
	float:right;
	width:100%;
	position:relative;
	z-index:1;
}

.footer-floor {
	width:100%;
	height:36px;
	background:#fff;
}

.contact-item {
	padding:14px 20px;
	position:relative;
	display:flex;
	cursor:pointer;
	box-shadow:0px 3px 14px -1px rgba(0, 0, 0, 0.2);
	margin:15px;
	border-radius:16px;
	transition:background .3s, color .3s;
}

.contact-item:hover {
	background:rgba(0, 0, 0, 0.04) !important;
}

.contact-item-span {
	font-size:11px;
	color:#9f9f9f;
	font-style:normal;
}

.contact-item-row {
	width:100%;
	position:relative;
	display:inline-block;
	padding:3px 0;
}

.contact-item-row a {
	color:#03a9f4;
}

.contact-person {
	width:calc(25% - 20px);
	height:20px;
	float:left;
	margin-right:20px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	font-size:14px;
	font-style:italic;
}

.contact-column-1{
	height:auto;
	width:calc(100% - 100px);
	background:none;
}

.contact-column-2 {
	height:inherit;
	width:100px;
	display:flex;
	z-index:0;
	position:relative;
}

.contact-actions {
	width:100px;
	height:100%;
	line-height:100%;
	display:flex;
	align-items:center;
	color:#9f9f9f;
	font-family:OutfitSB;
}

.contact-person-item {
    border-bottom:1px solid #dfdfdf;
    width:100%;
    position:relative;
	display:flex;
	font-size:14px;
	height:60px;
	overflow:hidden;
	line-height:60px;
}

.contact-person-item:hover {
	background:rgba(0, 0, 0, 0.08);
}

.customer-order-header {
    width:calc(100% - 48px);
	margin:0 24px; 
    position:relative;
	height:48px;
	line-height:48px;
	font-size:14px;
}

.customer-order-header-id {
	width:54px;
	text-align:right;
}

.customer-order-header-number {
	width:120px;
	text-align:right;
}

.customer-order-header-invoice {
	width:calc(50% - 280px);
}

.customer-order-header-delivery {
	width:calc(50% - 300px);
}

.customer-order-header-date {
	width:134px;
}

.customer-order-header-options {
	float:left;
	width:150px;
	font-family:OutfitSB;
	color:#9f9f9f;
}

.customer-order-header-state {
	width:82px;
	text-align:center;
	float:left;
	margin:0 20px 0;
	font-family:OutfitSB;
	color:#9f9f9f;
}

.customer-order-header-id,
.customer-order-header-number,
.customer-order-header-invoice,
.customer-order-header-delivery,
.customer-order-header-date {
	float:left;
	font-family:OutfitSB;
	padding-right:6px;
	color:#9f9f9f;
}


.customer-order-item {
	border-bottom:1px solid rgba(0, 0, 0, 0.12);
    width:100%;
    position:relative;
	font-size:14px;
	height:54px;
	overflow:hidden;
}

.customer-order-item:hover {
	background:rgba(0,0,0,.08);
}

.customer-order-item-id {
	width:54px;
	line-height:54px;
	text-align:right;
}

.customer-order-item-number {
	width:120px;
	line-height:54px;
	text-align:right;
}

.customer-order-item-invoice {
	width:calc(50% - 280px);
	line-height:54px;
}

.customer-order-item-delivery {
	width:calc(50% - 300px);
	line-height:54px;
}

.customer-order-item-date {
	width:134px;
	line-height:54px;
}

.customer-order-options {
	float:left;
	width:150px;
	padding:6px 0;
}

.customer-order-item-state {
	width:82px;
	text-align:center;
	font-size:11px;
	margin:14px 20px 0;
	border-radius:4px;
	float:left
}

.small-list-header {
	width:calc(100% - 48px);
	margin:0 24px;
	position:relative;
	display:flex;
	height:48px;
	font-size:14px;
}

.customer-view-category-dot {
	width:20px;
	height:20px;
	float:left;
	background:var(--bg_category);
	border-radius:50%;
	margin-top:20px;
}

.customer-view-category-name {
	width:calc(100% - 24px);
	margin-left:4px;
	float:left;
	text-overflow:ellipsis;
	overflow:hidden;
}

.title-customer-view-task-item-user,
.customer-view-task-item-user {
	width:24%;
	padding-left:8px;
}

.title-customer-view-task-item-category,
.customer-view-task-item-category,
.title-contact-person-title,
.title-contact-person-position {
	width:14%;
}

.title-customer-view-task-item-title,
.customer-view-task-item-title {
	width:31%;
}

.title-customer-view-task-item-day,
.customer-view-task-item-day {
	width:11%;
}

.title-customer-view-task-item-end,
.customer-view-task-item-end,
.title-customer-view-task-item-start,
.customer-view-task-item-start {
	width:10%;
}

.title-customer-view-task-item-user,
.title-customer-view-task-item-category,
.title-customer-view-task-item-title,
.title-customer-view-task-item-day,
.title-customer-view-task-item-start,
.title-customer-view-task-item-end {
	float:left;
	line-height:48px;
	padding-right:4px;
	font-family:OutfitSB;
	color:#9f9f9f;
}

.title-contact-person-mail {
	width:22%;
}

.title-contact-person-phone,
.title-contact-person-cell {
	width:13%;
}

.title-small-list-header {
	height:40px;
}

.title-contact-person-cell,
.title-contact-person-phone,
.title-contact-person-mail,
.title-contact-person-title,
.title-contact-person-position,
.title-contact-person-name {
	float:left;
	line-height:40px;
	padding:0 6px;
	font-family:OutfitSB;
}

.title-contact-person-name {
	width:24%;
	padding:0 6px 0 0;
}

.box-validate-customer {
	width:70%;
	height:70%;
	position:absolute;
	box-shadow:0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.20);
	animation:circle-show .25s;
	top:15%;
	left:15%;
	border-radius:24px;
	overflow:hidden;
}

.box-validate-customer-header {
	height:80px;
	background:#b71c1c;
	width:100%;
	font-size:22px;
	padding:0 30px;
	line-height:80px;
	color:#fff;
}

.box-validate-customer-content {
	height:calc(100% - 192px);
	width:100%;
	position:relative;
	background:#EFF6FF;
	overflow-y:scroll;
}

.box-validate-customer-items-header {
	width:100%;
	padding:0 47px 0 30px;
	height:40px;
	border-bottom:1px solid #cfcfcf;
	display:flex;
	line-height:40px;
	background:#EFF6FF;
	font-size:14px;
	font-family:"OutfitM";
}

.box-validate-customer-inner {
	width:100%;
	height:auto;
}

.box-validate-customer-item {
	width:100%;
	padding:0 30px;
	height:46px;
	border-bottom:1px solid #cfcfcf;
	line-height:46px;
	color:#000;
}

.box-validate-customer-item:hover {
	background:rgba(0, 0, 0, 0.04);
}

.box-validate-customer-item-id {
	width:5%;
	text-align:right;
	padding-right:12px;
}

.box-validate-customer-item-name {
	width:27%;
}

.box-validate-customer-item-short {
	width:25%;
}

.box-validate-customer-item-nip,
.box-validate-customer-item-street {
	width:15%;
}

.box-validate-customer-item-city {
	width:10%;
}

.box-confirm-delete {
	width:400px;
	height:150px;
	background:#f3f6fc;
	box-shadow:0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.20);
	animation:circle-show .25s;
	border-radius:24px;
	overflow:hidden;
	top:300px;
	left:calc(50% - 200px);
	position:absolute;
	padding:15px;
}

.box-confirm-delete-content {
	height:78px;
	font-size:19px;
	line-height:40px;
	text-align:center;
}

.delete-box-warning {
	font-size:14px;
	color:#b71c1c;
	line-height:20px;
	width:100%;
	display:block;
	font-family:OutfitM;
}

.box-confirm-delete-footer {
	height:72px;
}

.changelog-container {
	position:relative;
	margin-top:40px;
}

.changelog-version-item {
	border-radius:24px;
	box-shadow:0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.20);
	width:calc(100% - 80px);
	position:relative;
	margin:0 40px 30px;
	background:#fff;
	padding:20px;
}

.changelog-strong-span {
	font-size:18px;
	font-family:OutfitSB;
	color:#d32f2f;
	display:block;
}

.changelog-version-item-ver {
	font-family:OutfitSB;
	font-size:24px;
}

.changelog-level-1 {
	list-style-position:inside;
	list-style-type:decimal; 
	font-size:18px;
	font-family:OutfitSB;
}

.changelog-level-2 {
	list-style-position:inside;
	list-style-type:disc;
	padding:0 15px;
	font-size:18px;
	font-weight:normal;
}

.changelog-label-experimental,
.changelog-label-fixed,
.changelog-label-new {
	color:#fff;
	padding:0 10px;
	height:28px;
	border-radius:4px;
	line-height:28px;
	text-transform:uppercase;
	font-family:OutfitSB;
	font-size:13px;
	display:inline-block;
	margin:20px 0 10px;
}

.changelog-label-experimental {
	background:#7e57c2;
}
.changelog-label-fixed {
	background:#d32f2f;
}
.changelog-label-new {
	background:#33691e;
}




@media (max-width:1630px) {
	.menu-left-sidebar {
		width:70px;
		overflow:hidden;
		transition:width .3s;
		z-index:10001;
		background:#EEF6FF;
	}

	.dark-mode .menu-left-sidebar {
		background:#0F172A;
	}

	.menu-left-sidebar:hover {
		width:280px;
	}

	.menu-left-sidebar-logo-img {
		margin:16px 0px 0 -22px;
	}

	.menu-left-sidebar:hover .menu-left-sidebar-logo-img {
		margin:16px 10px;
	}

	.menu-left-sidebar-item {
		margin:4px 12px;
		width:44px;
		border-radius:22px;
	}
	.menu-left-sidebar:hover .menu-left-sidebar-item {
		margin:4px 20px;
		width:240px;
	}

	.menu-left-sidebar-item-link {
		padding:11px 15px 0 12px;
	}

	.menu-left-sidebar:hover .menu-left-sidebar-item-link {
		padding:11px 15px 0 20px;
	}

	.main-content,
	.full-height-main-content,
	.calendar-content,
	.index-content,
	.main-management-content {
		width:calc(100% - 70px) !important;
	}

	.main2-header {
		width:calc(100% - 70px);
	}

	.state-counter {
		width:24px;
		height:24px;
		font-size:11px;
		top:27px;
		right:-24px;
	}

	.state-counter:after {
		width:24px;
		height:24px;
	}

	.menu-left-sidebar:hover .state-counter {
		width:28px;
		height:28px;
		padding-top:4px;
		top:11px;
		position:absolute;
		right:-6px;
		font-size:13px;
	}

	.menu-left-sidebar:hover .state-counter:after {
		width:28px;
		height:28px;
	}
}


.task-overdue {
	background:rgba(200,0,0,0.24);
}

.task-overdue:hover {
	background:rgba(200,0,0,0.34);
}

.task-executed {
	background:#afafaf;opacity:0.5;
}

.task-executed:hover {
	background:#afafaf;opacity:0.7;
}

.input-standard:disabled,
.task-view-new-contact:disabled,
.input-big:disabled,
.task-view-contact-text:disabled,
.task-view-contact-text-small[disabled],
.input-max:disabled,
.input-standard:disabled ~ label,
.task-view-new-contact:disabled ~ label,
.task-view-contact-text:disabled ~ label,
.input-big:disabled ~ label,
.input-max:disabled ~ label {
	opacity:.5;
}

.task-view-contact-text:hover,
.task-view-contact-text-small:not([disabled]):hover {
	border:2px solid #4f4f4f;
}

.task-view-contact-text:focus-within,
.task-view-contact-text-small:not([disabled]):focus-within {
	border:2px solid #2962ff;
}


.task-view-new-contact:not([disabled]):hover {
	border-bottom:1px solid rgba(0, 0, 0, 1);
}

.task-view-new-contact:not([disabled]):focus,
.task-view-contact-text:not([disabled]):focus {
	border-bottom:1px solid #2962ff;
	background:#dfdfdf;
}

.input-big:hover,
.input-big:focus {
	background:#E2E8F0;
}

.input-max:not([disabled]):hover,
.input-standard:not([disabled]):hover,
.textarea-small:not([disabled]):hover  {
	border:2px solid #0F172A;
}

.input-max:not([disabled]):hover ~ .label-standard,
.input-standard:not([disabled]):hover ~ .label-standard,
.textarea-small:not([disabled]):hover ~ .label-standard {
	color:#0F172A;
}

.input-max:not([disabled]):focus,
.input-standard:not([disabled]):focus,
.textarea-small:not([disabled]):focus{
	border:2px solid #2563EB;
}


.input-max:not([disabled]):focus ~ .label-standard,
.input-standard:not([disabled]):focus ~ .label-standard,
.textarea-small:not([disabled]):focus ~ .label-standard  {
	color:#2563EB;
}




/*dark-mode_start*/

.dark-mode .tiny-titles-outer,
.dark-mode .devices-title,
.dark-mode .customers-list-header,
.dark-mode .complaint-card-header-titles,
.dark-mode .small-titles-outer {
	border-bottom:2px solid #334155;
}

.dark-mode .order-view-details-products,
.dark-mode .customers-overdue-content,
.dark-mode .customers-favs-content,
.dark-mode .customer-active-tab {
	background:/* Shadow covers */ linear-gradient(#1E293B 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), #1E293B 70%) 0 100%, /* Shadows */ radial-gradient(50% 0, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(50% 100%, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
    background:linear-gradient(#1E293B 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), #1E293B 70%) 0 100%, radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
	background-repeat:no-repeat;
	background-color:#1E293B;
	background-size:100% 40px, 100% 0px, 100% 14px, 0% 1px;
    background-attachment: local, local, scroll, scroll;
}

.dark-mode .full-width-container-select {
	background:#334155;
	color:#dfdfdf;
}

.dark-mode .devices-item {
	color:#d7d7d7;
	border-bottom:1px solid #334155;
}

.dark-mode .update-popup-container {
	background:#0F172A;
}

.dark-mode .changelog-version-item {
	background:#1E293B;
	color:#dfdfdf;
}

.dark-mode .update-popup-footer {
	background:#0F172A;
	border-top:1px solid #334155;
}

body.dark-mode,
.dark-mode .main2-header {
	background:#0F172A;
}

.dark-mode .profile-menu-item i {
	color:#ddd;
}

.dark-mode #main2-footer {
	border-top:1px solid #5f5f5f;
}

.dark-mode .input-underline-active {
	background:#93C5FD;
}

.dark-mode .date-time,
.dark-mode .topics,
.dark-mode .company-card,
.dark-mode .adress-card,
.dark-mode .my-printers-item,
.dark-mode .product-section,
.dark-mode .services {
	background:#1f1f1f;
}

.dark-mode .main-navbar,
.dark-mode .top-bar,
.dark-mode .topics,
.dark-mode .company-card,
.dark-mode .my-printers-item,
.dark-mode .no-msg-background,
.dark-mode .thread-message,
.dark-mode .messenger,
.dark-mode .cart-container,
.dark-mode .delivery-container,
.dark-mode .main-ready-content,
.dark-mode .ready-error-message,
.dark-mode .adress-card,
.dark-mode .product-card,
.dark-mode .product-section-item,
.dark-mode .product-section-item-cart-input-count-decrement,
.dark-mode .product-section-item-cart-input-count-increment,
.dark-mode .product-section-item-cart-input-count,
.dark-mode .offer-item-window,
.dark-mode .account-settings,
.dark-mode .new-service-added-box{
	box-shadow:0 4px 5px 0 rgba(0,0,0,.55),0 1px 1px 0 rgba(0,0,0,.64),0 2px 1px -1px rgba(0,0,0,.64);
}

.dark-mode .profile-button-img {
	background:url(/images/user-icon-light-gray.png);
	background-size:cover;
}

.dark-mode .orders-cards {
	background:#181818;
	color:#dfdfdf;
}

.dark-mode .my-printer-desc,
.dark-mode .company-item-header {
	background:#242424;
}

.dark-mode .customer-order-item:hover,
.dark-mode .address-invoice-item:hover,
.dark-mode .address-delivery-item:hover,
.dark-mode .profile-menu-item:hover,
.dark-mode .menu-left-sidebar-item:hover,
.dark-mode .customers-actions-item:hover,
.dark-mode .task-view-new-contact:not([disabled]):focus, 
.dark-mode .task-view-contact-text:not([disabled]):focus,
.dark-mode .customer-options-item:hover,
.dark-mode .arrow-discard:hover,
.dark-mode .task-view-discard:hover,
.dark-mode .note-view-btn:hover,
.dark-mode .complaint-form-close:hover,
.dark-mode .task-view-delete:hover,
.dark-mode .customer-order-item:hover,
.dark-mode .customer-tab-active,
.dark-mode .order-details-product:hover,
.dark-mode .devices-item:hover,
.dark-mode .orders-card:hover,
.dark-mode .rounded-button:hover,
.dark-mode .devices-action-btn:hover,
.dark-mode .calendar-sidebard-add-task:hover,
.dark-mode .contact-list-href:hover,
.dark-mode .box-validate-customer-item:hover,
.dark-mode .customers-overdue-task-item:hover,
.dark-mode .customers-favs-item:hover,
.dark-mode .customers-list-item:hover,
.dark-mode .pagination-item:hover,
.dark-mode .contact-person-item:hover,
.dark-mode .customer-data-contact-person-item:hover {
	background:rgba(255,255,255,.08);
}

.dark-mode .profile-menu-item:active,
.dark-mode .menu-left-sidebar-item:active,
.dark-mode .arrow-discard:active,
.dark-mode .task-view-discard:active,
.dark-mode .note-view-btn:active,
.dark-mode .complaint-form-close:active,
.dark-mode .task-view-delete:active,
.dark-mode .customer-tab:hover,
.dark-mode .order-details-product:active,
.dark-mode .orders-card:active,
.dark-mode .rounded-button:active,
.dark-mode .devices-action-btn:active,
.dark-mode .calendar-sidebard-add-task:active,
.dark-mode .customers-overdue-task-item:active,
.dark-mode .customers-favs-item:active,
.dark-mode .pagination-item:active {
	background:rgba(255,255,255,.12);
}



.dark-mode .product-section-item {
	background:#373737;
	border-radius:4px;
}

.dark-mode .product-section-item-name,
.dark-mode .customer-title,
.dark-mode .page-title,
.dark-mode .service-header-span,
.dark-mode .service-header-btn i {
	color:#efefef;
}

.dark-mode .product-section-close {
	background:#2cf;
	color:#000;
}

.dark-mode .product-section-close:hover {
	background:#3df;
}

.dark-mode .product-section-close:active {
	background:#4ef;
}

.dark-mode .product-section-item-name:hover {
	color:#2cf;
}

.dark-mode .menu-left-sidebar-item-link {
	color:rgba(255, 255, 255, 0.8);
}

.dark-mode .menu-left-sidebar-item-acitve .menu-left-sidebar-item-link {
	color:rgba(255,255,255,.7);
}

.dark-mode .order-href {
	color:#efefef;
}

.dark-mode .no-msg-text,
.dark-mode .index-no-msg-text {
	text-shadow:1px 4px 6px #212121, 0 0 0 #000, 1px 4px 6px #212121;
}

.dark-mode #profile-menu,
.dark-mode .notify-panel {
	background:#334155;
	box-shadow:0 0px 70px rgba(0,0,0,0.86);
}

.dark-mode .profile-menu-item-a {
	color:#efefef;
}

.dark-mode .notify-button-icon:hover,
.dark-mode .profile-button:hover,
.dark-mode .button-discard:hover {
	background:rgba(255,255,255,0.1);
}

.dark-mode .notify-button-img {
	background:url(/images/notification-light-gray.png);
	background-size:cover;
}

.dark-mode .notify-panel-header {
	color:#fff;
	border-bottom:1px solid #505050;
}

.dark-mode .notify-panel-footer {
	color:#fff;
	border-bottom:1px solid #505050;
	border-top:1px solid #505050;
}

.dark-mode .notify-panel-content {
	background:#1a1a1a;
}

.dark-mode .notify-panel-item {
	background:#424242;
	color:#efefef;
}

.dark-mode .main-header-search-bar {
	background-color:#565656;
	color:#cecece;
}

.dark-mode .main-header-search-bar:focus {
	background-color:#666666;
	color:#dfdfdf;
}

.dark-mode .account-settings  {
	background:#313131;
	color:#dedede;
}

.dark-mode .account-settings-column-header {
	border-bottom:1px solid #afafaf;
}

.dark-mode .contact-box-icon-mail {
	background:url('/images/mail_white.png');
}

.dark-mode .contact-box-icon-phone {
	background:url('/images/phone_white.png');
}

.dark-mode .contact-box a,
.dark-mode .go-to-all-orders {
	color:#2196f3;
}

.dark-mode .state-0-big, .dark-mode .state-0,
.dark-mode .state-1-big, .dark-mode .state-1,
.dark-mode .state-2-big, .dark-mode .state-2,
.dark-mode .state-3-big, .dark-mode .state-3,
.dark-mode .state-4-big, .dark-mode .state-4,
.dark-mode .state-6-big, .dark-mode .state-6,
.dark-mode .state-7-big, .dark-mode .state-7,
.dark-mode .state-9-big, .dark-mode .state-9 {
	color:#000;
}

.dark-mode .state-inactive-big, .dark-mode .state-inactive {
	background:#606060;
	color:#909090;
}

.dark-mode .small-box {
	background:#81c784;
	color:#000;
}

.dark-mode .fast-order-add-cart {
	color:#1f1f1f;
}

.dark-mode .cart-container {
	background:#323232;
}

.dark-mode .cart-next-step {
	background:#90caf8;
	color:#1f1f1f;
}

.dark-mode .delivery-container {
	background:#323232;
}

.dark-mode .invoice-select-title,
.dark-mode .delivery-select-title,
.dark-mode .radio-button-text {
	color:#efefef;
}

.dark-mode .checked-bg {
	background:#424242;
}

.dark-mode .delivery-select-radio-label:hover .checked-bg {
	background:#323232;
}

.dark-mode .radio-input:checked ~ .checked-bg {
	background:#90caf8;
}

.dark-mode .radio-input:checked ~ .radio-button-text,
.dark-mode .stepper-item-dot {
	color:#1f1f1f;
}

.dark-mode .stepper-item-complete .stepper-item-dot {
	background:url("/images/complete_black.svg") #90caf8;
}
.dark-mode .stepper-item-active .stepper-item-dot  {
	background-color:#90caf8;
}

.dark-mode .stepper-item-complete .stepper-item-title,
.dark-mode .stepper-item-active .stepper-item-title,
.dark-mode .cart-prev-step  {
	color:#fff;
}

.dark-mode .cart-prev-step:hover {
	background:#3f3f3f;
}

.dark-mode .cart-prev-step:active {
	background:#6f6f6f;
}

.dark-mode .order-field {
	color:#bfbfbf;
}

.dark-mode .order-legend {
	background:#1E293B;
	color:#cfcfcf;
}

.dark-mode .offer-header {
	background:#424242;
}

.dark-mode .offer-item {
	border-bottom:1px solid #282828;
	background:#424242;
}

.dark-mode .offer-item:hover {
	background:#393939;
}

.dark-mode .offer-item-a,
.dark-mode .contact-item-row,
.dark-mode .offer-card,
.dark-mode .box-calendar-day-picker-date {
	color:#efefef;
}

.dark-mode .sidebar-picker-btn,
.dark-mode .devices-footer-btn {
	background:#3B82F633;
	color:#60A5FA !important;
}

.dark-mode .sidebar-picker-btn:hover,
.dark-mode .sidebar-picker-btn:active,
.dark-mode .devices-footer-btn:hover,
.dark-mode .devices-footer-btn:active {
	background:#3B82F64D;
}

.dark-mode .calendar-page-task-item {
	filter:brightness(65%);
}

.dark-mode .calendar-page-day:hover {
	background:#0F172A;
}

.dark-mode .calendar-page-day {
	border:1px solid #334155;
}

.dark-mode .card-orders {
	background:#93C5FD;
}

.dark-mode .card-prices {
	background:#FDBA74;
}

.dark-mode .card-tasks-today {
	background:#86EFAC;
}

.dark-mode .card-tasks-after {
	background:#F9A8DD;
}

.dark-mode .main-search-user-input-icon {
	filter:invert(1) opacity(.7);
}

.dark-mode .main-search-user-input {
	color:#efefef;
}

.dark-mode .main-search-user-input::placeholder {
	color:#afafaf;
}

.dark-mode .main-search-user-input:focus + i {
	filter:invert(1) opacity(.9);
}

.dark-mode .main-search-user-header {
	color:#efefef !important;
}

.dark-mode .main-search-user-item:hover {
	background:#475569;
}

.dark-mode .customers-actions-charts-inner {
	border-left:1px solid #323232;
}

.dark-mode .active-side-nav {
	background:#323232;
}

.dark-mode .full-width-container-side-nav-item:hover,
.dark-mode .group-item:hover {
	background:#242424;
}

.dark-mode .active-side-nav:hover {
	background:#404040;
}

.dark-mode .full-width-container-agent-select {
	border-left:1px solid #4f4f4f;
}

.dark-mode .chart-border {
	border-bottom:1px dashed #3f3f3f;
}

.dark-mode .chart-scale-grid-line {
	border-top:1px dashed #3f3f3f;
}

.dark-mode .card-list-item {
	border-top:1px solid #323232;
}

.dark-mode .contact-list-href {
	color:#99f;
}

.dark-mode .customer-favs-name:hover {
	color:#fff;
}

.dark-mode .customer-favs-mail a:hover {
	color:#81d4fa;
}

.dark-mode .customers-overdue-task-item,
.dark-mode .customers-favs-item,
.dark-mode .customers-list-item,
.dark-mode .service-item,
.dark-mode .customer-order-item,
.dark-mode .customer-order-header,
.dark-mode .complaint-item {
	border-bottom:1px solid #334155;
}

.dark-mode .pagination-active {
	background:#003c8f;
	color:rgba(255,255,255,.7);
}

.dark-mode .pagination-active:hover {
	background:#005cb2;
}

.dark-mode .calendar-sidebar-page-task-item {
	filter:brightness(70%);
}

.dark-mode .service-item:hover,
.dark-mode .task-view-customer-search-item:hover,
.dark-mode .customers-list-footer,
.dark-mode .footer-floor,
.dark-mode .footer-wing-left-up,
.dark-mode .footer-wing-right-up,
.dark-mode .sum-box,
.dark-mode .customer-tabs-row,
.dark-mode .main-search-focus .main-search-user-input,
.dark-mode .main-search-user-item {
	background:#334155;
}

.dark-mode .task-view-header {
	filter:brightness(75%);
}

.dark-mode .task-view-content,
.dark-mode .task-view-footer,
.dark-mode .view-person-content,
.dark-mode .floating-window-content,
.dark-mode .view-address-content,
.dark-mode .type-tab-active,
.dark-mode .label-standard,
.dark-mode .device-service-history-footer,
.dark-mode .device-service-history-top, 
.dark-mode .device-service-history-outer,
.dark-mode .task-view-customer-search-item,
.dark-mode .customer-data-comments,
.dark-mode .services-option,
.dark-mode .input-big option,
.dark-mode .service-container,
.dark-mode .order-products,
.dark-mode .calendar-page-inner,
.dark-mode .box-editor-customer-comments,
.dark-mode .complaint-form,
.dark-mode .action-form-footer,
.dark-mode .card-row,
.dark-mode .orders,
.dark-mode .fast-order,
.dark-mode .card-container,
.dark-mode .full-height-card-container,
.dark-mode .box-calendar-day-tasks-outer,
.dark-mode .time-box,
.dark-mode .complaint-card {
	background:#1E293B;
}

.dark-mode .device-billing-titles,
.dark-mode .device-service-history-title {
	border-bottom:2px solid #475569;
}

.dark-mode .device-service-history-title,
.dark-mode .device-service-history-content {
	background:#2E394B;
}

.dark-mode .device-service-history-item {
	border-bottom:1px solid #475569;
	color:#dfdfdf;
}

.dark-mode .device-service-history-item:hover {
	background:#475569;
}

.dark-mode .type-tab-active {
    color:#2196f3;
    border-bottom:3px solid #2196f3;
}

.dark-mode .task-view-new-contact {
	background:#323232;
	color:#efefef;
}

.dark-mode .input-standard,
.dark-mode .input-max,
.dark-mode .task-view-contact-text,
.dark-mode .task-view-contact-text-small,
.dark-mode .textarea-small,
.dark-mode .bordered-text,
.dark-mode .bordered-text-long {
	color:#efefef;
	border:2px solid #475569;
}

.dark-mode .input-note-pick {
	color:#efefef;
}

.dark-mode .input-standard option,
.dark-mode .input-max option {
	background:#1E293B;
	color:#dfdfdf;
}

.dark-mode .input-standard:not([disabled]):hover,
.dark-mode .input-max:not([disabled]):hover,
.dark-mode .task-view-contact-text:not([disabled]):hover,
.dark-mode .task-view-contact-text-small:not([disabled]):hover,
.dark-mode .textarea-small:not([disabled]):hover {
	border:2px solid #64748B;
}

.dark-mode .input-standard:not([disabled]):focus,
.dark-mode .input-max:not([disabled]):focus,
.dark-mode .task-view-contact-text:not([disabled]):focus-within,
.dark-mode .task-view-contact-text-small:not([disabled]):focus-within,
.dark-mode .textarea-small:not([disabled]):focus {
	border:2px solid #93C5FD;
}

.dark-mode .input-max:not([disabled]):hover ~ .label-standard, 
.dark-mode .input-standard:not([disabled]):hover ~ .label-standard, 
.dark-mode .textarea-small:not([disabled]):hover ~ .label-standard {
	color:#64748B;
}

.dark-mode .input-max:not([disabled]):focus ~ .label-standard, 
.dark-mode .input-standard:not([disabled]):focus ~ .label-standard, 
.dark-mode .textarea-small:not([disabled]):focus ~ .label-standard {
	color:#93C5FD;	
}

.dark-mode .label-standard {
	color:#64748B;
}

.dark-mode .card-title,
.dark-mode .no-items-text,
.dark-mode .loading-status,
.dark-mode .loading-status-addresses,
.dark-mode .card-title-stats,
.dark-mode .main-search-user-item,
.dark-mode .customers-actions-item,
.dark-mode .scale-item,
.dark-mode .week-label,
.dark-mode .chart-label,
.dark-mode .month-label,
.dark-mode .full-width-container-side-nav-item,
.dark-mode .customers-overdue-task-item,
.dark-mode .customers-favs-item,
.dark-mode .pagination-item,
.dark-mode .customers-list-item,
.dark-mode .device-service-history-title, 
.dark-mode .device-service-history-content,
.dark-mode .device-service-history-top,
.dark-mode .page-title,
.dark-mode .main-header-title,
.dark-mode .time-box,
.dark-mode .service-item,
.dark-mode .customer-order-item,
.dark-mode .customer-order-header,
.dark-mode .label-checkbox,
.dark-mode .devices-groups-title,
.dark-mode .group-item,
.dark-mode .arrow-discard,
.dark-mode .task-view-discard,
.dark-mode .note-view-btn,
.dark-mode .task-view-delete,
.dark-mode .task-view-customer-search-item,
.dark-mode .rounded-button i,
.dark-mode .full-width-container-agent-label,
.dark-mode .full-width-container-user-label,
.dark-mode .full-width-container-state-label,
.dark-mode .note-frame,
.dark-mode .devices-action-btn i,
.dark-mode a.note-dropdown-item,
.dark-mode .sum-box,
.dark-mode .devices-list-container,
.dark-mode .orders-header-title,
.dark-mode .small-header-title,
.dark-mode .customer-order-item,
.dark-mode .customer-order-header,
.dark-mode .profile-button-text,
.dark-mode .company-card,
.dark-mode .adress-card,
.dark-mode .my-printers-item,
.dark-mode .button-discard,
.dark-mode .contact-box,
.dark-mode .sidebar-no-tasks,
.dark-mode .form-big-label,
.dark-mode .management-catalog-item-name,
.dark-mode .sidebar-footer-content {
	color:#dfdfdf;
}

.dark-mode .task-view-row-small,
.dark-mode .task-view-footer,
.dark-mode .device-service-history-footer,
.dark-mode .customer-data-persons-inner {
	border-top:1px solid #334155;
}

.dark-mode .devices-groups-container {
	border-right:1px solid #334155;
}

.dark-mode .task-view-customer-search-field {
	background:#0F172A;
}

.dark-mode .input-search-focus {
	border:2px solid #1E293B !important;
	background:#1E293B !important;
}

.dark-mode .box-confirm-delete {
	background:#1E293B;
	color:#efefef;
}

.dark-mode .contact-person-item {
	color:#dfdfdf;
	border-bottom:1px solid #2f2f2f;
}

.dark-mode .box-validate-customer-item {
	color:#dfdfdf;
	border-bottom:1px solid #334155;
}

.dark-mode .box-validate-customer-items-header {
	color:#afafaf;
	border-bottom:1px solid #334155;
	background:#1E293B;
}

.dark-mode .customer-data-contact-person-item {
	color:#cfcfcf;
	border-bottom:1px solid #334155;
}

.dark-mode .contact-item:hover {
	background:#334155 !important;
}

.dark-mode .task-overdue:hover {
	background:rgba(200,0,0,0.34);
}

.dark-mode .task-executed {
	background:#4f4f4f;
	opacity:0.5;
}

.dark-mode .task-executed:hover {
	background:#4f4f4f;
	opacity:0.7;
}

.dark-mode .address-delivery-item,
.dark-mode .address-invoice-item,
.dark-mode .management-catalog-item {
	color:#dfdfdf;
	border-bottom:1px solid #2f2f2f;
}

.dark-mode .customer-tab {
	color:#74849B;
}

.dark-mode .customer-tab-active .customer-tab-name {
	color:#93C5FD;
	border-bottom:4px solid #93C5FD;
}

.dark-mode .customer-data-persons,
.dark-mode .customer-form-outer,
.dark-mode .customer-data-comments {
	border:2px solid #334155;
}

.dark-mode .input-big {
	color:#dfdfdf;
	background:#334155;
	border-bottom:2px solid #475569;
}

.dark-mode .input-big:hover,
.dark-mode .input-big:focus {
	background:#475569;
}

.dark-mode .address-type-tabs {
	background:#1f1f1f;
}

.dark-mode .tiny-header-outer,
.dark-mode .customer-options-box,
.dark-mode .devices-search-field {
	background:#334155;
	color:#efefef;
}

.dark-mode .customer-data-comments-label,
.dark-mode .customer-data-label {
	background:#1E293B;
	color:#64748B;
}

.dark-mode .ripple-effect {
	background:rgba(255,255,255,0.2);
}

.dark-mode .ripple-light {
	background:rgba(255,255,255,.2);
}

.dark-mode .full-width-container-search-bar,
.dark-mode .full-width-container-agent-select,
.dark-mode .management-aside {
	background:#334155;
	color:#94A3B8;
}

.dark-mode .full-width-container-search-bar:focus {
	background:#475569;
	color:#efefef;
	box-shadow: 0px 1px 2px 0px #0000004D,  0px 2px 6px 2px #00000026;
}

.dark-mode .customer-data-comments .customer-data-comments-inner,
.dark-mode .management-aside-item-span,
.dark-mode .management-aside-item i {
	color:#efefef;
}

.dark-mode .management-aside-item:hover,
.dark-mode .management-aside-item-active,
.dark-mode .management-catalog-item:hover {
	background:#323232;
}

.dark-mode .customer-data-comments-inner td {
	border:1px solid #3f3f3f;
}

.dark-mode .input-max ~ i,
.dark-mode .customer-options i {
	color:#9f9f9f;
}

.dark-mode .contact-person a,
.dark-mode .address-delivery-item a,
.dark-mode .customer-data-contact-person-mail a,
.dark-mode .sidebar-footer-content a {
	color:#2196f3;
}

.dark-mode .customers-actions-icon,
.dark-mode .icon-left-arrow,
.dark-mode .icon-save {
	filter:invert(1) opacity(.7);
}

.dark-mode .input-standard:disabled,
.dark-mode .task-view-new-contact:disabled,
.dark-mode .task-view-contact-text:disabled,
.dark-mode .task-view-contact-text-small:disabled,
.dark-mode .input-big:disabled,
.dark-mode .input-max:disabled
.dark-mode .input-standard:disabled ~ label,
.dark-mode .task-view-new-contact:disabled ~ label,
.dark-mode .task-view-contact-text:disabled ~ label,
.dark-mode .task-view-contact-text-small ~ label,
.dark-mode .input-big:disabled ~ label,
.dark-mode .input-max:disabled ~ label {
	opacity:.4;
	color:#afafaf;
}


.dark-mode .box-validate-customer-content {
	background:#1E293B;
	color:#afafaf;
}

.dark-mode .note-toolbar {
	background:#475569;
	border-bottom:1px solid #475569;
}

.dark-mode .note-btn {
	color:#dfdfdf;
	background-color:#202020;
	border-color:#282828;
}

.dark-mode .note-icon-bar {
	border-top:1px solid #cfcfcf !important;
}

.dark-mode .note-statusbar {
	border-top:1px solid #475569 !important;
	background:#475569 !important;
}

.dark-mode .overlay-fixed, 
.dark-mode .overlay,
.dark-mode .overlay-inner,
.dark-mode .overlay-container {
	background:rgba(0,0,0,0.6);
}

.dark-mode .add-full-width-container {
	background:#003c8f;
	color:rgba(255,255,255,.7);
}

.dark-mode .add-full-width-container:hover {
	background:#005cb2;
}

.dark-mode .task-view-save,
.dark-mode .floating-button,
.dark-mode .customer-data-persons-add,
.dark-mode .customer-data-comments-edit,
.dark-mode .customer-data-comments-maximize,
.dark-mode .complaint-form-btn,
.dark-mode .button-main,
.dark-mode .task-view-go-to,
.dark-mode .view-person-header,
.dark-mode .floating-header,
.dark-mode .floating-task-view-save {
	background:#003c8f;
	color:rgba(255,255,255,.7);
}

.dark-mode .task-view-save:hover,
.dark-mode .floating-button:hover,
.dark-mode .customer-data-persons-add:hover,
.dark-mode .customer-data-comments-edit:hover,
.dark-mode .customer-data-comments-maximize:hover,
.dark-mode .complaint-form-btn:hover,
.dark-mode .button-main:hover,
.dark-mode .task-view-go-to:hover,
.dark-mode .floating-task-view-save:hover {
	background:#005cb2;
}

.dark-mode .action-form-header {
	background:#003c8f;
}

.dark-mode .contact-item {
	background:#2E394B;
}

.dark-mode .footer-wing-left {
	background-image:radial-gradient(circle at 100% 0px, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 19px, #334155 0px);
}
.dark-mode .footer-wing-right {
	background-image:radial-gradient(circle at 0% 0px, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 19px, #334155 0px);
}

.dark-mode .order-details { 
	background:#1E293B;
	color:#dfdfdf;
	border-bottom:1px solid #334155;
}

.dark-mode .order-details-product {
	border-bottom:1px solid #334155;
	color:#efefef;
}

.dark-mode .note-dropdown-item:hover {
	background:#0f0f0f;
}

.dark-mode .search-href:focus .main-search-user-item {
	background:#475569;
}

.dark-mode .main-search-user-field {
	background:#1E293B;
	box-shadow:0 10px 74px 8px rgb(0 0 0 / 74%), 0 10px 46px 8px rgb(0 0 0 / 52%)
}

.dark-mode .devices-device-counter {
	background:rgba(255,255,255,.14);
}


.dark-mode .page-header,
.dark-mode .menu-left-sidebar-item-acitve,
.dark-mode .group-active {
	background:#003c8f;
}

.dark-mode .menu-left-sidebar-item-acitve:hover,
.dark-mode .group-active:hover {
	background:#005cb2;
}


.beta-sing {
	background:#b71c1c;
	color:#000;
	position:absolute;
	top:95px;
	left:125px;
	width:50px;
	height:30px;
	border-radius:4px;
	font-family:OutfitSB;
	font-size:14px;
	text-align:center;
	line-height:30px;
	z-index:10000000000;
}

/*darkmode_END*/