body {
        color: #ddd;
    }    
    
	:root {
		--back-dark: rgb(66, 66, 66);
		--back-light: rgb(80, 80, 80); 
    } 

    .account-sep-20 {
        height: 20px;        
    }

    .account-sep-40 {
        height: 40px;        
    }

    /* media upload */

    .media-uplod:not(.has-media) .media-uplod-has-media {
        display: none;
    }

    .media-uplod.has-media .media-uplod-default {
        display: none;
    }    

    .media-uplod .media-uplod-has-media {
       position: relative;
    }

    .media-uplod .media-uplod-has-media img {
        width: 50px;
        height: 50px;
        object-fit: cover;
        border-radius: 50%;
        display: block;
    }

    .media-uplod .media-uplod-has-media .media-uplod-del {
        position: absolute;
        top: 0;
        right: 0; 
        background: var(--sub-color);
        border-radius: 50%;
        width: 20px;
        height: 20px;        
        align-items: center;
        justify-content: center;
        align-content: center; 
        padding: 0 0 2px 0; 
        display: none;  
        cursor: pointer;   
    }

    .media-uplod:hover .media-uplod-has-media .media-uplod-del {
        display: flex;   
    }   

    .media-uplod .media-uplod-has-media .media-uplod-del::before {
        content: "\f00d";
        font-family: FontAwesome;
        display: block;
        font-size: 16px;
        line-height: 16px; 
        color: #fff;
    } 

    .media-uplod .media-uplod-default {
        width: 50px;
        height: 50px;
        overflow: hidden;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        background: #ddd;
        position: relative;
    }

    .media-uplod .media-uplod-default::before {
        content: "\f007";
        font-family: FontAwesome;
        display: block;
        font-size: 50px;
        line-height: 50px;
        color: #aaa;   
        padding: 20px 0 0 0;      
    } 
    
    .media-uplod .media-uplod-default input {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        opacity: 0;
        height: 100%;
        width: 100%;
    } 

    /* */

    .account-company-ety-edit > .inr {
        display: block;
    }

    .account-company-ety-edit .main-tabs {
        margin: 10px;
    }
  
    #account-company-ety-edit-services .items,  
    #account-company-ety-edit-employees .items {        
        padding: 10px;
    }

    #account-company-ety-edit-services .items .item .title:hover, 
    #account-company-ety-edit-employees .items .item .title:hover {
        background: #eee;
    }

    #account-company-ety-edit-employees .items .item .item-support {          
        display: flex;        
        align-items: center;  
        font-size: 13px;
    } 

    #account-company-ety-edit-employees .items .item .item-support input {          
        display: block;
        margin: 0 5px 0 0;
    } 

    #account-company-ety-edit-services .items .item .title:hover .title-edit, 
    #account-company-ety-edit-employees .items .item .title:hover .title-edit {          
        background: #eee; 
    } 

    #account-company-ety-edit-services .items .item .actions,   
    #account-company-ety-edit-employees .items .item .actions {
       display: flex;
       padding: 0 5px;
    }

    #account-company-ety-edit-services .items .item .actions > *,
    #account-company-ety-edit-employees .items .item .actions > * {  
        cursor: pointer;
        padding: 0 5px;
    }

    #account-company-ety-edit-services .items .item .actions > *::before,
    #account-company-ety-edit-employees .items .item .actions > *::before {
        font-family: FontAwesome;
        display: block;
        color: var(--sub-color);
        font-size: 20px;
    }

    #account-company-ety-edit-services .items .item .actions .del::before, 
    #account-company-ety-edit-employees .items .item .actions .del::before {
        content: "\f014";
    }

    #account-company-ety-edit-services .items .item .actions .open::before, 
    #account-company-ety-edit-employees .items .item .actions .open::before {
        content: "\f107";
        font-size: 25px;
        line-height: 25px;
        color: var(--main-color);
        transition: transform .2s;
    }

    #account-company-ety-edit-services .items .item.open .actions .open::before, 
    #account-company-ety-edit-employees .items .item.open .actions .open::before {
        transform: rotate(180deg);      
    }

    #account-company-ety-edit-services .items .item .sort::before,
    #account-company-ety-edit-employees .items .item .sort::before {
        content: "\f07d";
        font-family: FontAwesome;
        display: block;
        color: var(--main-color);
        font-size: 20px;
        padding: 0 8px 0 0;       
    }

    #account-company-ety-edit-services .items .item .media-uplod,
    #account-company-ety-edit-employees .items .item .media-uplod {  
        margin: 0 10px 0 0;
    }

    #account-company-ety-edit-services .items .item .actions .item-employees-add-select option:disabled {
        color: #bbb;
    }

    #account-company-ety-edit-services .item > .title,  
    #account-company-ety-edit-employees .item > .title {        
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
        padding: 5px 0;
        margin: 0 0 -1px 0;
        display: flex;
        align-items: center;
        min-height: 36px;
        opacity: .5;
    }

    #account-company-ety-edit-services .item.active > .title,      
    #account-company-ety-edit-employees .item.active > .title {        
        opacity: 1; 
    }

    #account-company-ety-edit-services .items-sub  {          
        padding: 0 0 0 40px;
    }

    #account-company-ety-edit-services .item .title-edit,
    #account-company-ety-edit-employees .item .title-edit {          
        display: block;       
        border: 0;
        font-size: 16px;
        color: #444;
        flex-grow: 1;
        background: #fff;
    } 

    #account-company-ety-edit-services .item .item-active,        
    #account-company-ety-edit-employees .item .item-active {          
            margin: 2px 10px 0 10px;
    }  

    #account-company-ety-edit-services .item .length-minutes-edit,
    #account-company-ety-edit-services .item .price-edit {          
        display: block;       
        border: 1px solid #ddd;
        font-size: 16px;
        color: #444;
        text-align: right;
        background: #fff;
        width: 80px;
        border-radius: var(--border-radius);
        margin: 0 10px;
    } 

    #account-company-ety-edit-services .item .item-employees-items {          
        display: flex;
        margin: 0 7px;
    } 

    #account-company-ety-edit-services .item .item-employees-items > .employees-item {          
        background: var(--main-color);
        width: 24px;
        height: 24px;
        border-radius: 12px;
        font-size: 11px;
        color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        line-height: 11px;
        padding: 0 0 2px 0;
        margin: 0 3px;
        cursor: pointer;
        position: relative;
    } 

    #account-company-ety-edit-services .item .item-employees-items > .employees-item:hover {          
        background: var(--sub-color);        
    }

    #account-company-ety-edit-services .item .item-employees-items > .employees-item:hover::before {          
        position: absolute;
        top: 0;
        left: 0;
        width: 24px;
        height: 24px;
        border-radius: 12px;
        background: var(--sub-color); 
        content: "\f014";
        font-family: FontAwesome;
        display: block;       
        font-size: 18px;
        display: flex;
        justify-content: center;
        align-items: center;                 
    }

    /* cat list */

    .account-cat-list > .title {
        padding: 0 10px;
        font-weight: bold;
        font-size: 16px;
    }

    .account-cat-list > .items {
        display: flex;
        flex-wrap: wrap;
        padding: 5px;
    }

    .account-cat-list > .items > .item {
        padding: 5px;
        flex: 25% 0 0;        
        display: flex;
        align-items: center;        
        cursor: pointer;
    }  

    .account-cat-list > .items > .item > .checkbox {
        flex: 18px 0 0;
        margin: 2px 0 0 0;
    }

    .account-cat-list > .items > .item > .title {
        padding: 0 0 0 12px;
        font-size: 14px;
        line-height: 1;
    }  

    .account-cat-list-sep {
        height: 10px;
        flex: 100% 0 0;
    }     

	@media all and (max-width: 1200px) {

        .account-cat-list > .items > .item {            
            flex: 33.333333% 0 0;    
        }  

    }

	@media all and (max-width: 900px) {

        .account-cat-list > .items > .item {            
            flex: 50% 0 0;    
        }  

    }

	@media all and (max-width: 700px) {

        .account-cat-list > .items > .item {            
            flex: 100% 0 0;    
        }  

    }

    /* employees - settings */

    #account-company-ety-edit-employees .item .account-opening-times {
        height: 0;
        overflow: hidden;
    }

    /* services - settings */

    #account-company-ety-edit-services .item > .item-settings {
        display: none;
    } 

    #account-company-ety-edit-services .item.is-service > .item-settings {
        display: block;
        padding: 0 0 0 43px;   
        height: 0;       
        overflow: hidden;         
    } 

    #account-company-ety-edit-services .item > .item-settings .ele-items,
    #account-company-ety-edit-services .item > .item-settings .ele-items-use {
        display: flex;
        flex-wrap: wrap;  
        margin: 10px 5px;
    } 

    #account-company-ety-edit-services .item > .item-settings .ele-items .ele-item .data-in-use {
        display: none;  
    } 

    #account-company-ety-edit-services .item > .item-settings .ele-items-use .ele-item .ele-item-title {
        display: none;  
    } 

    #account-company-ety-edit-services .item > .item-settings .ele-items-use {
        background: #ddd;
        margin: 10px;
        padding: 5px;
        min-height: 50px;
        border-radius: var(--border-radius);
    }   

    #account-company-ety-edit-services .item > .item-settings .ele-item {       
        margin: 5px;
        border-radius: var(--border-radius);
        background: #bbb;
        font-size: 13px;
        line-height: 13px;
        padding: 5px 10px;
        width: 140px;
    } 

    #account-company-ety-edit-services .item > .item-settings .ele-item .data-in-use {       
        text-align: center;
    } 

    #account-company-ety-edit-services .item > .item-settings .ele-item .data-in-use input[type="text"] {       
        display: block;
        width: 100%;
        background: #fff;
        border-radius: var(--border-radius);
        margin: 5px 0;       
        border: 0;
        text-align: center;
        font-size: 15px;       
        height: 20px;
    } 

    #account-company-ety-edit-services .item > .item-settings .ele-item.ele-item-main {       
        background: rgba(155,220,153,1);
    } 

    #account-company-ety-edit-services .item > .item-settings .ele-item.ele-item-support {       
        background: rgba(163,190,213,1);
    } 

   /* employees */

    #account-company-ety-edit-employees .item .account-opening-times {  
        margin: 0 0 0 25px;
        opacity: .5;
    }

    #account-company-ety-edit-employees .item.active .account-opening-times {          
        opacity: 1;
    }

    #account-company-ety-edit-employees .account-opening-times .items {
        padding-right: 0 !important;    }

   
    #account-company-ety-edit-employees .account-opening-times .items-headline {
        margin-right: 0 !important;
    }

    #account-company-ety-edit-employees .account-opening-times .items > .item:last-child {         
        border-bottom: 0 !important;
    }

    /* opening times */
    
    .account-opening-times .items-headline {
        display: flex;
        margin: 0 10px;
        border-bottom: 1px solid #ddd;
    }

    .account-opening-times .items-headline .placeholder {
        flex: 100px 0 0;
    }
    
    .account-opening-times .items-headline .item {
        flex: 263px 0 0;
        padding: 10px;
    }

    .account-opening-times .items-headline .item-sep {
        flex: 40px 0 0;       
    }

    .account-opening-times .items {
        padding: 0 10px;
    }

    .account-opening-times .items > .item {
        display: flex;
        align-items: flex-start;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    }

    .account-opening-times .items > .item > .day {
        flex: 100px 0 0;
        padding: 10px 0;
    }

    .account-opening-times .times-items {
        padding: 5px;
        flex: 263px 0 0;  
    }
    
    .account-opening-times .times-items-sep {       
        flex: 40px 0 0;  
    }   

    .account-opening-times .times-items > .times-item {
        display: flex;
        align-items: center;   
    }

    .account-opening-times .times-items > .times-item .time-sep {          
        padding: 5px;     
    }

    .account-opening-times .times-items > .times-item .time {
        padding: 5px;
        flex: 75px 0 0;
        position: relative;    
    }

    .account-opening-times .times-items > .times-item .time-input {
        border-radius: var(--border-radius);
        width: 100%;
        border: 1px solid #ddd;
        height: 24px;
        padding: 0 5px;
        text-align: center;
        background: #fff;
    } 
    
    .account-opening-times .times-items > .times-item .time.time-percent .unit-inr  {
        position: absolute;
        top: 5px;
        right: 5px;
        height: 24px;
        background: #ddd;
        padding: 2px 5px 0 5px;
        border-radius: 0 var(--border-radius) var(--border-radius) 0;
        font-size: 14px;
        font-weight: bold;
    }   
    
    .account-opening-times .times-items > .times-item .time.time-percent .time-input {
        padding-right: 27px;
        text-align: right;
    } 

    .account-opening-times .times-items > .times-item .time-sort, 
    .account-opening-times .times-items > .times-item .time-add,
    .account-opening-times .times-items > .times-item .time-del {        
        padding: 5px;
        cursor: pointer;                   
    }  

    .account-opening-times .times-items > .times-item .time-sort::before, 
    .account-opening-times .times-items > .times-item .time-add::before,
    .account-opening-times .times-items > .times-item .time-del::before {        
        content: "\f07d";
        font-family: FontAwesome;
        display: flex;
        justify-content: center;
        align-items: center;
        background: var(--main-color);  
        color: #fff;
        font-size: 16px; 
        width: 24px;
        height: 24px;
        border-radius: var(--border-radius); 
    } 
 
    .account-opening-times .times-items > .times-item .time-add::before {   
        content: "\f067";         
    } 

    .account-opening-times .times-items > .times-item .time-del::before {   
        content: "\f014"; 
        background: var(--sub-color);        
    } 

    /* */

    #account-company-ety-edit-profile > .items-headline {
        padding: 10px;       
    }

    #account-company-ety-edit-profile > .items-headline > .inr {       
        border-bottom: 1px solid #ddd;
        display: flex;
        font-weight: bold;
    }

    #account-company-ety-edit-profile > .items-headline > .inr > .title {       
        flex-grow: 1;
        padding: 10px;    
    }

    #account-company-ety-edit-profile > .items-headline > .inr > .price {       
        padding: 10px;
        text-align: right;
    }

    #account-company-ety-edit-profile > .items-headline > .inr > .plan {       
        padding: 10px;
        text-align: center;
        flex: 170px 0 0;
    }

    #account-company-ety-edit-profile > .items-headline > .inr > .open {       
        padding: 10px;
        flex: 45px 0 0;
    }
   
    #account-company-ety-edit-profile > .items {
        padding: 10px;
    }

    #account-company-ety-edit-profile > .items  > .item > .inr {
        border-bottom: 1px solid #ddd;
    }

    #account-company-ety-edit-profile > .items  > .item:hover > .inr,
    #account-company-ety-edit-profile > .items  > .item.open > .inr {
        background: #f0f0f0;
    }

    #account-company-ety-edit-profile > .items  > .item > .inr > .top {
        display: flex;
    }

    #account-company-ety-edit-profile > .items  > .item > .inr > .top > .title {
       flex-grow: 1;
       padding: 10px;
       display: block;
       color: var(--main-color);
       text-decoration: none;
    }

    #account-company-ety-edit-profile > .items  > .item > .inr > .top > .price {        
        padding: 10px;
        text-align: right;
    }

    #account-company-ety-edit-profile > .items  > .item > .inr > .top > .price .price-info {        
        padding: 2px 0 0 0;
        font-size: 12px;
        color: #888;
    }

    #account-company-ety-edit-profile > .items  > .item > .inr > .top > .price .price-coupon-info { 
        color: var(--main-color);
    }

    #account-company-ety-edit-profile > .items  > .item > .inr > .top > .plan {        
        padding: 10px;
        flex: 170px 0 0;
        text-align: center;
        display: flex;
        justify-content: flex-end;
    }

    #account-company-ety-edit-profile > .items  > .item > .inr > .top > .open {
        padding: 10px;
        cursor: pointer; 
        flex: 45px 0 0;
        display: flex;
        justify-content: flex-end;
        height: 45px;
    }
    
    #account-company-ety-edit-profile > .items  > .item > .inr > .top > .open::before {  
        content: "\f107";
        font-size: 25px;
        line-height: 25px;
        color: var(--main-color);
        transition: transform .2s; 
        font-family: FontAwesome;
        display: block;    
    }

    #account-company-ety-edit-profile > .items  > .item.open > .inr > .top > .open::before {
        transform: rotate(180deg);
    }

    #account-company-ety-edit-profile > .items  > .item .booking-con > .inr {
        background: #fff;
    }

    #account-company-ety-edit-profile > .items  > .item > .inr > .more {  
        height: 0;
        overflow: hidden;
    }

    #account-company-ety-edit-profile > .items  > .item.open > .inr > .more {  
        height: auto;
       
    }

    #account-company-ety-edit-media .media-items {
        display: flex;
        flex-wrap: wrap;
    }

    #account-company-ety-edit-media .media-items > .media-item {
        flex: 50% 0 0;
        padding: 10px;
    }

    #account-company-ety-edit-media .media-items > .media-item > .inr {
        background: #eee;
        border-radius: var(--border-radius);
        overflow: hidden;
        display: flex;
        align-items: center;
    }

    #account-company-ety-edit-media .media-uplod .media-uplod-default {
        border-radius: 0;
        width: 100px;
        height: 100px;
    }

    #account-company-ety-edit-media .media-uplod .media-uplod-has-media img {
        width: 100px;
        height: 100px;       
        border-radius: 0;        
    }

    #account-company-ety-edit-media .media-uplod .media-uplod-default::before {
        content: "\f1c5";       
        padding: 0;
    }

    #account-company-ety-edit-media .media-items > .media-item > .inr > .data {
        flex-grow: 1;
        padding: 0 10px;
    }

    /* customer - order */

    .account-customer-order-items-headline {
        padding: 10px 10px 0 10px;
        font-weight: bold;
    }  

    .account-customer-order-items-headline > .inr {
        border-bottom: 1px solid #ddd;
        display: flex;
    }                                      
        
    .account-customer-order-items-headline > .inr > .date {
        flex: 120px 0 0;
        padding: 5px 0;
    }  
    
    .account-customer-order-items-headline > .inr > .data {
        flex-grow: 1;
        padding: 5px 0;
    }     

    .account-customer-order-items {
        padding: 0 10px 10px 10px;
    }

    .account-customer-order-items > .item {
        border-bottom: 1px solid #ddd;
    }  

    .account-customer-order-items > .item > .inr {
        display: flex;
    }

    .account-customer-order-items > .item > .inr > .date {
        flex: 120px 0 0;
        padding: 10px 0;
    }

    .account-customer-order-items > .item > .inr > .date > .time {
        font-size: 14px;
    }

    .account-customer-order-items > .item > .inr > .data {        
        flex-grow: 1;
    }

    .account-customer-order-items > .item > .inr > .data > .ety {
        display: block;
        padding: 10px 0 0 0;
        color: var(--main-color);
        text-decoration: none;
    } 

    .account-customer-order-items > .item > .inr > .data > .title {
        padding: 10px 0;
    } 

    .account-customer-order-items > .item > .inr > .data > .actions {
        display: flex;
        margin: 0 -5px;
        padding: 5px 0;
    } 
 
    .account-customer-order-items > .item > .inr > .data > .actions > .action {
        padding: 5px;
    } 

    .account-customer-order-items > .item > .inr > .data > .actions > .action > .inr {       
        font-size: 16px;
        color: var(--main-color);
        border: 2px solid var(--main-color);
        padding: 4px 10px;
        border-radius: var(--border-radius);       
        cursor: pointer;
        text-align: center;
    }

    .account-customer-order-items > .item > .inr > .data > .actions > .action > .inr:hover {          
        color: #fff;
        background: var(--main-color);       
    }

    .account-customer-order-items > .item > .inr > .data > .actions > .action.inactive > .inr {        
        color: #ddd !important;
        border: 2px solid #ddd !important; 
        background: #fff !important;
        cursor: not-allowed;      
    }
 
	.account-order-item-change {
		margin: -10px;		
	}

	.account-order-item-change > .inr > .title {
		font-size: 16px;
		
		padding: 10px;		
	}	

	.account-order-item-change > .inr > .title .top {
		font-size: 13px;
		font-weight: normal;
		color: var(--main-color);	
	}

	.account-order-item-change > .inr > .title .sub {
		font-size: 13px;
		font-weight: normal;
		color: #666;		
	}

	.account-order-item-change > .inr > .content {
		display: flex;
        flex-wrap: wrap;
        align-items: center;
	}

	/* booking - employees - select */

	.account-order-item-change .employees-select {
		padding: 10px;
		position: relative;
		flex: 100% 0 0;
	}

	.account-order-item-change .employees-select .title {
		font-size: 17px;
		padding: 0 0 10px 0;
	}

	.account-order-item-change .employees-select .item-active {
		background: #fff;
		border: 1px solid #ddd;
		border-radius: var(--border-radius);
		height: 40px;
		display: flex;
		align-items: center;
		padding: 10px;
		cursor: pointer;
		color: var(--main-color);
	}
	
	.account-order-item-change .employees-select .items {
		position: absolute;
		z-index: 999;
		top: 100%;
        right: 10px;
        left: 10px;
		background: #fff;
		box-shadow: 0px 0 7px 0px rgba(0,0,0,0.4);
		border-radius: var(--border-radius);
		margin: 10px 0 0 0;
	}

	.account-order-item-change .employees-select .items > .item {
		border-bottom: 1px solid #ddd;		
		height: 40px;
		display: flex;
		align-items: center;
		padding: 10px;
		cursor: pointer;
	}

	.account-order-item-change .employees-select .items > .item:hover {
		color: var(--main-color);		
	}

	/* booking - date picker */

	.account-order-item-change .date-picker {
		padding: 10px;
		position: relative;
		flex-grow: 1; 
        max-width: 100%;       
	}

	.account-order-item-change .date-picker .title {
		font-size: 17px;
		padding: 0 0 10px 0;		
	}

	.account-order-item-change .date-picker .content {
		border: 1px solid #ddd;
		border-radius: var(--border-radius);
		background: #fff;
	}

	.account-order-item-change .date-picker .content > .top {
		display: flex;
		align-items: center;
	}

	.account-order-item-change .date-picker .content > .top .left,
	.account-order-item-change .date-picker .content > .top .right {
		flex-grow: 0;
		cursor: pointer;
	}

	.account-order-item-change .date-picker .content > .top .left::before,
	.account-order-item-change .date-picker .content > .top .right::before {
		content: "\f104";
		font-family: FontAwesome;
		display: block;
		font-size: 22px;
		line-height: 22px;
		padding: 10px 20px;
	}
	
	.account-order-item-change .date-picker .content > .top .right::before {
		content: "\f105";
	}

	.account-order-item-change .date-picker .content > .top .middle {
		flex-grow: 1;
		text-align: center;		
	}
	
	.account-order-item-change .date-picker .content > .days {
		display: flex;
		overflow: hidden;		
		padding: 5px;
	}
	
	.account-order-item-change .date-picker .content > .days > .day {
		flex: 40px 0 0;
		padding: 5px;
		cursor: pointer;
	}

	.account-order-item-change .date-picker .content > .days > .day .day-short {
		font-size: 12px;
		text-align: center;
		padding: 0 0 3px 0;
	}	
	
	.account-order-item-change .date-picker .content > .days > .day .day-no {
		font-size: 15px;
		border-radius: 100px;
		height: 30px;		
		display: flex;
		justify-content: center;
		align-items: center;
	}	

	.account-order-item-change .date-picker .content > .days > .day.active .day-no {		
		background: var(--main-color);
		color: #fff;		
	}	

	/* booking - time picker */

	.account-order-item-change .time-picker {
		padding: 10px;		
		flex: 100% 0 0;
	}

	.account-order-item-change .time-picker .title {
		font-size: 17px;
		padding: 0 0 10px 0;		
	}

	.account-order-item-change .time-picker .content {
		border: 1px solid #ddd;
		border-radius: var(--border-radius);
		background: #fff;
	}

	.account-order-item-change .time-picker .time {		
		overflow: hidden;
		overflow-y: auto;
		max-height: 180px;				
	}

	.account-order-item-change .time-picker .time .item {		
		display: flex;
		border-top: 1px dashed #ccc;	
		cursor: pointer;
		justify-content: space-between;	
		font-size: 14px;
		padding: 0 10px;	
	}	

	.account-order-item-change .time-picker .time .item.active {		
		background: #eee;
		border-left: 4px solid var(--main-color);
		padding: 0 10px 0 6px;
	}

	.account-order-item-change .time-picker .time .item:first-child {		
		border-top: 0;		
	}

	.account-order-item-change .time-picker .time .item .value {			
		padding: 5px 0;		
	}	

	.account-order-item-change .time-picker .time .item .price {		
		padding: 5px 0;	
		display: flex;
		color: var(--sub-color);
	}	

	.account-order-item-change .time-picker .time .item .price-regular {		
		color: #999;
		text-decoration: line-through;
		padding: 0 5px 0 0;
	}

	.account-order-item-change .time-picker .time .item-empty {		
		color: #666;
		text-align: center;
		padding: 10px;
		font-size: 16px;
		max-width: 190px;
	}

	.account-order-item-change .time-picker .time .item-empty .sub {		
		font-size: 14px;
		color: #999;		
		padding: 5px 0 0 0;
	}	

    /* */

    .button-link {
        display: flex;
        cursor: pointer;
        color: var(--main-color);
        padding: 10px;
        text-decoration: none;
        transition: transform .2s;
    }

    .button-link:hover {
        transform: scale(1.1);
    }

    /* ety - edit */

    .service-table-exp,
    .service-delivery-exp {
        padding-left: 32px;
    }

    .account-ety-edit {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
    }

    .account-ety-edit > .left {
        position: relative;  
        z-index: 99999;    
        min-width: 80px;
        background: var(--back-light);
        /*box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.3); */
    }

    .account-ety-edit > .right {
        flex-grow: 1;
        position: relative;     
        background: var(--back-dark);  
        display: flex;
        flex-direction: column;
        height: 100vh;  
        max-width: calc(100% - 80px);    
    }   

    .account-ety-edit > .right > .form-main {
        flex-grow: 1;
        overflow: auto;
    }

    .account-ety-edit > .right > .form-main {
        display: flex;
        flex-wrap: wrap;
        padding: 10px;
    }  

    .account-ety-edit .left .menu-items {       
        padding: 10px 0; 
        position: relative;
        height: 100%;
    }

    .account-ety-edit .left .menu-items > .item {       
        text-decoration: none;
        color: #fff;
        font-size: 0;
        display: flex;
        flex-wrap: wrap;   
        justify-content: center;
        padding: 10px 0;  
        position: relative;
    }

    .account-ety-edit .left .menu-items > .item.inactive {       
        opacity: .3;
        cursor: not-allowed;
    }
    
    .account-ety-edit .left .menu-items > .item::before {
        content: "\f19c";
        font-family: FontAwesome;
        display: block;
        color: #fff;
        font-size: 32px;
        flex: 100% 0 0;
        text-align: center;
    }

    .account-ety-edit .left .menu-items > .item .count {
       position: absolute;
       top: 10px;
       right: 12px;
       height: 24px;
       min-width: 24px;
       border-radius: 50px;
       background: rgb(232, 130, 0);
       color: #fff;
       padding: 0 5px;
       display: flex;
       align-items: center;
       justify-content: center;
       font-size: 11px;
    }

    .account-ety-edit .left .menu-items > .item .count.empty {
        display: none;
    }

    .account-ety-edit .left .menu-items > .item.item-calendar::before {
        content: "\f073";
    }

    .account-ety-edit .left .menu-items > .item.item-order::before {
        content: "\f03a";
    }

    .account-ety-edit .left .menu-items > .item.item-sco::before {
        content: "\f1ec";
    }

    .account-ety-edit .left .menu-items > .item.item-media::before {
        content: "\f03e";
    }

    .account-ety-edit .left .menu-items > .item.item-service-call::before {
        content: "\f0f3";
    }

    .account-ety-edit .left .menu-items > .item.item-update::before {
        content: "\f0c7";
    }

    .account-ety-edit .left .menu-items > .item.item-customer::before {
        content: "\f0c0";
    }

    .account-ety-edit .left .menu-items > .item.item-screens::before {
        content: "\f26c";
    }

    .account-ety-edit .left .menu-items > .item.item-update {
        position: absolute;
        bottom: 0;
        width: 100%;
    }

    .account-ety-edit .left .menu-items > .item.item-update::before {
        content: "\f0c7";
    } 
    
    .account-ety-edit .left .menu-items > .item.item-update::after {
        display: none;
    } 

    /**/

    .account-ety-edit .area-con {
        padding: 10px;
        flex-grow: 1;
    }

    .account-ety-edit .area-con > .inr {       
        border-radius: var(--border-radius);        
        background: var(--back-light);
        box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.3);
    }        
    
    .account-ety-edit .area-con > .inr > .title {       
        color: #ddd;
        border-radius: var(--border-radius) var(--border-radius) 0 0;
        padding: 20px 20px 0px 20px;
        font-size: 16px;
        font-weight: 600;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        position: relative;
        line-height: 1;
        min-height: 40px;      
    }   

    .account-ety-edit .area-con.finished > .inr > .title::after {
        position: absolute;
        top: 8px;
        right: 16px;
        content: "\f00c";
        font-family: FontAwesome;
        display: block;
        color: var(--sub-color);
        font-size: 32px;
        line-height: 32px;
        font-weight: normal;             
    }     

    .account-ety-edit .area-con > .inr > .title > .actions {
        display: flex;
    } 

    .account-ety-edit .area-con > .inr > .title > .actions > .action {
        border: 2px solid var(--main-color);
        border-radius: 100px;
        font-size: 14px;
        font-weight: 600;   
        margin-left: 20px;
        cursor: pointer;  
        display: flex;
        justify-content: center;
        align-items: center;   
        text-decoration: none;
        color: var(--main-color);
        padding: 0px 10px;
        height: 26px;
    } 


    .account-ety-edit .area-con > .inr > .title > .actions > .action > .title {
        display: block;
        font-size: 14px;
        padding: 0 0 0 8px;        
        font-weight: 600;
        line-height: 22px;
    }    

    .account-ety-edit .area-con > .inr > .title > .actions > .action::before {
        content: "\f107";
        font-family: FontAwesome;
        display: block;
        font-size: 16px;
        line-height: 22px;
        color: var(--main-color);
        transition: transform .2s;     
    } 

    .account-ety-edit .area-con > .inr > .title > .actions > .action.action-icon-add::before {
        content: "\f067";
        padding: 1px 0 0px 0;      
    } 

    .account-ety-edit .area-con > .inr > .content > .inr {    
        display: flex;
        flex-wrap: wrap; 
        padding: 10px;
    } 

    .account-ety-edit .area-con.closed > .inr > .title {     
        border-width: 0px;
    }

    .account-ety-edit .area-con.closed > .inr > .content {    
       height: 0;
       overflow: hidden;
    } 

    .account-ety-edit .area-con .sep-title {    
        flex: 100% 0 0;
        padding: 10px 10px 0 10px;
        font-weight: 600;
    } 

    .account-ety-edit .area-con .info-text {         
        padding: 10px;
        
    } 

    /**/    

    .account-ety-edit-company-info .button.button-add-owner > .inr {
        background: var(--sub-color);        
    }

    .account-ety-edit-company-info .button.button-add-owner > .inr::before {
        content: "\f234";
        font-family: FontAwesome;
        display: inline-block;
        padding: 0 5px 0 0;
    }
     
    /* */

    .account-ety-edit .right .menu-sub-items {   
        position: relative;
        z-index: 9999;    
        display: flex;
        flex-wrap: wrap;
        background: var(--back-light);
        padding: 10px 20px 0 20px;      
        box-shadow: 0px 10px 8px 0px rgba( 42, 44, 55, 1 );    
    }

    .account-ety-edit .right .menu-sub-items > .item {       
        text-decoration: none;       
        font-size: 16px;
        padding: 10px 20px; 
        border-radius: var(--border-radius) var(--border-radius) 0 0; 
        color: #ddd;    
    }

    .account-ety-edit .right .menu-sub-items > .item.active {       
        background: var(--back-dark);
    }

    /* ety - media */

    .account-ety-edit-media .media-items {
        display: flex;
        flex-wrap: wrap;
    }

    .account-ety-edit-media .media-items > .media-item {
        flex: 50% 0 0;
        padding: 10px;
    }

    .account-ety-edit-media .media-items > .media-item > .inr {
        background: var(--back-dark);
        border-radius: var(--border-radius);
        overflow: hidden;
        display: flex;
        align-items: center;
        position: relative;
    }

    .account-ety-edit-media .media-uplod .media-uplod-default {
        border-radius: 0;
        width: 100px;
        height: 100px;        
    }

    .account-ety-edit-media .media-uplod > .inr {
        position: relative;
      }


    .account-ety-edit-media .media-uplod .media-uplod-default input {
        cursor: pointer;
    }

    .account-ety-edit-media .media-uplod .media-uplod-has-media .media-uplod-del {
        top: 5px;
        right: 5px;
    }

    .account-ety-edit-media .media-uplod .media-uplod-sort {
        position: absolute;
        top: 5px;
        left: 5px;
        background: var(--main-color);
        border-radius: 50%;
        width: 20px;
        height: 20px;        
        align-items: center;
        justify-content: center;
        align-content: center;
        padding: 0 0 2px 0;
        display: none;
        cursor: pointer;
    }

    .account-ety-edit-media .media-uplod .media-uplod-sort::before {
        content: "\f047";
        font-family: FontAwesome;
        display: block;
        font-size: 16px;
        line-height: 16px;
        color: #fff;
    } 
    
    .account-ety-edit-media .media-uplod:hover .media-uplod-sort {
        display: flex;
    }   

    .account-ety-edit-media .media-uplod .media-uplod-has-media img {
        width: 100px;
        height: 100px;       
        border-radius: 0;        
    }

    .account-ety-edit-media .media-uplod .media-uplod-default::before {
        content: "\f1c5";       
        padding: 0;
    }

    .account-ety-edit-media .media-items > .media-item > .inr > .del {
        position: absolute;
        top: 5px;
        right: 5px;
        background: var(--sub-color);
        border-radius: 50%;
        width: 20px;
        height: 20px;
        align-items: center;
        justify-content: center;
        align-content: center;
        padding: 0 0 2px 0;
        display: none;
        cursor: pointer;
    }

    .account-ety-edit-media .media-items > .media-item > .inr > .del::before {
        content: "\f00d";
        font-family: FontAwesome;
        display: block;
        font-size: 16px;
        line-height: 16px;
        color: #fff;
        cursor: pointer;        
    }

    .account-ety-edit-media .media-items > .media-item > .inr:hover > .del {
        display: flex;
    }

    .account-ety-edit-media .media-items > .media-item > .inr > .data {
        flex-grow: 1;
        padding: 0 10px;
    }

    .account-ety-edit-media .media-items > .media-item-add {
        order: 999999999;        
    }

    .account-ety-edit-media .media-items > .media-item-add > .inr {      
        width: 100px;
        height: 100px;
        background: #ddd;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        cursor: pointer;
    }

    .account-ety-edit-media .media-items > .media-item-add > .inr::before {
        content: "\f1c5";
        font-family: FontAwesome;
        display: block;
        font-size: 50px;
        line-height: 50px;
        color: #aaa;        
    }

    .account-ety-edit-media .media-items > .media-item-add > .inr::after {
        content: "\f055";
        font-family: FontAwesome;
        display: block;
        font-size: 36px;
        line-height: 36px;
        color: #aaa;
        position: absolute;
        right: 7px;
        bottom: 5px;    
    }

    /* employees - settings */ 
  
    .account-ety-edit-employees .area-con > .inr > .title > .actions > .action-employees-add::before {
        content: "\f055";       
    }   

    .account-ety-edit-employees .items {        
        padding: 10px;
    }

    .account-ety-edit-employees .items .item .title:hover {
        background: #eee;
    }

    .account-ety-edit-employees .items .item .item-support {          
        display: flex;        
        align-items: center;  
        font-size: 13px;
    } 

    .account-ety-edit-employees .items .item .item-support input {          
        display: block;
        margin: 0 5px 0 0;
    } 

    .account-ety-edit-employees .items .item .title:hover .title-edit {          
        background: #eee; 
    } 

    .account-ety-edit-employees .items .item .actions {
       display: flex;
       padding: 0 5px;
    }

    .account-ety-edit-employees .items .item .actions > * {  
        cursor: pointer;
        padding: 0 5px;
    }

    .account-ety-edit-employees .items .item .actions > *::before {
        font-family: FontAwesome;
        display: block;
        color: var(--sub-color);
        font-size: 20px;
    }

    .account-ety-edit-employees .items .item .actions .del::before {
        content: "\f014";
    }
 
    .account-ety-edit-employees .items .item .actions .open::before {
        content: "\f107";
        font-size: 25px;
        line-height: 25px;
        color: var(--main-color);
        transition: transform .2s;
    }

    .account-ety-edit-employees .items .item.open .actions .open::before {
        transform: rotate(180deg);      
    }

    .account-ety-edit-employees .items .item .sort::before {
        content: "\f07d";
        font-family: FontAwesome;
        display: block;
        color: var(--main-color);
        font-size: 20px;
        padding: 0 8px 0 0;       
    }

    .account-ety-edit-employees .items .item .media-uplod {  
        margin: 0 10px 0 0;
    }

    .account-ety-edit-employees .item > .title {        
        border-top: 1px solid rgba(255, 255, 255, 0.05);
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        padding: 5px 0;
        margin: 0 0 -1px 0;
        display: flex;
        align-items: center;
        min-height: 36px;
        opacity: .5;
    }

    .account-ety-edit-employees .item.active > .title {        
        opacity: 1; 
    }

    .account-ety-edit-employees .item .title-edit {          
        display: block;       
        border: 0;
        font-size: 16px;
        color: #444;
        flex-grow: 1;
        background: #fff;
    } 

    .account-ety-edit-employees .item .item-active {          
        margin: 2px 10px 0 10px;
    }  

    .account-ety-edit-employees .item .account-opening-times {
        height: 0;
        overflow: hidden;
    }    

    .account-ety-edit-employees .item .account-opening-times {  
        margin: 0 0 0 25px;
        opacity: .5;
    }

    .account-ety-edit-employees .item.active .account-opening-times {          
        opacity: 1;
    }

    .account-ety-edit-employees .account-opening-times .items {
        padding-right: 0 !important;    
    }

    .account-ety-edit-employees .account-opening-times .items-headline {
        margin-right: 0 !important;
    }

    .account-ety-edit-employees .account-opening-times .items > .item:last-child {         
        border-bottom: 0 !important;
    }

    /* opening times */

    .account-ety-edit-opening-times .account-opening-times .items {
        padding: 10px;
    }

    .account-ety-edit-opening-times .account-opening-times .items > .item:first-child {     
        border-top: 1px solid rgba(255, 255, 255, 0.05);
      }