/* colors */

@text-color: @widget-text-color;
@title-text-color: @header-text-color;
@background-color: rgba(255,255,255,0.9);
@text-outstanding: @active-border-color;
/*@tooltiphelp: #dfdfdf;*/

/* screen */
@screenzoom: 80%;
@agiledialogs-images: "../Images";

/* Font */
@body-font-size: 13px;
@font-family: "Segoe UI", "Segoe", Tahoma, Helvetica, Arial, sans-serif;
@widget-font-size: inherit;
@widget-frame-color: @widget-border-color;
@pageCaption-font-size: 1.5rem;
@pageCaption-font-weight: 600;
@input-font-weight: inherit;
@input-disabled-opacity: 0.8;
@button-active-border-color: @widget-border-color;

/* Spinner */
@imagespin-background: rgba(0,0,0,0.7) url('@{image-folder}/loading.gif') no-repeat center center;

/* XRMGrid */
@xrmgrid-border-spacing: inherit;
@xrmgrid-row-height: 31px;
@xrmgrid-td-border-style: solid;
@xrmgrid-td-line-height: 1.6em;
@xrmgrid-td-font-size: inherit;

@xrmgrid-k-grid-header-font-weight: bold;
@xrmgrid-k-grid-header-link-padding: inherit;
@xrmgrid-k-grid-header-font-size: inherit;
@xrmgrid-min-width: 37em;
@lookupGrid-height: 390px;
@lookupGrid-k-grid-content-height: 325px;


/* Admin tool*/
@background-added: #1da908;
@background-removed: #b71515;
@fontcolor-removed: white;

/* Allow Custom CSS */
@allow-custom-css: true;
@hosted: "0";

/* Logos */

@background-image: url('@{agiledialogs-images}/backgrounds/color_arcs_03.jpg');
@agileDialogs-logo: url(../images/logos/ad_01.png?25300.8.0.25300.2050420250612);
@agileXrm-logo: url(../images/logos/axrm_01.png?25300.8.0.25300.2050420250612);
@agilePoint-logo: url(../images/logos/ap_01.png?25300.8.0.25300.2050420250612);

@box-model-adjust: 9px;
@box-model-adjust-moz: 10px;
@render-popup-width-unit: 80vw;
@ad-app-wrapper-border-size: 5px;
@ad-centered-margin-background-color: #CFCFCF;

@notification-bar-background-color: rgba(47, 95, 144, 0.65);

@image-folder: "styles/Metro";
@fallback-texture: none;
@texture: none;
@tooltip-texture: none;
@header-text-color: #000000;
@widget-gradient: "none";
@widget-border-color: #dadada;
@widget-text-color: #787878;
@widget-shadow: none;
@header-background-color: #ffffff;
@widget-background-color: #FFF;
@content-background-color: #ffffff;
@disabled-text-color: #837f7f;
@input-background-color: #ffffff;
@input-text-color: #6e6e6e;
@button-border-color: #dadada;

.innerbox ( @top: 0, @right: 0, @bottom: 0, @left: 0 ) {
		
	display: block;
	position:absolute;
	height:auto;
	bottom:0;
	top:0;
	left:0;
	right:0;
	margin-top:@top;
	margin-bottom:@bottom;
	margin-right:@right;
	margin-left:@left;
}
	
.opacity(@o) {
	
	/* Required for IE 5, 6, 7 */
	/* ...or something to trigger hasLayout, like zoom: 1; */
	zoom: 1; 
			
	/* Theoretically for IE 8 & 9 (more valid) */	
	/* ...but not required as filter works too */
	/* should come BEFORE filter */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=@{o})";
		
	/* This works in IE 8 & 9 too */
	/* ... but also 5, 6, 7 */
	filter: alpha(opacity=@o);
		
	/* Older than Firefox 0.9 */
	-moz-opacity: @o / 100;
		
	/* Safari 1.x (pre WebKit!) */
	-khtml-opacity: @o / 100;
		
	/* Modern!
	/* Firefox 0.9+, Safari 2?, Chrome any?
	/* Opera 9+, IE 9+ */
	opacity: @o / 100;
}
	
.boxshadow( @hoffset: -2px, @voffset: 2px, @blur: 4px, @spread: 0, @color:rgba(0, 0, 0, 0.3) ) {
		
	-moz-box-shadow: @hoffset @voffset @blur @spread @color;
	-webkit-box-shadow: @hoffset @voffset @blur @spread @color;
	box-shadow: @hoffset @voffset @blur @spread @color;	
}


.finishboxshadow( @hoffset: 0, @voffset: 0, @blur: 24px, @spread: 0, @color:rgba(0, 0, 0, 0.5)  ) {
		
	-moz-box-shadow: @hoffset @voffset @blur @spread @color;
	-webkit-box-shadow: @hoffset @voffset @blur @spread @color;
	box-shadow: @hoffset @voffset @blur @spread @color;	
}

.watermark() {
	left: 0.5rem;
	top: 0.45rem;
	opacity: 0.4;
	position: absolute;
}
	
.highlight-behavior(@color){        
	&.text {
			.questionCaption {
				font-weight: bold;
			}
		}

	&.box {

		input[type=text], input[type=password], textarea {
			border: 1px solid @color;
		}

		input[type=radio]:focus, input[type=checkbox]:focus {
			box-shadow: 0 0 3px 1px @color;
		}

		.k-widget.k-dropdown.k-header > span {
			border: 1px solid @color;
		}

		.CrmLookupControlContainer {
			input[type=text] {
				border: 0;
				box-shadow: 0 0 1px 1px @color inset;
			}
		}
	}

	&.none {
	}        
}
	
.inner-widget-mx(){
	.AgileDialogsWidget {          
		min-width: 0;
		padding-right:8px;           
	}
}
.k-tooltip-validation() {
	padding: 5px 10px 6px 8px;
	position: absolute;
	top: 100%;
	left: -10px;
	right: -10px;
	margin: 10px 0 0 0;
	background-color: @validation-background-color;
	text-align: left;

	&:after {
		color: @validation-border-color;
		content: "▲";
		position: absolute;
		font-size: 22px;
		top: -23px;
		left: 15px;
		opacity: 0.5;
	}
}

.hide-logos-when-hosted-mixing(@h) when (@h = "1" ) {
	#ADFinishFrame {
		#LogoXRM, #LogoAD, #LogoAP {
			visibility: hidden;
		}
	}
}

.show-date-value-mixming() {
	padding-right: 1em;
	cursor: pointer;

	&:after {
		font-family: "Segoe UI";
		content: "\033D";
		font-size: 2em;
		color: darkgray;
		position: absolute;
		width: 8px;
		height: 8px;
	}
}

.ADBackground-mixing() {
    position: absolute;
    img {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    span {        
        background-image: @background-image;
        -moz-background-size: 100% 100%;
        -o-background-size: 100% 100%;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
        height: 100%;
        position: absolute;
        width: 100%;
        }    
}

.ADLogoAD-mixing() {
	background-image: @agileDialogs-logo;
	min-height: 30px;
	min-width: 192px;
}

.ADLogoXRM-mixing() {
	background-image: @agileXrm-logo;
	min-height: 30px;
	min-width: 150px;
}

.ADLogoAP-mixing() {
	min-height: 24px;
	min-width: 133px;
}

.questionCaption-mx() {
    .questionCaption {
        word-wrap: break-word;

        p {
            white-space: pre-wrap;
        }

        &.required {            
            padding-left: 17px;

            &:before {
                color: @validation-border-color;
                content: "■";
                font-size: 10px;
                position: relative;
                display: block;
                height: 0;
                left: -14px;
                top: 3px;
            }

            p:first-child {
                display: inline;
            }
        }
    }
}

/* Theme: less/kendo/theme.uui.less */
@widget-background-color: #fff;
@background-color: #fff;
@widget-gradient: "none";
@widget-border-color: #dadada;
@widget-text-color: rgb(68, 68, 68);
@widget-shadow: none;
@header-background-color: #fff;
@header-text-color: rgb(51, 51, 51);
@button-background-color: #fff;
@button-text-color: #000000;
@group-background-color: #fff;
@group-border-color: #dadada;
@content-background-color: #fff;
@select-background-color: #fff;
@select-border-color: #dadada;
@select-hover-background-color: #b1d6f0;
@select-group-background-color: #fff;
@hover-background-color: #d7ebf9;
@hover-border-color: #667c8f;
@hover-text-color: #000000;
@hover-gradient: "none";
@hover-shadow: none;
@selected-background-color: #b1d6f0;
@selected-border-color: #b1d6f0;
@selected-text-color: #000000;
@selected-gradient: "none";
@selected-shadow: none;
@active-background-color: #fff;
@active-border-color: #667c8f;
@active-text-color: #000000;
@active-gradient: "none";
@active-shadow: none;
@focused-border-color: #dadada;
@focused-item-shadow: rgb(68, 91, 0) 0px 0px 0px 1px inset;
@focused-active-item-shadow: rgb(68, 91, 0) 0px 0px 3px 1px inset;
@focused-shadow: none;
@error-background-color: #fff;
@error-border-color: #e20000;
@error-text-color: #e20000;
@disabled-text-color: #7b6f6f;
@validation-background-color: #F9EDED;
@validation-border-color: rgba(191, 9, 0, 0.075);
@validation-text-color: rgb(191, 9, 0);
@tooltip-background-color: #fff;
@tooltip-border-color: #dadada;
@tooltip-text-color: #525252;
@main-border-radius: 0px;
@list-border-radius: @main-border-radius - 1;
@inner-border-radius: @main-border-radius - 2;
@slider-border-radius: 13px;
@draghandle-border-radius: 0px;
@draghandle-border-color: #667c8f;
@draghandle-background-color: #667c8f;
@draghandle-shadow: none;
@draghandle-hover-border-color: @hover-border-color;
@draghandle-hover-background-color: @hover-background-color;
@draghandle-hover-shadow: none;
@default-icon-opacity: 0.8;
@scheduler-background-color: #fff;
@cell-border-color: #dadada;
@column-highlight-background-color: #fbfbfb;
@current-time-color: #e20000;
@event-background-color: #dadada;
@event-text-color: #fff;
@calendar-border-radius: 0px;
@calendar-content-text-color: #787878;
@calendar-footer-background: #fff;
@calendar-footer-text-decoration: none;
@calendar-footer-hover-text-decoration: underline;
@calendar-footer-hover-background: @widget-background-color;
@calendar-footer-active-background: @widget-background-color;
@calendar-header-hover-text-decoration: none;
@calendar-header-hover-background: @hover-background-color;
@calendar-group-background-color: #fff;
@button-border-color: #efefef;
@menu-border-color: #4c5356;
@filter-menu-content-background: #fff;
@icon-background-color: rgba(0, 0, 0, 0);
@tabstrip-items-border: #dadada;
@tabstrip-active-background: #fff;
@tabstrip-tabs-color: #787878;
@form-widget-color: #787878;
@drop-down-background: #fff;
@drop-down-border-color: #dadada;
@drop-down-hover-border-color: #fff;
@drop-down-focused-border-color: #dadada;
@drop-down-text-color: #787878;
@secondary-border-color: #dadada;
@secondary-text-color: #787878;
@numeric-selected-background: #7ea700;
@panelbar-content-background: #fff;
@panelbar-content-color: #787878;
@window-shadow-style: 1px 1px 7px 1px;
@upload-progress-text-color: #0066cc;
@upload-progress-background-color: #d0f8ff;
@upload-success-text-color: #28760b;
@upload-success-background-color: #ddffd0;
@upload-error-text-color: #cc0000;
@upload-error-background-color: #ffded7;
@alt-background-color: transparent;
@input-background-color: #fff;
@input-text-color: #000000;
@shadow-color: rgba(0,0,0,0.298039);
@shadow-inset-color: transparent;
@link-text-color: #444444;
@loading-panel-color: #fff;
@splitbar-background-color: #dadada;
@input-disabled-opacity: 1;
@ad-app-wrapper-border-size: 0px;
/* Font*/
@font-face {
	font-family: 'theme.crm';
	src: url('../fonts/theme.crm.eot?mhq6xa');
	src: url('../fonts/theme.crm.eot?mhq6xa#iefix') format('embedded-opentype'), url('../fonts/theme.crm.ttf?mhq6xa') format('truetype'), url('../fonts/theme.crm.woff?mhq6xa') format('woff'), url('../fonts/theme.crm.svg?mhq6xa#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* CRM SPECIFIC */
@font-family: 'Segoe UI Regular', 'SegoeUI', 'Segoe UI';
@font-family-semibold: SegoeUI-Semibold, "Segoe UI Semibold", "Segoe UI Regular", "Segoe UI";
@widget-font-size: 12px;
@input-font-weight: 600;
@xrmgrid-border-spacing: 0;

@xrmgrid-td-border-style: none;
@xrmgrid-td-line-height: inherit;
@xrmgrid-td-font-size: 14px;
@xrmgrid-row-height: 45px;
@lookupGrid-height: 400px;
@lookupGrid-k-grid-content-height: 300px;

@xrmgrid-k-grid-header-font-weight: normal;
@xrmgrid-k-grid-header-link-padding: 4px 0.6em 4px;
@xrmgrid-k-grid-header-font-size: 15px;
@imagespin-background: rgba(255,255,255,0.8) url('@{agiledialogs-images}/loading.svg') no-repeat center center;
@widget-frame-color: rgb(59, 121, 183);
@text-outstanding: #002050;


// Custom Theme Overrride
@allow-custom-css: true;
// @background-color-cds: rgb(248, 247, 246);
@background-color-cds: #FFF;
@font-weight: 400;
@breadCrumbs-font: 'Segoe UI Regular', 'SegoeUI', 'Segoe UI';
@button-font: @breadCrumbs-font;
@title-font: @breadCrumbs-font;
@select-hover-background-color: rgb(192, 212, 232);
@hover-background-color: rgb(216, 216, 216);

// MIXINGS

.font-checkbox-mixin() {

    input[type=checkbox],
    input[type=radio] {
        display: none;
    }

    input[type=checkbox] ~ label,
    input[type=radio] ~ label {
        font-family: "theme.crm";
        display: inline-block;
        color: @text-outstanding;
    }

    input[type=checkbox]:checked ~ label:before,
    input[type=radio]:checked ~ label:before,
    input[type=checkbox].check-all ~ label:before {
        content: "\ea10";
    }
}

.kendo-grid-mixin() {

	.k-grid {
		border-top: none;

		.k-grid-header {
			border-top: solid 0.25rem @widget-frame-color;

			th {
				.font-checkbox-mixin();
				cursor: pointer;
				border-top: 6.5px solid #fff;
				border-right: 5px solid #fff;
				border-bottom: 6.5px solid #fff;
				border-left: 5px solid #fff;

				&:first-child a {
					border-left: none !important;
				}

				a,
				.k-link:link,
				.k-link:visited {
					color: rgb(49, 95, 162);
					border-left: 1px solid;
				}

				* {
					cursor: pointer;
				}
			}
		}
				
		table {
			border-spacing: @xrmgrid-border-spacing;

			tr {
				height: @xrmgrid-row-height;
				font-family: 'SegoeUI', 'Segoe UI';

				&:not(.k-state-selected):nth-child(odd) {
					background-color: rgb(239, 239, 239);
				}



				td {
					padding: 0.7em;
					.font-checkbox-mixin();
					border-style: @xrmgrid-td-border-style;
					line-height: @xrmgrid-td-line-height;
					font-size: @xrmgrid-td-font-size;
					vertical-align: middle !important;
				}

				&.k-state-selected {
					td:nth-child(2) {
						font-family: @font-family-semibold;
					}

					background-color: @select-hover-background-color;

					&:hover {
						background-color: @select-hover-background-color;
					}
				}
			}
		}
	}

	.k-grid-header {
		.k-header {
			font-weight: @xrmgrid-k-grid-header-font-weight;
			font-size: @xrmgrid-k-grid-header-font-size;
			font-stretch: normal;
			padding: 0.8em;

			.k-link {
				padding: @xrmgrid-k-grid-header-link-padding;
			}

			.k-link:hover {
				background-color: initial;
			}
			
		}
	}

	.k-grid-pager {

		&.k-pager-wrap > .k-link,
		&.k-pager-wrap > .k-pager-input,
		&.k-pager-wrap > .k-pager-input input {
			border-style: none;
		}

		.k-pager-numbers,
		.k-pager-nav {
			.k-state-selected,
			.k-link,
			.k-link:hover {
				border-radius: 0px;
				border-style: none;
				line-height: 22px;
				padding: 0 7px;
				min-width: 8px;
			}
		}
	}
}

.kendo-grid-rowhover-mixin() {
	tr {
		&:hover:not(.k-state-selected) {
			background-color: @hover-background-color !important;

			td:nth-child(2) {
				font-family: @font-family-semibold;
			}
		}
	}
}

// AGILEDIALOGS override
body, button, input, select, table, textarea {
	font-weight: @font-weight;
}

.title-text {
	font-family: @breadCrumbs-font;
	height: 2rem;
	font-weight: @font-weight;
}

#BreadCrumbs {
    font-family: @breadCrumbs-font;
    background-color: @background-color-cds !important;
    border: none !important;

    #BreadCrumbsSteps {
        span {
            font-family: @font-family-semibold;
            padding-bottom: 0.25rem;

            &:last-child {
                color: @header-text-color;
                border-bottom: rgb(59, 121, 183) solid;
                padding-bottom: 0px;
                padding-right: 0px;
            }
        }
    }

    .k-button.showmore,
    .k-button.showless {
        background-color: #FFF !important;

        &:hover {
            color: @header-text-color !important;

            .k-si-plus {
                background-position: -32px -208px;
            }

            .k-si-minus {
                background-position: -32px -224px;
            }
        }
    }
}

div#ADBackground {
	background-color: @background-color-cds;

	span {
		background-image: none;
	}
}

#ADWidgetsWrapper {
    overflow-x: hidden !important;
    border: none !important;

    &:not(.designtime) {
        padding-top: 1rem !important;
        padding-bottom: 1.25rem !important;
       
    }

    .AgileDialogsWidget {

        .questionCaption {
            display: inline-block;
            margin-right: .5rem !important;
            max-width: ~"calc(100% - 32px)";

            &.multi {
                max-width: calc(100%);
                + div[rel=tooltip]{
                    right:0 !important;
                }
            }
        }

        .questionCaption,
        .AgileDialogsWidgetControlContainer {
            font-size: 14px;
            color: @widget-text-color;

            &.required {
                padding-left: 0 !important;

                &:before {
                    display: none !important;
                }

                &:not(.multi):after {
                    color: #ea0600 !important;
                    content: "*" !important;
                    font-size: 21px !important;
                    top: 0.5rem !important;
                    padding-left: 4px;
                    line-height: 0.5rem;
                }

                &.multi {
                    .req:after {
                        color: #ea0600 !important;
                        content: "*" !important;
                        font-size: 21px !important;
                        padding-left: 4px;
                        line-height: 0.5rem;
                        position: relative;
                    }
                }
            }
        }


        &.XRMGrid {
            .AgileDialogsWidgetCaptionContainer {
                .k-invalid-msg {
                    left: 37px;
                    width: 90%;
                }
            }

            .CrmGridControlContainer {
                .kendo-grid-mixin();
                .kendo-grid-rowhover-mixin();

                .k-content {
                    margin: 0 0 0 0;
                    padding: 0 0 0 0;
                }

                tr {

                    td {
                        font-size: 15px !important;
                        padding: 12.5px 10px 12.5px 10px !important;
                    }
                }
            }

            .k-tooltip-validation {
                position: static !important;
                width: calc(~"100% - 18px") !important;

                &:after {
                    display: none;
                }
            }
        }

        .k-textbox > input,
        .k-autocomplete,
        .k-dropdown-wrap,
        .k-autocomplete,
        .k-picker-wrap,
        .k-numeric-wrap {
            &.k-state-active,
            &.k-state-focused,
            &.k-state-default {
                background-color: @select-background-color;

                &:hover {
                    background-color: @drop-down-hover-border-color;
                }
            }

            .k-input {
                background-color: @select-background-color;
            }
        }

        .k-autocomplete,
        .k-combobox,
        .k-picker-wrap {
            & input, .k-input {
                border-style: none !important;
                box-shadow: none !important;
            }
        }

        .k-tooltip-validation {
            font-family: @font-family-semibold;
            font-size: 14px;
            border: none;
            box-shadow: initial;


            .k-icon {
                filter: ~"grayscale(100%) sepia(100%) saturate(50) contrast(0.5)";
                border-radius: 50%;
                border: 1px @validation-text-color solid;

                &.k-warning {
                    background-position: -32px -16px;
                }
            }

            &:after {
                opacity: 1 !important;
                left: 3px;
            }
        }

        .optionsContainer, .FileControlContainer {
            .k-tooltip-validation {
                top: 60% !important;
            }
        }

        &.hastooltip {

            div[rel=tooltip] {
                border: none !important;
                display: inline-block !important;
                right: initial !important;
                top: -0.5rem;

                .widget-help-click-image {
                    background-position: -160px -256px;
                }
            }
        }

        &:not(.infoWidget,.frameWidget).disabledControl {
            .questionCaption {
                padding-left: 17px !important;

                &:before {
                    display: block !important;
                    background-image: url('@{image-folder}/sprite.png');
                    background-position: -117px -133px !important;
                    content: "" !important;
                    position: absolute !important;
                    left: 0 !important;
                    width: 16px !important;
                    height: 16px !important;
                    opacity: 1 !important;
                    top: 0.1rem !important;
                }
            }

            input, textarea {
                &:hover {
                    background-color: rgb(226, 226, 226);
                }
            }
        }

        .suscriberSpin {
            margin-left: 16px !important;
            margin-top: 1px;
            background: url('@{agiledialogs-images}/loading.svg') no-repeat !important;
            background-size: 16px 16px !important;
        }

        .k-loading-image {
            filter: grayscale(1);
        }
    }
}

.k-list-container {
	&.k-popup {
		ul {
			li {
				&.k-item {
					//color: red;
					font-size: @xrmgrid-td-font-size;
					white-space: nowrap;
				}
			}
		}
	}
}

#lookupWindow {
    .kendo-grid-mixin();
    .kendo-grid-rowhover-mixin();

    a#lookupFilterButton {
        height: 30px;
        width: 30px;
        top: -13px;
        left: -5px;
        border: none;
        background-color: initial;

        .k-lookup-filter:hover {
            background-position: -32px -240px;
        }
    }
}

#ADAppWrapper {
    border: none !important;

    .CalendarControlContainer, .CurrencyControlContainer, .NumericControlContainer {
        input {
            border: none !important;
        }
    }

    &.centered {
        #BreadCrumbs {
            &::before {
                background-color: #fff !important;
            }
        }
    }
    /*.k-numerictextbox*/
    .CurrencyControlContainer, .NumericControlContainer {

        .k-i-arrow-n {
            background-position: 0 -260px;
        }

        .k-i-arrow-s {
            background-position: 0 -290px;
        }
    }

    .k-dropdown {
        font-size: @xrmgrid-td-font-size;
        white-space: nowrap;

        .k-i-arrow-s {
            background-position: 0 -288px;
        }
    }




    #notesTitle, #notesInput {
        border: none !important;
    }

    #fixedDiv.site-bottom-bar {
        .site-bottom-bar-frame {
            .site-bottom-bar-content {
                background-color: @background-color-cds !important;
                left: 0;

                .k-button {
                    border: 1px solid @button-border-color;
                    font-family: @font-family;
                }
            }
        }
    }

    #Output {

        > .pageParentDiv {

            > .dialogPageTable {

                .pageCaption {
                    color: rgb(59, 121, 183) !important;
                    background-color: @background-color-cds !important;
                    padding-left: 10px;
                    padding-top: 5px;
                                    }
            }
        }
    }
}


.icons-position-mixin() {
    .k-icon {

        &.k-i-arrowhead-w {
            background-position: -16px -304px;
        }

        &.k-i-arrowhead-e {
            background-position: -16px -272px;
        }

        &.k-view-process {
            background-position: -176px -320px;
        }

        &.k-ad-history {
            background-position: -176px -304px;
        }

        &.k-edit {
            background-position: -48px 0;
        }

        &.k-cancel {
            background-position: -48px -48px;
        }

        &.k-review {
            background-position: -176px -80px;
        }

        &.k-update {
            background-position: -48px -32px;
        }

        &.k-feedbackwindow-ok {
            background-position: -176px -80px;
        }

        &.k-noteswindow-ok {
            background-position: -176px -96px;
        }

        &.k-feedbackwindow-cancel,
        &.k-messagewindow-cancel {
            background-position: -48px -16px;
        }
    }
}
#ADAppWrapper,
#confirmWindow,
#messageWindow,
#feedbackWindow,
#lookupWindow,
#toolsWindow,
#notesWindow,
.k-editor-dialog,
.k-viewhtml-dialog,
.k-filebrowser-dialog,
.render-popup-buttons {
    .message-content-buttons,
    .buttons-container,
    .botton,
    .k-edit-buttons {
        .k-button {
            border: 1px solid @button-border-color !important;

            .k-icon.k-update {
                background-position: -48px -32px;
            }

            .k-lookup-cancel {
                background-position: -48px -16px;
            }

            .k-lookup-ok {
                background-position: -48px -240px;
            }

            &:hover {
                border: 1px solid @button-border-color;
            }
        }
    }

    .k-button:not(#lookupFilterButton) {
        &.k-button-history-selected {
            color: #FFF !important;
            border-color: rgb(47, 95, 144);
        }

        color: #FFF;
        border-color: rgb(47, 95, 144);
        background-color: rgb(47, 95, 144);

        .icons-position-mixin();

        &.last-button {           
            margin-right: .5rem;
        }
    }
}

.optionsContainer {
    &.buttonset {
        .icons-position-mixin();
    }

    input[type=checkbox],
    input[type=radio] {
        top: 1px;
        margin-right: 0.5rem;
        position: relative;
    }
}
/* PROCESS MANAGER override */

@active-text-color: @widget-frame-color;
@button-active-border-color: rgb(47, 95, 144);

@selected-text-color: @widget-frame-color;
@k-window-titlebar-background-color: @group-background-color;
@button-hover-background-color: @hover-background-color;
@button-active-background: @hover-background-color;
@disabled-border-color: none;
@Link: @link-text-color;
@link-font-weight: normal;
@Error: #c00;
@Warning: #b87333;
@Ok: #7ea700;
@Info: #3399b8;
@statux-icon-margin: 0;
@k-grid-content-margin: 27px 0 0 0;
@button-text-color: rgb(51, 51, 51);


.AgilePoint_ProcessViewer,
.DOMSTAGESComp {
    .kendo-grid-mixin();
}

.DOMSTAGE,
.AgilePoint_ProcessViewer {
    .Loading {
        border: none;
        background: url('../../../../stages/agilepoint/processviewer/style/icons/progress.gif') no-repeat 4px 10px;

        img {
            visibility: hidden;
        }
    }

    .Loader {
        .Spiner {
            span {
                &.Icon {
                    visibility: hidden;
                }
            }

            background: url('../../../../stages/agilepoint/processviewer/style/icons/progress.gif') no-repeat 4px 10px;
            height: 4em;
            width: 4em;
        }
    }
}

div.DOMSTAGE {
    &.AgilePoint_ProcessViewer {
        font-family: @font-family !important;

        .k-button {
            color: @button-text-color;
        }
    }
}

div.DOMSTAGESComp {

    .Title {
        .Text {
            color: @header-text-color;
        }
    }



    .k-grid {

        span.StatusIcon {

            &.fa { // IMAGE
                &.Active:before,
                &.Assigned:before,
                &.Pending:before {
                    font-size: inherit;
                    width: 18px;
                    height: 14px !important;
                }

                &.Pending:before {
                    margin-top: 1px;
                }
            }
        }
    }

    .Kendo_InfoBlock {
        color: @header-text-color;
        background-color: @background-color-cds;

        div.Content {
            background-color: initial !important;
        }
    }

    .Modals_ProcessDetails_Tabs_ManualTasks_Grid {
        &.Kendo_Grid {
            .Grid {
                .k-grid-content {
                    margin-top: 62px !important;
                }
            }

            td {
                line-height: 8px;

                &.k-detail-cell {
                    line-height: 14px;
                }
            }
        }
    }

    .Modals_ProcessDetails_Tabs_ManualTaskTree_Grid,
    .Modals_ProcessDetails_Tabs_Activities,
    .Modals_ProcessDetails_Tabs_Events_Grid {
        .Grid {
            height: auto;

            .k-grid-content {
                height: auto;
            }
        }
    }

    .Modals_ProcessDetails_Tabs_Data,
    .Modals_ProcessDetails_Tabs_DialogSummary {
        .Grid {
            .k-grid-content {
                margin-top: 15px !important;
            }
        }
    }
}
/* PROCESS LAUNCHER */
.AgilePoint_ProcessLauncher {
    .kendo-grid-mixin();

    .Grid {
        .k-grid-content {
            top: 1.7rem !important;
        }
    }
}
/* ADMIN TOOL override */
@background-added: #aed9a7;
@background-removed: #a17979;


#admtool-content {
    #tabstrip {
        .k-tabstrip-items {
            li {
                font-family: @font-family-semibold;

                &.k-state-active {
                    border-top: solid 3px @widget-frame-color;
                }
            }
        }
    }

    .entitiesTab,
    .activitiesTab {
        .kendo-grid-mixin();

        .k-grid-content {
            .kendo-grid-rowhover-mixin();

            tr {

                &.added {
                    background-image: none !important;
                }

                &.removed {
                    background-image: none !important;
                }
            }
        }
    }
}

/* End of Theme: less/kendo/theme.uui.less */
/* Kendo skin */

// Mixins

.box-orient(@direction) {
    -moz-box-orient: @direction;
    -webkit-box-orient: @direction;
    -ms-box-orient: @direction;
    box-orient: @direction;
}

.box(@type) {
    display: ~"-moz-@{type}";
    display: ~"-webkit-@{type}";
    display: ~"-ms-@{type}";
    display: @type;
}

.box-direction(@direction) {
    -moz-box-direction: @direction;
    -webkit-box-direction: @direction;
    -ms-box-direction: @direction;
    box-direction: @direction;
}

.box-flex(@amount) {
    -moz-box-flex: @amount;
    -webkit-box-flex: @amount;
    -ms-box-flex: @amount;
    box-flex: @amount;
}

.box-align(@alignment) {
    -moz-box-align: @alignment;
    -webkit-box-align: @alignment;
    -ms-box-align: @alignment;
    box-align: @alignment;
}

.box-pack(@pack) {
    -moz-box-pack: @pack;
    -webkit-box-pack: @pack;
    -ms-box-pack: @pack;
    box-pack: @pack;
}

.border-radius(...) {
    -moz-border-radius: @arguments;
    -webkit-border-radius: @arguments;
    border-radius: @arguments;
}

.guarded-border-radius(@value) when (@value < 0) {
    .border-radius(0);
}

.guarded-border-radius(@value) when (@value >= 0) {
    .border-radius(@value);
}

.box-shadow(...) {
    -webkit-box-shadow: @arguments;
    box-shadow: @arguments;
}

.window-shadow(@shadow-color) when not (@shadow-color = transparent) {
    border-color: @shadow-color;
    .box-shadow(1px 1px 7px 1px lighten(@shadow-color, 50%));

    &.k-state-focused {
        border-color: @shadow-color;
        .box-shadow(1px 1px 7px 1px @shadow-color);
    }
}

.window-shadow(@shadow-color) when (@shadow-color = transparent) and (lightness(@widget-background-color) < 50%) {
    border-color: @widget-border-color;

    &.k-state-focused {
        border-color: lighten(@widget-border-color, 20%);
    }
}

.window-shadow(@shadow-color) when (@shadow-color = transparent) and (lightness(@widget-background-color) >= 50%) {
    border-color: @widget-border-color;

    &.k-state-focused {
        border-color: darken(@widget-border-color, 10%);
    }
}

.box-sizing(@type) {
    -moz-box-sizing: @type;
    -webkit-box-sizing: @type;
    box-sizing: @type;
}

.background-clip(@type) {
    -moz-background-clip: @type;
    -webkit-background-clip: @type;
    background-clip: @type;
}

.transform(...) {
    -webkit-transform: @arguments;
    -moz-transform: @arguments;
    -ms-transform: @arguments;
    -o-transform: @arguments;
    transform: @arguments;
}

.composite-background(@gradient) when (@gradient = none) {
    background-image: @texture;
}

.composite-background(@gradient) when not (@gradient = none) {
    background-image: @fallback-texture;
    background-image: @texture, -webkit-linear-gradient(top, ~"@{gradient}");
    background-image: @texture,    -moz-linear-gradient(top, ~"@{gradient}");
    background-image: @texture,      -o-linear-gradient(top, ~"@{gradient}");
    background-image: @texture,       ~"linear-gradient(to bottom, @{gradient})";
}

.k-in,
.k-item,
.k-window-action
{
    border-color: transparent;
}

/* main colors */

.k-block,
.k-widget
{
    background-color: @widget-background-color;
}

.k-block,
.k-widget,
.k-input,
.k-textbox,
.k-group,
.k-content,
.k-header,
.k-editable-area,
.k-separator,
.k-colorpicker .k-i-arrow-s,
.k-textbox > input,
.k-autocomplete,
.k-dropdown-wrap,
.k-toolbar,
.k-group-footer td,
.k-grid-footer,
.k-footer-template td,
.k-state-default,
.k-state-default .k-select,
.k-state-disabled,
.k-grid-header-wrap,
.k-grid-header,
.k-grid td,
.k-grid td.k-state-selected,
.k-grid-footer-wrap,
.k-pager-wrap,
.k-pager-wrap .k-link,
.k-pager-refresh,
.k-grouping-header,
.k-grouping-header .k-group-indicator,
.k-panelbar > .k-item > .k-link,
.k-panel > .k-item > .k-link,
.k-panelbar .k-panel,
.k-panelbar .k-content,
.k-calendar th,
.k-slider-track,
.k-splitbar,
.k-dropzone-active,
.k-upload-files,
.k-tiles,
.k-toolbar,
.k-tooltip,
.k-progress
{
    border-color: @widget-border-color;
}

.k-group,
.k-toolbar,
.k-grouping-header,
.k-pager-wrap,
.k-group-footer td,
.k-grid-footer,
.k-footer-template td,
.k-widget .k-status,
.k-grouping-row td,
td.k-group-cell,
.k-calendar th,
.k-dropzone-hovered,
.k-upload-files,
.k-widget.k-popup
{
    background-color: @group-background-color;
}

.k-list-container
{
    border-color: @group-border-color;
    background-color: @select-group-background-color;
}

.k-content,
.k-editable-area,
.k-panelbar > li.k-item,
.k-panel > li.k-item,
.k-tiles
{
    background-color: @content-background-color;
}

.k-alt,
.k-separator
{
    background-color: @alt-background-color;
}

.k-textbox,
.k-autocomplete.k-header,
.k-dropdown-wrap.k-state-active,
.k-picker-wrap.k-state-active,
.k-numeric-wrap.k-state-active
{
    border-color: @widget-border-color;
    background-color: @select-background-color;
}

.k-textbox > input,
.k-autocomplete .k-input,
.k-dropdown-wrap .k-input,
.k-autocomplete.k-state-focused .k-input,
.k-dropdown-wrap.k-state-focused .k-input,
.k-picker-wrap.k-state-focused .k-input,
.k-numeric-wrap.k-state-focused .k-input
{
    border-color: @widget-border-color;
}

input.k-textbox,
textarea.k-textbox,
input.k-textbox:hover,
textarea.k-textbox:hover,
.k-textbox > input
{
    background: none;
}

.k-input,
input.k-textbox,
textarea.k-textbox,
input.k-textbox:hover,
textarea.k-textbox:hover,
.k-textbox > input
{
    background-color: @input-background-color;
    color: @input-text-color;
    font-weight: @input-font-weight;
}

// Bootstrap readonly input styling has more specificity than ours.
.k-input[readonly]
{
    background-color: @input-background-color;
    color: @input-text-color;
}

.k-block,
.k-widget,
.k-popup,
.k-content,
.k-dropdown .k-input
{
    color: @widget-text-color;
}

.k-link:link,
.k-link:visited
{
    color: @link-text-color;
}

.k-tabstrip-items .k-link,
.k-panelbar > li > .k-link
{
    color: @widget-text-color;
}

.k-header
{
    color: @header-text-color;
}

.k-header,
.k-grid-header,
.k-toolbar,
.k-dropdown-wrap,
.k-picker-wrap,
.k-grouping-header,
.k-pager-wrap,
.k-textbox,
.k-button,
.k-draghandle,
.k-autocomplete,
.k-state-highlight,
.k-tabstrip-items .k-item
{
    .composite-background(@widget-gradient);
    background-position: 50% 50%;
}

.k-tabstrip-items .k-state-active
{
    background: @active-background-color;
}

.k-widget.k-tooltip
{
    background-image: @tooltip-texture;
}

.k-block,
.k-header,
.k-grid-header,
.k-toolbar,
.k-grouping-header,
.k-pager-wrap,
.k-button,
.k-draghandle
{
    background-color: @header-background-color;
}

/* icons */

.k-icon:hover,
.k-state-hover .k-icon,
.k-state-selected .k-icon,
.k-state-focused .k-icon,
.k-column-menu .k-state-hover .k-sprite,
.k-column-menu .k-state-active .k-sprite
{
    opacity:1;
}

.k-icon,
.k-state-disabled .k-icon,
.k-column-menu .k-sprite
{
    opacity: @default-icon-opacity;
}

.k-icon,
.k-tool-icon,
.k-grouping-dropclue,
.k-drop-hint,
.k-column-menu .k-sprite
{
    background-image: url('@{image-folder}/sprite.png?25300.8.0.25300.2050420250612');
    border-color: transparent;
}

.k-loading,
.k-state-hover .k-loading
{
    background-image: url('@{image-folder}/loading.gif');
    background-position: 50% 50%;
}

.k-loading-image { background-image: url('@{image-folder}/loading-image.gif'); }
.k-loading-color { background-color: @loading-panel-color; }

.k-button
{
    color: @button-text-color;
}

.k-button,
.k-button.k-state-disabled:hover,
.k-state-disabled .k-button:hover,
.k-button.k-state-disabled:active,
.k-state-disabled .k-button:active
{
    border-color: @widget-border-color;
    background-color: @button-background-color;
}

.k-button {
    &.k-button-history-selected {
        color: @hover-text-color !important;
        border-color: @hover-border-color;
        background-color: rgba(red(@button-active-border-color), green(@button-active-border-color), blue(@button-active-border-color), 0.3) !important;
        align-items: center;
        box-shadow: @hover-border-color 0px 0px 5px 2px;
    }

    &:hover {
        color: @hover-text-color;
        border-color: @hover-border-color;
        background-color: @hover-background-color;
    }
}

.k-draghandle
{
    border-color: @draghandle-border-color;
    background-color: @draghandle-background-color;
    .box-shadow(@draghandle-shadow);
}

.k-draghandle:hover
{
    border-color: @draghandle-hover-border-color;
    background-color: @draghandle-hover-background-color;
    .box-shadow(@draghandle-hover-shadow);
}

/* states */

.k-state-active,
.k-state-active:hover,
.k-active-filter
{
    background-color: @active-background-color;
    border-color: @active-border-color;
    color: @active-text-color;
}

.k-menu .k-state-hover>.k-state-active
{
    background-color: transparent;
}

.k-state-highlight
{
    background: @active-background-color;
    color: @active-text-color;
}

.k-state-focused,
.k-grouping-row .k-state-focused
{
    border-color: @focused-border-color;
}

.k-state-selected,
.k-state-selected:link,
.k-list>.k-state-selected,
.k-list>.k-state-highlight,
.k-panel > .k-state-selected,
.k-button:active,
.k-ghost-splitbar-vertical,
.k-ghost-splitbar-horizontal,
.k-draghandle.k-state-selected:hover
{
    color: @selected-text-color;
    background-color: @selected-background-color;
    border-color: @selected-border-color;
}

.k-state-focused,
.k-list>.k-state-focused,
.k-listview>.k-state-focused,
.k-grid-header th.k-state-focused,
td.k-state-focused,
.k-button:focus,
.k-button.k-state-focused
{
    .box-shadow(@focused-item-shadow);
}

.k-list>.k-state-selected.k-state-focused
{
    .box-shadow(none);
}

.k-state-selected>.k-link,
.k-panelbar > li > .k-state-selected
{
    color: @selected-text-color;
}

.k-state-selected,
.k-button:active,
.k-draghandle.k-state-selected:hover
{
    .composite-background(@selected-gradient);
    background-position: 50% 50%;
}

.k-state-hover,
.k-state-hover:hover,
.k-splitbar-horizontal-hover:hover,
.k-splitbar-vertical-hover:hover,
.k-list>.k-state-hover,
.k-marquee,
.k-pager-wrap .k-link:hover,
.k-dropdown .k-state-focused,
.k-imagebrowser-dropzone
{
    color: @hover-text-color;
    background-color: @hover-background-color;
    border-color: @hover-border-color;
}

.k-state-hover > .k-select,
.k-state-focused > .k-select
{
    border-color: @hover-border-color;
}

.k-button:hover,
.k-button:focus,
.k-button.k-state-focused,
.k-textbox:hover,
.k-state-hover,
.k-state-hover:hover,
.k-pager-wrap .k-link:hover,
.k-other-month.k-state-hover .k-link,
div.k-imagebrowser-dropzone em,
.k-draghandle:hover
{
    .composite-background(@hover-gradient);
}

.k-autocomplete.k-state-active,
.k-picker-wrap.k-state-active,
.k-numeric-wrap.k-state-active,
.k-dropdown-wrap.k-state-active,
.k-state-active,
.k-state-active:hover,
.k-state-active>.k-link,
.k-button:active,
.k-panelbar>.k-item>.k-state-focused
{
    .composite-background(@active-gradient);
}

.k-tool-icon,
.k-tool-icon.k-state-hover,
.k-tool-icon.k-state-active,
.k-tool-icon.k-state-active.k-state-hover
{
    background-image: url('@{image-folder}/sprite.png?25300.8.0.25300.2050420250612');
}

.k-state-hover>.k-link,
.k-other-month.k-state-hover .k-link,
div.k-imagebrowser-dropzone em
{
    color: @hover-text-color;
}

.k-autocomplete.k-state-hover,
.k-autocomplete.k-state-focused,
.k-picker-wrap.k-state-hover,
.k-picker-wrap.k-state-focused,
.k-numeric-wrap.k-state-hover,
.k-numeric-wrap.k-state-focused,
.k-dropdown-wrap.k-state-hover,
.k-dropdown-wrap.k-state-focused
{
    background-color: @select-hover-background-color;
    .composite-background(@hover-gradient);
    background-position: 50% 50%;
    border-color: @select-border-color;
}

.k-calendar .k-state-selected.k-state-focused>.k-link
{
    background-color: transparent;
}

.k-dropdown .k-state-focused .k-input
{
    color: @widget-text-color;
}

.k-dropdown .k-state-hover .k-input
{
    color: @hover-text-color;
}

.k-state-error
{
    border-color: @error-border-color;
    background-color: @error-background-color;
    color: @error-text-color;
}



.k-tile-empty.k-state-selected,
.k-loading-mask.k-state-selected {
    border-width: 0;
    background-image: none;
    background-color: transparent;
}

.k-state-disabled,
.k-state-disabled .k-link,
.k-state-disabled .k-button,
.k-button.k-state-disabled:active,
.k-other-month .k-link,
.k-dropzone em,
.k-tile-empty strong,
.k-slider .k-draghandle
{
    color: @disabled-text-color;
}

/* Slider */

.k-slider-track
{
    background-color: @widget-border-color;
}

.k-slider-selection
{
    background-color: @selected-background-color;
}

.k-slider-horizontal .k-tick
{
    background-image:url('@{image-folder}/slider-h.gif');
}

.k-slider-vertical .k-tick
{
    background-image:url('@{image-folder}/slider-v.gif');
}

/* Tooltip */

.k-widget.k-tooltip
{
    border-color: @tooltip-border-color;
    background-color: @tooltip-background-color;
    color: @tooltip-text-color;
}

.k-widget.k-tooltip-validation
{
    border-color: @validation-border-color;
    background-color: @validation-background-color;
    color: @validation-text-color;
    z-index:10000;
}

/* Bootstrap theme fix */
.input-prepend .k-tooltip-validation,
.input-append .k-tooltip-validation
{
    font-size: 12px;
    position: relative;
    top: 3px;
}

.k-callout-n
{
    border-bottom-color: @tooltip-border-color;
}

.k-callout-w
{
    border-right-color: @tooltip-border-color;
}

.k-callout-s
{
    border-top-color: @tooltip-border-color;
}

.k-callout-e
{
    border-left-color: @tooltip-border-color;
}

/* Splitter */

.k-splitbar
{
    background-color: @splitbar-background-color;
}

.k-restricted-size-vertical,
.k-restricted-size-horizontal
{
    background-color: @error-text-color;
}

/* Upload */

.k-progress-status
{
    border-color: @hover-border-color transparent;
}

/* ImageBrowser */

.k-tile
{
    border-color: @content-background-color;
}

.k-textbox:hover,
.k-tiles li.k-state-hover
{
    border-color: @hover-border-color;
}

.k-tiles li.k-state-selected
{
    border-color: @selected-border-color;
}

.k-tile .k-folder,
.k-tile .k-file
{
    background-image: url('@{image-folder}/imagebrowser.png?25300.8.0.25300.2050420250612');
}

/* Shadows */

.k-widget,
.k-button
{
    .box-shadow(@widget-shadow);
}

.k-slider,
.k-treeview,
.k-upload
{
    .box-shadow(none);
}

.k-state-hover
{
    .box-shadow(@hover-shadow);
}

.k-autocomplete.k-state-focused,
.k-dropdown-wrap.k-state-focused,
.k-picker-wrap.k-state-focused,
.k-numeric-wrap.k-state-focused
{
    .box-shadow(@focused-shadow);
}

.k-state-selected
{
    .box-shadow(@selected-shadow);
}

.k-state-active
{
    .box-shadow(@active-shadow);
}

.k-grid td.k-state-selected.k-state-focused
{
    background-color: lighten(@selected-background-color, 3%);
}

.k-popup,
.k-menu .k-group,
.k-grid .k-filter-options,
.k-time-popup,
.k-datepicker-calendar,
.k-datetimepicker-calendar,
.k-autocomplete.k-state-border-down,
.k-autocomplete.k-state-border-up,
.k-dropdown-wrap.k-state-active,
.k-picker-wrap.k-state-active,
.k-multiselect.k-state-focused,
.k-imagebrowser .k-image,
.k-tooltip
{
    .box-shadow(0 2px 2px 0 @shadow-color);
}

.k-window
{
    .window-shadow(@shadow-color);
    background-color: @widget-background-color;
}

.k-shadow
{
    .box-shadow(0 1px 2px 0 @shadow-color);
}

.k-inset
{
    .box-shadow(inset 0 1px 1px @shadow-color);
}

/* Border radius */

.k-block,
.k-button,
.k-textbox,
.k-drag-clue,
.k-touch-scrollbar,
.k-window,
.k-window-titleless .k-window-content,
.k-window-action,
.k-inline-block,
.k-grid .k-filter-options,
.k-grouping-header .k-group-indicator,
.k-autocomplete,
.k-multiselect,
.k-dropdown-wrap,
.k-datepicker,
.k-datetimepicker,
.k-timepicker,
.k-colorpicker,
.k-datetimepicker,
.k-numerictextbox,
.k-picker-wrap,
.k-numeric-wrap,
.k-colorpicker
.k-list-container,
.k-calendar-container,
.k-calendar td,
.k-calendar .k-link,
.k-treeview .k-in,
.k-editor-button .k-state-hover,
.k-editor-button .k-state-active,
.k-tooltip,
.k-tile,
.k-slider-track,
.k-slider-selection
{
    .border-radius(@main-border-radius);
}

.k-calendar-container.k-state-border-up,
.k-list-container.k-state-border-up,
.k-autocomplete.k-state-border-up,
.k-multiselect.k-state-border-up,
.k-dropdown-wrap.k-state-border-up,
.k-picker-wrap.k-state-border-up,
.k-numeric-wrap.k-state-border-up,
.k-window-content,
.k-filter-menu
{
    .border-radius(0 0 @main-border-radius @main-border-radius);
}

.k-autocomplete.k-state-border-up .k-input,
.k-dropdown-wrap.k-state-border-up .k-input,
.k-picker-wrap.k-state-border-up .k-input,
.k-picker-wrap.k-state-border-up .k-selected-color,
.k-numeric-wrap.k-state-border-up .k-input
{
    .border-radius(0 0 0 @inner-border-radius);
}

.k-multiselect.k-state-border-up .k-multiselect-wrap,
{
    .border-radius(0 0 @inner-border-radius @inner-border-radius);
}

.k-window-titlebar,
.k-block > .k-header,
.k-tabstrip-items .k-item,
.k-panelbar .k-tabstrip-items .k-item,
.k-tabstrip-items .k-link,
.k-calendar-container.k-state-border-down,
.k-list-container.k-state-border-down,
.k-autocomplete.k-state-border-down,
.k-multiselect.k-state-border-down,
.k-dropdown-wrap.k-state-border-down,
.k-picker-wrap.k-state-border-down,
.k-numeric-wrap.k-state-border-down
{
    .border-radius(@main-border-radius @main-border-radius 0 0);
}

.k-dropdown-wrap .k-input,
.k-picker-wrap .k-input,
.k-numeric-wrap .k-input
{
    .border-radius(@inner-border-radius 0 0 @inner-border-radius);
}

.k-numeric-wrap .k-link
{
    .border-radius(0 @inner-border-radius 0 0);
}

.k-numeric-wrap .k-link + .k-link
{
    .border-radius(0 0 @inner-border-radius 0);
}

.k-colorpicker .k-selected-color
{
    .border-radius(@inner-border-radius 0 0 @inner-border-radius);
}

.k-rtl .k-colorpicker .k-selected-color
{
    .border-radius(0 @inner-border-radius @inner-border-radius 0);
}

.k-autocomplete.k-state-border-down .k-input,
.k-dropdown-wrap.k-state-border-down .k-input,
.k-picker-wrap.k-state-border-down .k-input,
.k-picker-wrap.k-state-border-down .k-selected-color,
.k-numeric-wrap.k-state-border-down .k-input
{
    .border-radius(@inner-border-radius 0 0 0);
}

.k-multiselect.k-state-border-down .k-multiselect-wrap,
{
    .border-radius(@inner-border-radius @inner-border-radius 0 0);
}

.k-dropdown-wrap .k-select,
.k-picker-wrap .k-select,
.k-numeric-wrap .k-select,
.k-datetimepicker .k-select+.k-select,
.k-animation-container .k-calendar-container,
.k-list-container.k-state-border-right
{
    .border-radius(0 @main-border-radius @main-border-radius 0);
}

.k-rtl .k-dropdown-wrap .k-select,
.k-rtl .k-picker-wrap .k-select,
.k-rtl .k-numeric-wrap .k-select,
.k-rtl .k-datetimepicker .k-select+.k-select,
.k-rtl .k-animation-container .k-calendar-container,
.k-rtl .k-list-container.k-state-border-right
{
    .border-radius(@main-border-radius 0 0 @main-border-radius);
}

.k-textbox > input,
.k-autocomplete .k-input,
.k-progress,
.k-progress-status,
.k-numeric-wrap.k-expand-padding .k-input,
.k-multiselect-wrap
{
    .guarded-border-radius(@inner-border-radius);
}

.k-list .k-state-hover,
.k-list .k-state-focused,
.k-list .k-state-highlight,
.k-list .k-state-selected,
.k-dropzone,
.k-upload-files
{
    .guarded-border-radius(@list-border-radius);
}

.k-slider .k-button,
.k-grid .k-slider .k-button
{
    .border-radius(@slider-border-radius);
}

.k-draghandle
{
    .border-radius(@draghandle-border-radius);
}

/* Progressbar */

.k-progressbar-indeterminate
{
    background: url('@{image-folder}/indeterminate.gif');
}

.k-progressbar-indeterminate .k-progress-status-wrap,
.k-progressbar-indeterminate .k-state-selected
{
    display: none;
}

	/* HTML Tags */
	
html {
	margin: 0;
	padding: 0;
	height: 100%;	
}

body {
    overflow: hidden;
    margin: 0;
    padding: 0;
    font-family: @font-family;
    color: @text-color;
    height: 100%;

    > form {
        .innerbox();
    }

    form {

        &:not(#feedbackForm).centered {
            overflow-y: overlay;
            overflow-x: hidden;
            position: absolute;

            #ADBackground {
                display: none;
            }

            #ADAppWrapper {
                left: 1rem;
                padding: 1rem;
                padding-top: 0;
                min-height: ~"calc(100% - (@{ad-app-wrapper-border-size} * 2) - 1.5rem + 1px )";

                &.no-scroll {
                    left: 0rem;
                }
            }

            &.non-hosted {

                #ADAppWrapper {
                    margin: 0px;
                }


                #dialogTitle {
                    text-align: initial;

                    .version {
                        top: -1.5em;
                    }
                }

                .ADLogo {
                    display: none;
                }
            }

            .ADLogo {
                display: none;
            }
        }
    }
}

p {
	margin: 5px 0 0 0;		
		
	&:last-child { margin: 5px 0 0; }	
		
	&:first-child { margin: 0; }
}
	
a {
	text-decoration: none;	
}
	
input {
		
	outline:none;
}
	
/* Layout general */
	
#ADBackground {
	.innerbox();
		
	.ADBackground-mixing();
}

img
{
	border: none;
}
	
.ADLogo {
	background-repeat:no-repeat;
	position: absolute;
}

#ADLogoAD {
    position: fixed;
    top: 18px;
    left: 21px;

    &.ADLogo {
        .ADLogoAD-mixing();
    }
}
	
#ADLogoXRM {
	position:fixed;
	left: 10px;
	bottom: 6px;
	&.ADLogo
	{
		.ADLogoXRM-mixing();
	}
}
	
#ADLogoAP {		

	right: 23px;
	bottom: 7px;
	&.ADLogo
	{
		.ADLogoAP-mixing();
			
	}
}

#dialogTitle {
    color: @title-text-color;
    font-size: 1.4em;
    position: relative;
    text-align: right;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;

    .version {
        font-size: 10px;
        font-weight: 100;
        position: relative;
        display: inline;
        top: -2.5em;
    }
}

.hosted
{
    #dialogTitle {
        display:none !important;
    }
}

#ADAppWrapper {
    .innerbox(60px, 45px, 40px, 45px);
    border: solid @ad-app-wrapper-border-size @widget-frame-color;
    background-color: @background-color;
    overflow: hidden;
    border-radius: @main-border-radius * 2;


    &.centered {
        width: 100%;
        min-height: ~"calc(100% - (@{ad-app-wrapper-border-size} * 2))";
        min-width: 15rem;
        position: relative;
        margin-left: auto !important;
        margin-right: auto !important;

        &.hasTitle {
            min-height: ~"calc(100% - (@{ad-app-wrapper-border-size} * 2))";
        }

        .centered-mx() {
            content: " ";
            background-color: @ad-centered-margin-background-color;
            display: block;
            height: 100%;
            top: 0;
            position: fixed;
            opacity: .7;
            z-index: -1;
        }

        &::before {
            .centered-mx();
            left: 0;
        }

        &::after {
            .centered-mx();
            right: 0;
        }

        #widgetContainer {
            position: static;

            #widgetContent {
                position: static;

                #BreadCrumbs {
                    &::before {
                        width: ~"calc(100% + 2px)";
                        height: @ad-app-wrapper-border-size;
                        position: absolute;
                        background-color: @widget-frame-color;
                        content: " ";
                        display: block;
                        top: -5px;
                        left: -1px;
                    }



                    #BreadCrumbsSteps {
                        padding-left: 0.6rem;
                    }
                }

                #Output {
                    position: static;

                    .pageParentDiv {
                        position: static;

                        .dialogPageTable {
                            position: static;

                            #ADWidgetsWrapper {
                                position: static;
                                overflow: hidden;
                                padding-bottom: 3rem;
                                min-height:8rem;
                            }
                        }
                    }
                }
            }
        }

        #fixedDiv {
            
            position: fixed;
            margin-left: auto !important;
            margin-right: auto !important;
            z-index: 3;
        }
    }

    .imagespin {
        .innerbox();
        position: fixed;
        background: @imagespin-background;
        z-index: 1000;
        text-align: center;
        padding-top: calc(42vh);
        margin-left: auto;
        margin-right: auto;

        .notification-wrap {
            max-width: 75%;
            margin: auto;
            border: 1px solid @widget-border-color;
            border-radius: 0.8rem;
            top: -11rem;
            position: relative;
            background-color: @widget-background-color;
            min-height: 4.5rem;
            box-shadow: 0 0 5rem 2rem rgba(0,0,0,0.25);
            opacity: .9;

            .notification-text {
                font-size: 105%;
                min-height: 3rem;
                line-height: 3rem;
                margin: .5rem;
            }

            .notification-advance {
                height: 1.5rem;
            }

            .notification-bar {
                background-color: @notification-bar-background-color;
                transition: width 0.1s 0s linear;
                top: -1.6rem;
                position: relative;
                height: 1.5rem;
                margin: 1rem;
                border-top-right-radius: .25rem;
                border-bottom-right-radius: .25rem;
                max-width: ~"calc(100% - 2rem)";
            }
        }
    }
}

#lookupWindow {

    #lookupGrid {
        min-height: @lookupGrid-height;
        height: @lookupGrid-height;
        .k-grid-header {
            table{
                thead{
                    th{
                        .k-link{
                            text-transform:capitalize;
                        }
                    }
                }
            }
        }

        .k-grid-content {
            min-height: @lookupGrid-k-grid-content-height;



            .show-date-value {
                .show-date-value-mixming()
            }
        }

        .k-grid-pager {
            position: relative;
            top: -3px;
            padding-bottom: 2px;
            padding-top: 6px;
        }
    }

    #txtLookupFilter {
        width: 100%;
        margin-bottom: -20px;
    }

    #lookupFilterButton {
        float: right;
        position: relative;
        top: -15px;
        height: 2.12em;
    }

    .top {
        max-height: 30px;
    }

    .body {
        width: 100%;
        overflow: hidden;
        font-size: 80%;

        .imagespin {
            background: @imagespin-background;            
        }
    }
}
		
#widgetContainer {
		
	.innerbox(0px, 0px, 50px, 0px);
	z-index: 0;
}
	
#widgetContent { .innerbox(); }
	
#tempOutput {
	.innerbox();			
	height: 50px;
	top: 50px;
	bottom: auto;
	display: none;
}

#Output {
    .innerbox();
    z-index: 1;

    &.content-primary {
        font-size: @screenzoom;
    }

    &.hasstages {
        margin-top: 6.5rem;

        #ADWidgetsWrapper {
            margin-top: 0;
        }
    }

    &.hasstages.hasbreadcrumbs {
        margin-top: 80px;
    }

    > .pageParentDiv {
        .innerbox();

        > .dialogPageTable {
            .innerbox(0, 0, 0, 0);

            .pageCaption {
                .innerbox();

                &.fixed {
                    position: fixed;
                    z-index: 1000;
                    right: auto;
                    left: auto;
                    padding: 0;
                }

                height: 2.6rem;
                top: @ad-app-wrapper-border-size !important;
                bottom: auto;
                overflow: hidden;
                font-family: @font-family;
                color: @title-text-color;
                background-color: @widget-frame-color;
                color: #fff;
                padding: 5px 20px 0 20px;
                font-size: @pageCaption-font-size;
                font-weight: @pageCaption-font-weight;

                &.no-breadcrumb {
                    top: 0px;
                }

                &.hasBreadCrumbs {
                    display: none;
                }
            }
        }
    }
}

.non-hosted {

    #dialogTitle.hasTitle {
        position: fixed;
        z-index: 1000;
        background-color: @header-background-color !important;
        padding: 1rem;
        padding-bottom: 1rem;
        left: -1.5rem;
        top: -1.5rem;
        zoom: 99%;
    }

    #ADAppWrapper.hasTitle {
        #Output {
            margin-top: 6rem;

            .pageCaption {
                &.fixed {
                    top: 4rem !important;
                }
            }
        }
    }
}
	

 
/* Ajustes kendo */
.k-help {
		
	background-position: -160px -256px;		
}
	
.k-button {
	border-color: @button-border-color;
	> * {
			
		display: inline-block;
		vertical-align: middle;
	}
		
    .k-icon {
			
	    margin: 0 6px 3px 0;
        }
}
	
#lookupFilterButton.k-button .k-icon { margin: -5px 0 0 0; }
	
.k-numerictextbox {
		
	.k-icon { height: 16px; }
	.k-select { padding-top: 5px; }
    .k-formatted-value{
        border: 1px solid transparent;
        
    }
}

.k-picker-wrap {
    &.k-state-default{
        input{
            border: 1px solid transparent;
        }

    }

}

.k-picker-wrap,
.k-numeric-wrap,
.k-dropdown-wrap {
    .k-select {
        padding: 3px 5px;
    }
}
	
.k-input {
		
	padding: 0 7px;
}
	
.k-window-title {
		
	overflow: inherit;
	font-weight: bold;
	display: inline-block;
	padding: 0 10px;
}
.k-tooltip-validation .k-warning {
		
	vertical-align: middle;
	margin: -3px 1px 0 0;
}
	
.k-grid-header .k-link > .k-icon {
		
	vertical-align: middle;
	margin-left: 5px;
}

.k-grid-header {
    .k-header {
        font-weight: @xrmgrid-k-grid-header-font-weight;
        font-size: @xrmgrid-k-grid-header-font-size;
        .k-link {
            padding: @xrmgrid-k-grid-header-link-padding;
        }
    }
}
	
.k-textbox, 
.k-autocomplete, 
.k-dropdown-wrap, 
.k-picker-wrap, 
.k-numeric-wrap {
		
	padding: 2px 32px 2px 2px;
}
    
div.k-animation-container {
    .k-list-container {
        ul li.k-item {
            min-height:1.8em;
            line-height: 1.8em;
        }
    }
}

.k-grid {
    .k-grid-header {
        &.section508 {
            th:first-child {
                *:first-child {
                    max-width: 35px;
                    display: none;
                }
            }
        }
    }

    .k-grid-content {      
        td:first-child 
        {
            max-width: 35px;
            text-overflow: clip;
            input {
                margin-right: 20px;
            }

            span.section508 {
                display: none;
            }
        }        
    }
}

.k-button-disabled
{
    opacity: 0.35;
}
.k-button {
    &.non-visible{
        visibility:hidden;
        display:none !important;
    }
}

.k-ct-popup {
    width: 180.39999999999998px;
    padding: 0.65em 0.5em 0.5em;
}

.k-ct-cell {
    border-width: 1px;
    border-style: solid;
    width: 18px;
    height: 18px;
    margin: 1px;
    vertical-align: top;
    display: inline-block;
    overflow: hidden;
    -ms-high-contrast-adjust: none;
}

.k-colorpalette {
    position: relative;
    line-height: 0;
    border-width: 0;
    display: inline-block;

    .k-palette {
        border-collapse: collapse;
        position: relative;
        width: 100%;
        height: 100%
    }

    .k-item {
        width: 14px;
        height: 14px;
        overflow: hidden;
        -ms-high-contrast-adjust: none
    }

    .k-item.k-state-selected {
        z-index: 100;
        background: transparent;
        box-shadow: 0 1px 4px #000,inset 0 0 3px #fff;
        position: relative
    }
}

.k-colorpicker {
    position: relative;
    display: inline-block;
    width: 12.4em;
    overflow: visible;
    border-width: 0;
    vertical-align: middle;
    white-space: nowrap;
    width: auto;

    .k-selected-color {
        vertical-align: top;
        line-height: 0;
        display: inline-block;
        height: 2em;
        width: 2em
    }

    .k-tool-icon {
        width: 14px;
        height: 14px;
        top: -4px;
        position: relative;
        padding: 3px 3px 2px;
        margin-right: 3px;
        margin-left: 2px;
        margin-bottom: 3px;
        vertical-align: middle;

        .k-selected-color {
            display: block;
            height: 3px;
            width: 16px;
            position: absolute;
            left: 3px;
            bottom: -3px;
            border-radius: 0 !important
        }
    }

    .k-icon {
        cursor: pointer
    }
}

.k-editor-dialog {
    padding: 1em;
    width: 400px;

    .k-editor-textarea {
        font-size: inherit;
        font-family: consolas,"courier new",monospace
    }

    .k-edit-label {
        width: 25%
    }

    .k-edit-field {
        width: 66%;

        .k-textbox {
            width: 96%
        }

        .k-checkbox {
            margin: 0 .4em 0 0
        }
    }

    .k-button {
        display: inline-block
    }

    .k-editor-textarea {
        width: 600px;
        height: 350px;
        padding: .2em .2em .2em .4em;
        border-width: 1px;
        border-style: solid;
        overflow: auto
    }
}

.k-viewhtml-dialog {
    width: auto
}

.k-filebrowser-dialog {
    width: auto;
    min-width: 350px;

    .k-filebrowser {
        margin: 0 1em 0
    }

    .k-edit-label {
        width: 18%
    }

    .k-edit-field {
        width: 75%;

        .k-textbox {
            width: 70%
        }
    }
}

.k-editor-dialog,
.k-viewhtml-dialog,
.k-filebrowser-dialog,
#toolsWindow {
    .k-edit-buttons {
        float: right;
        margin-left: ~"calc(100% - 10rem)";
        button{
            margin:4px;
        }
    }
}

	
/* Kendo custom icons */

.widget-help-image { background-position: -160px -272px; }	
.widget-help-click-image { background-position: -160px -288px; }

.k-noteswindow-ok {	background-position: -160px -96px; }	
.k-button:hover .k-noteswindow-ok {	background-position: -176px -96px; }

.k-ad-history { background-position: -160px -304px; }
.k-button:hover .k-ad-history {	background-position: -176px -304px; }

.k-view-process { background-position: -160px -320px; }
.k-button:hover .k-view-process { background-position: -176px -320px; }

.k-review, .k-feedbackwindow-ok { background-position: -160px -80px; }
.k-button:hover {
    .k-review, .k-feedbackwindow-ok {
        background-position: -176px -80px;
    }
}


.k-lookup-ok { background-position: -32px -32px; }
.k-lookup-filter { background-position: -32px -240px; }
.k-button:hover .k-lookup-ok, .k-button:hover .k-lookup-filter { background-position: -48px -240px;}

.k-lookup-cancel, .k-feedbackwindow-cancel, .k-messagewindow-cancel { background-position: -32px -16px; }
.k-button:hover {
        .k-lookup-cancel, 
        .k-feedbackwindow-cancel,
        .k-messagewindow-cancel {
            background-position: -48px -16px;
        }
    }

.k-button {
        .k-reassing {
        background-position: -160px -128px;   
        }
        &:hover {
            .k-reassing {
               background-position: -178px -128px;
                
            }
                   
     }     
        
    }


.k-editor .k-i-custom {
    background-position: -111px -109px
}

.k-i-move {
    background-position: -160px -288px
}

.k-bold {
    background-position: -240px 0
}

.k-state-hover .k-bold, .k-state-selected .k-bold {
    background-position: -264px 0
}

.k-italic {
    background-position: -240px -24px
}

.k-state-hover .k-italic, .k-state-selected .k-italic {
    background-position: -264px -24px
}

.k-underline {
    background-position: -240px -48px
}

.k-state-hover .k-underline, .k-state-selected .k-underline {
    background-position: -264px -48px
}

.k-strikethrough {
    background-position: -240px -72px
}

.k-state-hover .k-strikethrough, .k-state-selected .k-strikethrough {
    background-position: -264px -72px
}

.k-foreColor {
    background-position: -240px -96px
}

.k-state-hover .k-foreColor, .k-state-selected .k-foreColor {
    background-position: -264px -96px
}

.k-backColor {
    background-position: -240px -120px
}

.k-state-hover .k-backColor, .k-state-selected .k-backColor {
    background-position: -264px -120px
}

.k-colorpicker .k-foreColor {
    background-position: -240px -96px
}

.k-colorpicker .k-backColor {
    background-position: -240px -120px
}

.k-justifyLeft {
    background-position: -240px -144px
}

.k-state-hover .k-justifyLeft, .k-state-selected .k-justifyLeft {
    background-position: -264px -144px
}

.k-justifyCenter {
    background-position: -240px -168px
}

.k-state-hover .k-justifyCenter, .k-state-selected .k-justifyCenter {
    background-position: -264px -168px
}

.k-justifyRight {
    background-position: -240px -192px
}

.k-state-hover .k-justifyRight, .k-state-selected .k-justifyRight {
    background-position: -264px -192px
}

.k-justifyFull {
    background-position: -240px -216px
}

.k-state-hover .k-justifyFull, .k-state-selected .k-justifyFull {
    background-position: -264px -216px
}

.k-insertUnorderedList {
    background-position: -240px -264px
}

.k-state-hover .k-insertUnorderedList, .k-state-selected .k-insertUnorderedList {
    background-position: -264px -264px
}

.k-insertOrderedList {
    background-position: -240px -288px
}

.k-state-hover .k-insertOrderedList, .k-state-selected .k-insertOrderedList {
    background-position: -264px -288px
}

.k-indent, .k-rtl .k-outdent {
    background-position: -288px 0
}

.k-state-hover .k-indent, .k-state-hover .k-rtl .k-outdent, .k-state-selected .k-indent, .k-state-selected .k-rtl .k-outdent {
    background-position: -312px 0
}

.k-outdent, .k-rtl .k-indent {
    background-position: -288px -24px
}

.k-state-hover .k-outdent, .k-state-hover .k-rtl .k-indent, .k-state-selected .k-outdent, .k-state-selected .k-rtl .k-indent {
    background-position: -312px -24px
}

.k-createLink {
    background-position: -288px -48px
}

.k-state-hover .k-createLink, .k-state-selected .k-createLink {
    background-position: -312px -48px
}

.k-unlink {
    background-position: -288px -72px
}

.k-state-hover .k-unlink, .k-state-selected .k-unlink {
    background-position: -312px -72px
}

.k-insertImage {
    background-position: -288px -96px
}

.k-state-hover .k-insertImage, 
.k-state-selected .k-insertImage {
    background-position: -312px -96px
}


.k-insertFile {
    background-position: -288px -216px
}

.k-state-hover .k-insertFile, 
.k-state-selected .k-insertFile {
    background-position: -312px -216px
}

.k-subscript {
    background-position: -288px -144px
}

.k-state-hover .k-subscript, 
.k-state-selected .k-subscript {
    background-position: -312px -144px
}

.k-superscript {
    background-position: -288px -168px
}

.k-state-hover .k-superscript, 
.k-state-selected .k-superscript {
    background-position: -312px -168px
}

.k-cleanFormatting {
    background-position: -288px -192px
}

.k-state-hover .k-cleanFormatting, 
.k-state-selected .k-cleanFormatting {
    background-position: -312px -192px
}

.k-createTable {
    background-position: -192px 0
}

.k-state-hover .k-createTable,
.k-state-selected .k-createTable {
    background-position: -216px 0
}

.k-addColumnLeft {
    background-position: -192px -24px
}

.k-state-hover .k-addColumnLeft,
.k-state-selected .k-addColumnLeft {
    background-position: -216px -24px
}

.k-addColumnRight {
    background-position: -192px -48px
}

.k-state-hover .k-addColumnRight,
.k-state-selected .k-addColumnRight {
    background-position: -216px -48px
}

.k-addRowAbove {
    background-position: -192px -72px
}

.k-state-hover .k-addRowAbove,
.k-state-selected .k-addRowAbove {
    background-position: -216px -72px
}

.k-addRowBelow {
    background-position: -192px -96px
}

.k-state-hover .k-addRowBelow,
.k-state-selected .k-addRowBelow {
    background-position: -216px -96px
}

.k-deleteRow {
    background-position: -192px -120px
}

.k-state-hover .k-deleteRow,
.k-state-selected .k-deleteRow {
    background-position: -216px -120px
}

.k-deleteColumn {
    background-position: -192px -144px
}

.k-state-hover .k-deleteColumn,
.k-state-selected .k-deleteColumn {
    background-position: -216px -144px
}

.k-mergeCells {
    background-position: -192px -168px
}

.k-state-hover .k-mergeCells,
.k-state-selected .k-mergeCells {
    background-position: -216px -168px
}

.k-viewHtml {
    background-position: -288px -120px;
}

.k-upload-status {
    .k-icon {
        &.k-delete {
            background-position: -117px -156px;
            height: 1rem;
            width: 1rem;
            opacity: 0.6;

            &:hover {
                opacity: 1;
            }
        }
    }
}
	
	#Stages {
		
		.innerbox();			
		height: 50px;
		bottom: auto;		
		margin: 0;
		padding: 0;
		border: solid @widget-border-color;
		background-color: @widget-background-color;
		border-width: 0 0 1px 0;
		overflow: hidden;
		
		border-top-left-radius: @main-border-radius;
		border-top-right-radius: @main-border-radius;

		display: none;
		
		&.hascontent {
		
			display: block;
            width: auto !important;       
		}
		
		.toleft,
		.toright {
		
			position: absolute;
			top: 8px;
			width: 32px;
			height: 32px;
			padding: 0;
			border: 1px solid @widget-border-color;
			background-color: @widget-background-color;
			color: @widget-border-color;
			z-index: 10;
			font-size: 1.5em;
			line-height: 1em;
			text-align: center;
			cursor: pointer;
			display: none;
			
			span { margin: 0; }
		}
		
		
		.toleft {
			
			left: 8px;
			content: "<";
		}		
		
		.toright {
			
			right: 8px;			
			content: ">";
		}
		
		&.overflowleft .toleft { display: block; }
		
		&.overflowright .toright { display: block; }
	}

#breadCrumbsContainer {
	position: absolute;
	margin: 0;
	padding: 0;
	white-space: nowrap;

	li {
		display: inline-block;
		padding: 13px 30px 0 15px;
		position: relative;
		height: 37px;
		background-color: @background-color;
		counter-increment: IndexOrder;

		&:before {
			content: counter(IndexOrder);
			padding: 0 7px 2px;
			margin-right: 10px;
			border: 1px solid @widget-border-color;
			border-radius: 50%;
		}

		.stageseparator {
			position: absolute;
			top: 0;
			right: 0;
			display: block;
			border: 25px solid transparent;
			border-right: 0;
			border-left: 14px solid @widget-border-color;

			&:before {
				position: absolute;
				top: -25px;
				right: 1px;
				display: block;
				border: 25px solid transparent;
				border-right: 0;
				border-left: 14px solid @widget-background-color;
				content: "";
			}
		}

		&.past {
			font-weight: inherit;
			color: @text-outstanding;
		}

		&.current {
			font-weight: bold;
			color: @text-outstanding;
		}

		&.future {
			font-weight: inherit;
			color: @disabled-text-color;
		}
	}
}


#BreadCrumbsSteps {
	height: 20px;
	font-size: 90%;
	padding: 5px 20px 9px 20px;
	z-index: 2;
	white-space: nowrap;
	vertical-align: top;
	line-height: 1.8em;
	display: inline-block;

	span {
		display: inline-block;
		padding: 0 10px 0 0;

		a {
			color: @link-text-color;
		}

		&:after {
			content: ">";
			font-size: 90%;
			padding: 0 0 0 10px;
			color: @widget-border-color;
		}

		&:last-child {
			font-size: 1.3rem;
			color: @selected-background-color;

			&:after {
				content: normal;
				padding: 0;
			}
		}

		&.stage {
			a {
				opacity: 1;
				font-weight: bold;
			}
		}
	}
}

#BreadCrumbs {
    .innerbox();
    width: auto ;
    height: auto;
    bottom: auto;
    z-index: 2;
    background-color: @background-color;
    border: solid @widget-border-color;
    border-width: 0 0 1px 0;
    white-space: nowrap;
    min-height: 2.5rem;
    padding-bottom: 0.5rem;

    a.showmore,
    a.showless,
    .ellipsis {
        padding: 0;
        width: 32px;
        height: 32px;
        margin: 1px;
        vertical-align: top;
        text-align: center;
        display: none;

        .k-icon {
            margin: 0;
        }
    }



    &.overflow {

        a.showmore {
            display: inline-block;
        }

        a.showless {
            display: none;
        }

        .ellipsis {
            display: inline-block;
        }

        #BreadCrumbsSteps {
            padding: 4px 0;
        }
    }

    &.open {

        a.showmore {
            display: none;
        }

        a.showless {
            display: inline-block;
        }

        .ellipsis {
            display: none;
        }

        #BreadCrumbsSteps {
            height: auto;
            white-space: normal;
            padding: 4px 20px 4px 4px;
        }
    }

    &.hasstages {
        top: 3.5rem !important;
        width: initial !important;
        border: none;
    }

    .no-stages{
        top:0;
    }

    margin-left: auto !important;
    margin-right: auto !important;
}


#BreadCrumbs {    
    position: fixed;    
}

.non-hosted {

    #BreadCrumbs {
        &.hasTitle {
            top: 2.7rem !important;
        }

        &.fixed {
            position: fixed;
        }
    }
}
@WidgetColumn: 4.14%;
@WidgetSep: 4.15%;
@min-width: 50px;
@adjust: 0.8;
@datetime-widget-width: 13rem;

@relative-width-infowidget: 6%;
@loading-loading-mask-color: rgba(180, 185, 185, 0.30);

/* Mixings */
.ellipsis-mx() {
    .questionCaption, .questionCaption > * {
        white-space: normal;
        overflow: visible;
    }
}

.k-tooltip-validation-mx() {

    .k-tooltip-validation {
        top: 2rem;
        left: auto;
        right: auto;
    }

    &.ComboControlContainer {
        .k-tooltip-validation {
            right: auto;
        }
    }

    &.YesNoControlCaption,
    &.RadioControlCaption,
    &.CheckControlCaption {
        .k-tooltip-validation {
            right: 0;

            &::after {
                right: 0.4rem;
                left: auto;
            }
        }

        .Vertical {
            .k-tooltip-validation {
                top: 3.5rem !important;
            }
        }

        .Horizontal {
            .k-tooltip-validation {
                top: 1.7rem !important;
                left: 0 !important;
            }
        }
    }

    &.RadioControlContainer, 
    &.CheckControlContainer,
    &.YesNoControlContainer {
        &.Vertical {
            .k-tooltip-validation {
            }
        }

        &.Horizontal {
            .k-tooltip-validation {
                right: auto;
                left: 0;
                &:after {
                    right: initial;
                    left: 1rem;
                }
            }
        }
    }

    .watermark {
        left: auto;
        margin-left: 0.8rem;
    }
}

.widget-caption-width-mx(@span) {
    max-width: calc(@span ~" - .1rem");
    width: calc(@span ~" - .1rem");
    .ellipsis-mx();
}

.caption-container-mx() {
    width: auto;
    display: inline-block;
    margin-right: .5em !important;

    .tooltiptext {
        left: ~"calc(100% + 1rem)";
        right: auto;
        width: auto;
        white-space: pre;
    }
}

.CrmLookupControlContainer-lookup(@width) {


    &.CrmLookupControlContainer {
        display: inline-flex;

        .k-lookup-button {
            position: relative;
            left: -25px;
            top: 4px;
            cursor: pointer;
        }
    }
}

.AgileDialogsWidgetControlContent2(@width, @index) when (@index < 12) {
    @expression: ~"(100% / 12) * @{index} - 7px";
    width: @width;
    width: calc(@expression);

    + .k-tooltip-validation {
        position: absolute !important;
    }
}

.AgileDialogsWidgetControlContent2(@width, @index) when (@width = 100%) {
    width: @width;
}

.AgileDialogsWidgetControlContent(@width, @index) {
    > input[type="text"],
    > input[type="password"],
    > textarea,
    > .k-widget.k-dropdown,
    > .k-widget.k-numerictextbox,
    > .k-widget.k-autocomplete {
        .AgileDialogsWidgetControlContent2(@width, @index);
    }

    .CrmLookupControlContainer-lookup(@width);
}

.agileDialogs-WidgetControlContent-mx() {

    &.span1 {
        .AgileDialogsWidgetControlContent(8.3%, 1);
    }

    &.span2 {
        .AgileDialogsWidgetControlContent(16.6%, 2);
    }

    &.span3 {
        .AgileDialogsWidgetControlContent(24.9%, 3);
    }

    &.span4 {
        .AgileDialogsWidgetControlContent(33.2%, 4);
    }

    &.span5 {
        .AgileDialogsWidgetControlContent(41.5%, 5);
    }

    &.span6 {
        .AgileDialogsWidgetControlContent(49.8%, 6);
    }

    &.span7 {
        .AgileDialogsWidgetControlContent(58.1%, 7);
    }

    &.span8 {
        .AgileDialogsWidgetControlContent(66.4%, 8);
    }

    &.span9 {
        .AgileDialogsWidgetControlContent(74.7%, 9);
    }

    &.span10 {
        .AgileDialogsWidgetControlContent(83.0%, 10);
    }

    &.span11 {
        .AgileDialogsWidgetControlContent(91.3%, 11);
    }

    &.span12 {
        .AgileDialogsWidgetControlContent(100%,12);
    }
}
/* End Mixings */

#ADWidgetsWrapper {
    .innerbox(2.9rem, 0.5rem, 0.5rem, 0.5rem);
    overflow: auto;
    overflow-x: hidden;

    .AgileDialogsWidget {
        display: inline-block;
        margin: 0 0 20px 0px;
        position: relative;
        vertical-align: top;
        padding-right: 5px;
        font-size: @widget-font-size;

        &.span1 {
            width: 7.70%; // 8.3%
            width: calc(~"(100% / 12) * 1 - (1 * @{box-model-adjust} )");
            .widget-container-width-mx(1);

            &.moz {
                width: calc(~"(100% / 12) * 1 " - @box-model-adjust-moz);
            }

            &.min-datetime {
                min-width: @datetime-widget-width/2;
            }
        }

        &.span2 {
            width: 16.60% - @adjust; // 16.6%
            // width: calc(~"(100% / 12) * 2 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 2 - (2 * @{box-model-adjust} ) + 9px");
            .widget-container-width-mx (2);

            &.moz {
                width: calc(~"(100% / 12) * 2 " - @box-model-adjust-moz);
            }
        }

        &.span3 {
            width: 24.90% - @adjust; // 24.9%
            // width: calc(~"(100% / 12) * 3 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 3 - (3 * @{box-model-adjust} ) + 18px");
            .widget-container-width-mx (3);

            &.moz {
                width: calc(~"(100% / 12) * 3 " - @box-model-adjust-moz);
            }
        }

        &.span4 {
            width: 33.20% - @adjust; // 33.2%
            // width: calc(~"(100% / 12) * 4 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 4 - (4 * @{box-model-adjust} ) + 25px");
            .widget-container-width-mx (4);

            &.moz {
                width: calc(~"(100% / 12) * 4 " - @box-model-adjust-moz);
            }
        }

        &.span5 {
            width: 41.50% - @adjust; // 41.5%
            // width: calc(~"(100% / 12) * 5 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 5 - (5 * @{box-model-adjust} ) + 34px");
            .widget-container-width-mx (5);

            &.moz {
                width: calc(~"(100% / 12) * 5 " - @box-model-adjust-moz);
            }
        }

        &.span6 {
            width: 49.80% - @adjust; // 49.8%
            // width: calc(~"(100% / 12) * 6 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 6 - (6 * @{box-model-adjust} ) + 44px");
            .widget-container-width-mx (6);

            &.moz {
                width: calc(~"(100% / 12) * 6 " - @box-model-adjust-moz);
            }
        }

        &.span7 {
            width: 58.10% - @adjust; // 58.1%
            // width: calc(~"(100% / 12) * 7 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 7 - (7 * @{box-model-adjust} ) + 52px");
            .widget-container-width-mx (7);

            &.moz {
                width: calc(~"(100% / 12) * 7 " - @box-model-adjust-moz);
            }
        }

        &.span8 {
            width: 66.40% - @adjust; // 66.4%
            // width: calc(~"(100% / 12) * 8 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 8 - (8 * @{box-model-adjust} ) + 60px");
            .widget-container-width-mx (8);

            &.moz {
                width: calc(~"(100% / 12) * 8 " - @box-model-adjust-moz);
            }
        }

        &.span9 {
            width: 74.70% - @adjust; // 74.7%
            // width: calc(~"(100% / 12) * 9 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 9 - (8 * @{box-model-adjust} ) + 60px");
            .widget-container-width-mx (9);

            &.moz {
                width: calc(~"(100% / 12) * 9 " - @box-model-adjust-moz);
            }
        }

        &.span10 {
            // width: calc(~"(100% / 12) * 10 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 10 - (1 * @{box-model-adjust} ) - 5px");
            .widget-container-width-mx (10);

            &.moz {
                width: calc(~"(100% / 12) * 10 " - @box-model-adjust-moz);
            }
        }

        &.span11 {
            width: 83.00% - @adjust; // 83%
            // width: calc(~"(100% / 12) * 11 " - @box-model-adjust);
            width: calc(~"(100% / 12) * 11 - (1 * @{box-model-adjust} ) - 3px");
            .widget-container-width-mx (11);

            &.moz {
                width: calc(~"(100% / 12) * 11 " - @box-model-adjust-moz);
            }
        }

        &.span12 {
            width: 99.50% - @adjust;
            width: calc(~"(100% / 12) * 12 " - @box-model-adjust);
            .widget-container-width-mx (12);

            &.moz {
                width: calc(~"(100% / 12) * 12 " - @box-model-adjust-moz);
            }
        }

        .inner-widget-mx();

        .AgileDialogsWidgetCaptionContainer {
            margin: 0;
            position: relative;
            z-index: 1;
            display: inline-block;
            width: 100%;
            min-height: 1.2rem;

            &.InfoControlCaption {
                .questionCaption {
                    width: 100%;
                    overflow-wrap: break-word;
                }
            }

            .questionCaption-mx();

            div[rel=tooltip] {
                position: absolute;
                bottom: 0;
                right: 0;
                width: 32px;
                height: 32px;
                background: @tooltip-background-color;
                border-radius: 50%;
                border: 1px solid @tooltip-border-color;
                text-align: center;
                display: none;

                > * {
                    display: inline-block;
                }

                > div {
                    margin: 8px 0 0 0;
                }

                > a {
                    margin: 6px 0 0 0;
                }

                &.multi {
                    vertical-align: top;
                    position: relative;
                    margin-left: 0.25rem;

                    &.top {
                        top: 0;
                        position: absolute;
                    }
                }
            }

            .tooltiptext {
                padding: 0px 10px 3px 8px;
                position: absolute;
                bottom: 100%;
                padding-left: 0;
                margin: 5px 0 0 0;
                background-color: @tooltip-background-color;
                border: 1px solid @tooltip-border-color;
                display: none;
                .boxshadow();

                &:before {
                    color: @tooltip-border-color;
                    content: "▼";
                    position: relative;
                    top: 22px;
                    font-size: 1.5em;
                }
            }

            span[rel=tooltip] {
                position: absolute;
                top: -20px;
                right: 0;

                > a,
                > .widget-help-image {
                    float: right;
                    cursor: pointer;
                }

                .notesContent {
                    display: none;
                }
            }

            .k-tooltip-validation {
                width: 95%;
                .k-tooltip-validation()
            }
        }

        .AgileDialogsWidgetControlContainer {
            position: relative;

            .k-dropdown-wrap {
                &.k-state-disabled {
                    opacity: initial;
                }
            }

            input:disabled,
            > textarea:disabled,
            > select:disabled,
            .k-state-disabled > input,
            .k-state-disabled .k-input {
                opacity: @input-disabled-opacity;
                color: @disabled-text-color;
            }

            min-width: @min-width;
            .agileDialogs-WidgetControlContent-mx();

            .k-widget {
                &.k-invalid-msg {
                    display: inline-table;
                    left: 0px;
                    word-break: break-word;
                    white-space: normal;
                }

                &.k-grid {
                    .k-pager-wrap {
                        padding-bottom: 2px;
                        padding-top: 4px;
                        position: relative;
                    }

                    .k-grid-content {
                        td {
                            white-space: nowrap;
                        }
                    }
                }
            }

            > .k-widget:not(.k-invalid-msg) {
                width: 100%;

                .k-upload-button {
                    min-width: 120px;
                    max-width: 120px;
                    position: static;

                    input {
                        max-width: 120px;
                        max-height: 27px;
                    }

                    input[type="file"] {
                        max-width: 8rem;
                        max-height: 2rem;
                        position: absolute;
                        left: 0;
                    }

                    input[type="file"]::-webkit-file-upload-button {
                        max-width: 8rem;
                        max-height: 2rem;
                    }

                    > span.k-invalid-msg {
                        display: inline-table;
                    }

                    input:not([type='file']) {
                        font-size: 1px !important;
                    }
                }
            }

            > input[type=text],
            > input[type=password],
            > textarea {
                width: 100%;
                max-width: 100%;
                padding: 2px;
            }


            &.CalendarControlContainer {
                .k-widget {
                    &.k-datepicker,
                    &.k-datetimepicker,
                    &.k-timepicker {
                        width: 100%;

                        .k-picker-wrap.k-state-default {
                            border-color: @widget-border-color;
                            background-color: @select-background-color;
                            padding-right: 45px;
                        }
                    }

                    &.k-datepicker,
                    &.k-datetimepicker {
                        min-width: @datetime-widget-width;
                        // max-width: @datetime-widget-width;
                        
                        input{                            
                            padding-left:.5rem;
                        }
                    }

                    &.k-timepicker {
                        width: 44%;
                        float: right;
                    }

                    input.invalid-date {
                        color: @validation-text-color;
                    }
                }

                .k-picker-wrap .k-select, .k-numeric-wrap .k-select, .k-dropdown-wrap .k-select {
                    padding: 4px;
                }

                .k-state-hover, .k-button:hover, .k-textbox:hover, .k-button:active {
                    .k-i-calendar {
                        background-position: -32px -176px;
                    }

                    .k-i-clock {
                        background-position: -32px -192px;
                    }
                }
            }

            &.CurrencyControlContainer {
                .k-widget {
                    .k-numeric-wrap {
                        min-width: 1em;
                    }
                }
            }

            &.FileControlContainer {
                .k-file {
                    &.k-file-success {
                        > .k-icon {
                            background-position: -112px -302px;
                        }
                    }
                }

                .k-upload {
                    ul.k-upload-files {
                        display: inline-block;
                        width: calc(~"100% - 1.5em");


                        li {
                            .k-filename {
                                max-width: calc(~"100% - 6em");
                            }
                        }
                    }

                    .k-dropzone {
                        .k-upload-status {
                            float: inherit;
                            display: block;
                            text-align: right;
                        }
                    }

                    .k-upload-status {
                        .k-button {
                            float: right;
                            height: 1.2em;
                            width: 1.2em;
                            margin-top: 0.5em;
                            left: -1em;
                        }
                    }

                    .k-upload-status-total {
                        float: right;
                    }

                    .k-upload-pct {
                        float: right;
                    }
                }
            }

            &.ComboControlContainer {
                height: 28px;
            }

            &.WidgetControlContainer {
                .k-tooltip-validation {
                    margin: 1rem;

                    &.unconfigured {
                        top: -1rem;
                    }
                }
            }

            .optionsContainer {
                padding: 0px 10px 3px 5px;
                margin: 0px 0 0 0;

                &:not(.Vertical) {
                    width: 100%;
                }

                div {
                    margin: 0 0 5px 20px;
                    white-space: nowrap;

                    input[type=checkbox],
                    input[type=radio] {
                        margin-left: -17px;
                    }
                }

                &.Horizontal div {
                    display: inline-block;
                }

                div.radio-button-options-container {
                    margin: 5px;
                    display: inline-block;
                }

                fieldset {
                    border: none;
                }

                label {
                    position: absolute;
                    padding-left: 1rem;
                    left: -1rem;
                    top:0;
                }

                &.buttonset {
                    position: relative;

                    .k-button-history-selected {
                    }

                    .k-button-history-disabled {
                        background-color: @disabled-text-color !important;
                        opacity: .2;
                    }

                    &.Vertical {
                        div {
                            margin: 0.8rem !important;

                            &.radio-button-options-container {
                                display: block !important;
                                padding: 0.1rem;
                            }
                        }
                    }

                    &.Horizontal {
                        position: relative !important;

                        fieldset {
                            div.radio-button-options-container {
                                display: inline-block;
                            }
                        }
                    }
                }

                .k-tooltip-validation {
                    top: 85% !important;
                }
            }

            .k-tooltip-validation {
                .k-tooltip-validation()
            }

            .k-dropdown select.k-dropdown {
                display: none;
            }

            .k-dropzone {
                padding: 0;
            }

            .tabs-container {
                .tab-item {
                    padding: 1rem;
                }

                .k-tabstrip-items li.k-item {
                    &.has-required-inputs a:before {
                        color: @validation-border-color;
                        content: "■";
                        padding: 0 8px 0 0;
                    }

                    &.no-required-inputs a:before {
                        opacity: 0.1;
                        content: "■";
                        padding: 0 8px 0 0;
                    }
                }
            }

            span.watermark {
                .watermark();
            }

            .k-content {
                .grid-right-align-data {
                    text-align: right;
                }
            }

            &.Vertical {
                display: contents !important;
            }
        }

        &.disabledControl {
            .questionCaption {

                &.required {

                    &:before {
                        color: @widget-text-color;
                        opacity: 0.2;
                    }

                    &:not(.multi):after {
                        content: "" !important;
                    }

                    &.multi {
                        .req:after {                            
                            content: "" !important;                            
                        }
                    }
                }
            }

            span.k-invalid-msg {
                visibility: hidden;
            }

            iframe {
                opacity: 0.7;
            }

            .k-picker-wrap,
            .k-dropdown-wrap,
            .k-numeric-wrap {
                &.k-state-disabled {
                    background-color: initial;
                }
            }

            .k-state-disabled:not(.k-dropdown-wrap) {
                opacity: initial;
            }
        }

        &.XRMGrid {
            min-width: @xrmgrid-min-width;

            .k-invalid-msg {
                left: 0;
                top: 20px;
            }

            .CrmGridControlContainer {

                .k-content {
                    border: none;

                    .k-grid {

                        table {
                            border-spacing: @xrmgrid-border-spacing;

                            thead {
                                th {
                                    .k-link {
                                        text-transform: capitalize;
                                    }
                                }
                            }

                            tr {

                                td {
                                    border-style: @xrmgrid-td-border-style;
                                    line-height: @xrmgrid-td-line-height;
                                    font-size: @xrmgrid-td-font-size;



                                    .show-date-value {
                                        .show-date-value-mixming()
                                    }
                                }

                                &.k-state-selected:hover {
                                    background-color: @select-hover-background-color;
                                }

                                &:hover {
                                    background-color: @hover-background-color;
                                }
                            }
                        }
                    }
                }

                .selected-data-filter {
                    border-radius: 0.5em;
                }

                .k-pager-wrap {
                    min-height: 26px;
                    max-height: 26px;
                    overflow: initial;

                    .k-pager-info {
                        padding: initial;
                        font-size: 75%;
                    }
                }

                .k-loading-mask {
                    background-color: @loading-loading-mask-color;
                }
            }

            &.hidden-data {

                .k-grid-content {
                    &:before {
                        padding-top: 2em;
                        content: "-- Hidden data --";
                        display: block;
                        width: 100%;
                        text-align: center;
                        font-size: 3em;
                    }
                }
            }
        }

        &.iframe-widget {
            border: none;
        }

        &.hascontent {
            .AgileDialogsWidgetCaptionContainer {
                margin: 0 0 5px 0;
            }
        }

        &.hastooltip {

            .AgileDialogsWidgetCaptionContainer {

                .questionCaption {
                    margin-right: 32px;
                }

                div[rel=tooltip] {
                    display: block;
                    .opacity(100);
                }
            }

            .AgileDialogsWidgetControlContainer {
            }
        }

        &.infocus {

            .AgileDialogsWidgetCaptionContainer {

                .tooltiptext {
                    display: inline-table;
                    background-color: #ffffff;
                }
            }


            .input,
            .textarea,
            .k-textbox,
            .k-upload-button,
            .k-grid {
                border: 1px solid @active-border-color !important;
            }

            .tooltiptext:after {
                right: 120px;
                opacity: 0.5;
            }
        }

        &.focus-item {
            .AgileDialogsWidgetCaptionContainer {
                div[rel=tooltip] {
                    .opacity(100);
                }
            }

            .highlight-behavior(@focused-border-color);
        }

        &.min-datetime {
            min-width: @datetime-widget-width;
        }

        &.ContainerWidget {
            padding-left: 4px;
            padding-right: 4px;


            .AgileDialogsWidgetCaptionContainer {
                min-height: 0px;
            }

            &.lastrowWidget {
                padding-right: 2px;
            }

            &.none {
            }

            &.fieldset {
                padding: 0px 0px 0px 0px;

                fieldset legend .questionCaption {
                    min-width: 100%;
                }
            }

            &.panel, &.box {
                padding: 10px 0px 0px 3px;
                border: 3px solid @group-border-color;
                margin-right: 1px;

                &.span12 {
                    width: 97%;
                }
            }

            &.box {
                .AgileDialogsWidgetCaptionContainer.GroupContainerControlCaption:first-child {
                    display: none;
                }
            }
        }

        &[data-controltype='ComboControl'],
        &[data-controltype='TextControl'],
        &[data-controltype='CalendarControl'],
        &[data-controltype='CurrencyControl'] {
            vertical-align: inherit;
        }

        .CrmLookupControlContainer {

            .k-widget.k-autocomplete.lookup {
                padding-right: 52px;
            }

            .lookup {
                min-width: 100%;
            }

            .lookup.k-input {
                padding-left: 20px;
            }

            .lookup-spin {
                position: absolute;
                top: 35%;
                left: 16px;
            }
        }

        .RadioControlContainer,
        .CheckControlContainer,
        .YesNoControlContainer {
            fieldset {
                div {
                    label {
                        cursor: pointer;
                        white-space: normal;
                        position: relative !important;
                    }
                }
            }
        }

        .RichTextEdiorControlContainer {
            .overlay {
                position: absolute;
                background-color: #d7cfcf;
                opacity: 0.1;
                width: 100% !important;
            }

            .content {
                &.lines-1 {
                    .k-editable-area {
                        height: 100px;
                    }
                }

                &.lines-2 {
                    .k-editable-area {
                        height: 175px;
                    }
                }

                &.lines-3 {
                    .k-editable-area {
                        height: 250px;
                    }
                }

                &.lines-4 {
                    .k-editable-area {
                        height: 400px;
                    }
                }

                &.lines-5 {
                    .k-editable-area {
                        height: 550px;
                    }
                }

                &.disable {
                    opacity: 0.5;
                }
            }

            .k-invalid-msg {
                top: 95%;
                position: absolute;
                width: ~"calc(100% - 1rem)";
            }

            table.k-editor {
                width: 100%;
                table-layout: fixed;
                border-style: solid;
                border-width: 1px;
                border-collapse: separate;
                border-spacing: 4px;
                font-size: 100%;
                vertical-align: top;
                position: relative;
                display: table;
                height: auto;

                .k-tool {
                    outline: 0;
                    border-color: #c5c5c5;

                    &:focus {
                        outline: 0;
                        border-color: #c5c5c5;
                        -webkit-box-shadow: inset 0 0 5px 1px #bcb4b0;
                        box-shadow: inset 0 0 5px 1px #bcb4b0
                    }
                }

                tr {
                    td {
                        &.k-editor-toolbar-wrap {
                            border: 0;
                            padding: 0;
                            // position: absolute;
                        }
                    }
                }

                .k-content {
                    display: block;
                    width: 100%;
                    height: 100%;
                    border: 0;
                    margin: 0;
                    padding: 0;
                    background: #fff;
                }

                iframe.k-content {
                    display: inline;
                    vertical-align: top;
                    margin: .5rem;
                    width: ~"calc(100% - 1rem)";
                }

                .k-tool-icon,
                .k-tool-icon.k-state-hover,
                .k-tool-icon.k-state-active,
                .k-tool-icon.k-state-active.k-state-hover {
                    margin-top: 0.1rem;
                    background-image: url('styles/Default/sprite.png?25300.8.0.25300.2050420250612');
                }

                .k-button-group {
                    padding: .1em 0;
                    vertical-align: middle;
                    border-radius: 4px;
                    margin: 0;
                    margin-right: 6px;
                    padding: 0;
                    border-width: 0;
                    list-style: none;
                    white-space: nowrap;
                    display: inline-block;
                    display: inline-flex;
                    flex-direction: row;
                    vertical-align: middle;
                    position: relative;
                    flex-wrap: nowrap;
                    white-space: nowrap;

                    .k-tool {
                        border-style: solid;
                        border-width: 1px;
                        margin-right: -1px;
                        text-align: center;
                        display: inline-block;
                        vertical-align: middle;
                        margin: 1px 0;
                        width: 2em;
                        height: 2em;
                        line-height: 2em;

                        &.k-state-hover,
                        &:focus {
                            position: relative;
                            z-index: 1
                        }

                        &.k-group-end {
                            border-right-width: 1px;
                            border-left-width: 1px;
                        }
                    }

                    .k-tool-icon {
                        display: inline-block;
                        width: 1.5rem;
                        height: 1.5rem;
                        overflow: hidden;
                        background-repeat: no-repeat;
                        font-size: 0;
                        line-height: 0;
                        text-align: center;
                        -ms-high-contrast-adjust: none;
                    }

                    .k-state-disabled {
                        display: none;
                        filter: alpha(opacity=30);
                        opacity: .3
                    }

                    .k-state-hover, .k-state-active {
                        vertical-align: middle
                    }
                }

                .k-tool-group {
                    .k-dropdown-wrap {
                        height: 1.5rem;

                        .k-select {
                            top: .3rem;
                        }
                    }

                    .k-input {
                        margin: .1rem;
                    }
                }

                .k-dropdown-wrap,
                .k-picker-wrap {
                    font-size: 0.75rem;

                    .k-select {
                        padding: 0;
                    }
                }

                .k-i-arrow-s {
                    background-position: 0 -288px;
                }

                .k-editable-area {
                    width: 100%;
                    height: 100%;
                    border-style: solid;
                    border-width: 1px;
                    outline: 0
                }

                .k-raw-content {
                    border: 0;
                    margin: 0;
                    padding: 0;
                    font-size: inherit;
                    font-family: consolas,"courier new",monospace;
                }

                .k-i-custom {
                    background-position: -111px -109px
                }
            }

            .k-editor-toolbar {
                margin: 0;
                padding: 0;
                list-style-type: none;
                line-height: 1.3em;
                cursor: default;
                word-wrap: break-word;
                border-width: 0 0 1px 0;
                padding: .1em 0;

                li {
                    display: inline-block;
                    vertical-align: middle;
                    padding: .1em 0;
                    margin-right: 6px
                }

                .k-break {
                    display: block;
                    height: 1px;
                    font-size: 0;
                    line-height: 0
                }

                .k-separator {
                    position: relative;
                    top: 1px;
                    border-style: solid;
                    border-width: 0 1px 0 0;
                    margin: 0 .3em 0 .1em;
                    padding: 0 0 0 1px;
                    font-size: 1.3em
                }

                .k-dropdown, .k-combobox, .k-selectbox, .k-colorpicker {
                    vertical-align: middle
                }

                .k-editor-dropdown {
                    position: relative;
                }

                .k-dropdown, .k-combobox, .k-selectbox, .k-colorpicker {
                    vertical-align: middle;
                }

                .k-row-break {
                    display: block;
                    height: 0;
                    font-size: 0;
                    line-height: 0
                }

                .k-editor-widget, > li {
                    margin-right: 6px
                }
            }

            .k-fontName {
                width: 110px
            }

            .k-fontSize {
                width: 124px
            }

            .k-formatBlock {
                width: 147px
            }

            #k-editor-image-width,
            #k-editor-image-height {
                width: 5em
            }

            .k-group-start.k-group-end .k-editor-widget {
                margin-right: 0
            }

            .k-popup {
                border-style: solid;
                border-width: 1px;
            }
        }
    }

    .previous {
        .pageParentDiv {
            opacity: 0.5;
        }

        .pageParentDiv:hover {
            cursor: pointer;
            opacity: 1.0;
            background-color: rgba(180, 185, 185, 0.30);
        }
    }

    .previous-page {
        cursor: pointer;
        background-color: ButtonFace;
        opacity: 0.75;
        margin-bottom: 1rem;

        &:hover {
            border-color: rgb(207, 234, 240);
            background-color: rgb(229, 245, 248);
            cursor: pointer;
        }
    }

    .not-clickable-previous-page {
        cursor: auto;
        background-color: ButtonFace;
        opacity: 0.75;
    }

    &.no-breadcrumb {
        margin-top: 28px;
    }

    &.comments-enabled > *:last-child {
        margin-bottom: 140px;
    }
}

#ADAppWrapper {
    .notessmall #ADWidgetsWrapper {
        > *:last-child {
            margin-bottom: 100px;
        }
    }

    .notesmedium #ADWidgetsWrapper {
        > *:last-child {
            margin-bottom: 140px;
        }
    }

    .notesbig #ADWidgetsWrapper {
        > *:last-child {
            margin-bottom: 200px;
        }
    }
}
// Lookup list, Calendar
div.k-animation-container {
    .k-list, .k-calendar-container {
        & .k-state-selected,
        & .k-state-focused,
        & .k-state-highlight {
            background-color: @selected-background-color;
            border-color: @focused-border-color;
            color: @selected-text-color;
        }
    }
}

/*** Horizontal Layout ***/

/* Mixings */
.widget-caption-width-list-hor-mx() {
    vertical-align: top;

    .AgileDialogsWidgetCaptionContainer {

        div[rel='tooltip'] {
            position: absolute;
            top: -1px;
            background-color: transparent;
            right: -72% !important;
        }

        &.YesNoControlCaption,
        &.RadioControlCaption,
        &.CheckControlCaption {
            width: inherit;
            max-width: ~"calc(100% - 6rem)";
            margin-right: 0 !important;
            .ellipsis-mx();
        }

        &.CalendarControlCaption {
            max-width: ~"calc(100% - 18em)";
            .ellipsis-mx();
        }

        &.FileControlCaption {
            max-width: ~"calc(100% - 12em)";
            .ellipsis-mx();
        }
    }

    .AgileDialogsWidgetControlContainer {
        vertical-align: top;

        &.RadioControlContainer,
        &.CheckControlContainer {

            .optionsContainer {
                &.Horizontal {
                }
            }
        }

        &.CalendarControlContainer {
        }

        &.FileControlContainer {

            .k-upload-status {
                margin-top: 1rem;
            }

            .k-upload-files {
                width: ~"calc(100% - 1rem)";
                padding-right: 4px;
            }

            .k-upload-button,
            .input[type=file] {
                left: auto;
                right: 0;
                position: absolute;
            }
        }
    }
}

.control-container-mx() {

    input, .k-dropdown {
        float: right;
    }

    &.YesNoControlContainer,
    &.RadioControlContainer,
    &.CheckControlContainer {

        &:not(.Horizontal) {
            display: inline;
            position: absolute;
            margin: 0.5rem;
        }

        margin-left: 0 !important;
        right: 0;

        .optionsContainer {

            &.Horizontal {
            }

            fieldset {
                padding: 0;
                margin-right: 0;
                margin-left: auto;
                margin-top: 2px;

                div {
                    height: 1.5rem;
                    flex-grow: 0;
                    flex-shrink: 0;
                    margin-left: 0 !important;
                    padding-left: 0 !important;
                    max-width: 100%;
                    flex-basis: 8rem;
                    min-width: 20%;

                    label {
                        margin-left: 0.25rem;
                        margin-right: 0.25rem;
                        text-overflow: ellipsis;
                        overflow: hidden;
                        display: inline-block;
                        white-space: nowrap;
                        max-width: ~"calc(100% - 2.5rem)";

                    }

                    input[type=radio], input[type=checkbox] {
                        float: left;
                        margin-left: 1rem;
                    }
                }
            }
        }
    }

    .k-numerictextbox {
        left: 6px;

        > * {
            float: right;
        }

        .k-numeric-wrap {
            display: inline-block;
            max-width: ~"calc(100%  - 2rem)";
            width: ~"calc(100%  - 2rem)";
        }
    }

    &.CalendarControlContainer {
        left: -20px;
        float: right;

        .k-picker-wrap {
            display: inline-block;
            max-width: ~"calc(100%  - 2rem)";
            width: ~"calc(100%  - 2rem)";
        }
    }

    &:not(span12) {

        .k-lookup-button {
            top: -1.5rem !important;
            left: -1rem !important;
        }

        input {
            &.lookup {
                position: relative;
                left: 20px;
            }
        }
    }
}

.AgileDialogsWidgetControlContent(@width, @index) {
    > input[type="text"],
    > input[type="password"],
    > textarea,
    > .k-widget.k-dropdown,
    > .k-widget.k-numerictextbox,
    > .k-widget.k-autocomplete {
        width: 100%;
    }

    .AgileDialogsWidgetControlContent2(@width, @index);
    .CrmLookupControlContainer-lookup(@width);
}

.flex-mx() {

    div {
        &.AgileDialogsWidgetCaptionContainer {
            min-width: 15% !important;
            width: auto;
        }

        &.AgileDialogsWidgetControlContainer {
            position: inherit !important;
            margin-right: 0 !important;
            /*&:not(.span12) {
                    min-width: 40% !important;
                    max-width: 84% !important;
                }*/

            .optionsContainer {
                display: inline-flex;
                flex-direction: row;
                margin-left: 0;
                padding-right: 0;
                margin-top: .2rem;

                &:not(.Vertical) {
                    fieldset {
                        width: 100%;
                    }
                }
            }
        }
    }
}

#ADWidgetsWrapper {
    &.Horizontal {

        .AgileDialogsWidget:not(.infoWidget):not(.RichTextEdiorControl):not(.XRMGrid):not(.ContainerWidget):not(.FrameControl) {

            &.listWidget {
                .flex-mx();
            }

            .widget-caption-width-list-hor-mx();

            .AgileDialogsWidgetCaptionContainer {
                .questionCaption {
                    padding: .3rem;
                    overflow: hidden !important;
                    white-space: nowrap !important;
                    text-overflow: ellipsis;
                    max-width: 100%;

                    &.required {
                        &:after {
                            position: absolute;
                            top: 0.3rem !important;
                            right:0;
                        }

                        &.overflow-widget {
                            &:after {
                                right: 0;
                            }
                        }
                    }
                }

                &.YesNoControlCaption,
                &.RadioControlCaption,
                &.CheckControlCaption {
                    width: auto;
                    vertical-align: inherit;
                }

                &.RadioControlCaption,
                &.CheckControlCaption {
                    width: inherit;
                    max-width: inherit;
                }

                &.span0 {
                    margin: 0 !important;
                    display: none;

                    .questionCaption {
                        display: none;
                    }

                    .tooltiptext {
                        left: 0;
                    }
                }

                &.span1 {
                    .widget-caption-width-mx((100% / 12) * 1);
                }

                &.span2 {
                    .widget-caption-width-mx((100% / 12) * 2);
                }

                &.span3 {
                    .widget-caption-width-mx((100% / 12) * 3);
                }

                &.span4 {
                    .widget-caption-width-mx((100% / 12) * 4);
                }

                &.span5 {
                    .widget-caption-width-mx((100% / 12) * 5);
                }

                &.span6 {
                    .widget-caption-width-mx((100% / 12) * 6 );
                }

                &.span7 {
                    .widget-caption-width-mx((100% / 12) * 7 );
                }

                &.span8 {
                    .widget-caption-width-mx((100% / 12) * 8 );
                }

                &.span9 {
                    .widget-caption-width-mx((100% / 12) * 9 );
                }

                &.span10 {
                    .widget-caption-width-mx((100% / 12) * 10 );
                }

                &.span11 {
                    .widget-caption-width-mx((100% / 12) * 11 );
                }

                .caption-container-mx();
            }

            .AgileDialogsWidgetControlContainer {
                float: right;
                .agileDialogs-WidgetControlContent-mx();
                .k-tooltip-validation-mx();
                .control-container-mx();

                .optionsContainer {
                    &.not(.Vertical) {
                        padding: 0;
                        width: 100% !important;
                    }

                    &.buttonset {
                        fieldset {
                            float: right;
                        }
                    }
                }

                &.RadioControlContainer,
                &.CheckControlContainer,
                &.YesNoControlContainer {
                    margin-top: 0 !important;

                    &.Horizontal {
                    }

                    &.Vertical {
                    }

                    .optionsContainer {
                        &.buttonset {
                            fieldset {
                                div.radio-button-options-container {
                                    display: inline-block;
                                }
                            }
                        }

                        &:not(.buttonset) {
                            fieldset {
                                div {
                                    display: inline-block;
                                    padding-left: 1.3rem;

                                    label {
                                    }
                                }
                            }

                            &.Horizontal {
                            }

                            &.Vertical {
                                fieldset {
                                    float: right;
                                    margin-right: 1rem;
                                }

                                div {
                                    display: block !important;
                                }
                            }
                        }
                    }
                }

                &.YesNoControlContainer {
                    .optionsContainer {
                        width: auto;

                        &:not(.buttonset) {
                            &.Horizontal {
                            }
                        }
                    }
                }

                &.CalendarControlContainer {
                    left: -1rem !important;
                    width: auto;
                }

                &.FileControlContainer {
                    top: -1.5rem;
                }

                &.span12 {
                    width: 100%;

                    .k-numeric-wrap {
                        left: -6px;
                    }

                    .lookup {
                        width: ~"calc(100% - 6px)";
                    }
                }
            }
        }
    }

    &.Vertical {
        /* None, default */
    }
}
/*** End of Horizontal Layout ***/


#fixedDiv.site-bottom-bar {
    #viewProcessButton,
    #feedbackButton,
    #cancelButton {
        &.k-button-disabled {
            display: none;
        }
    }

    .innerbox();
    height: 50px;
    top: auto;
    z-index: 1;

    .site-bottom-bar-frame {
   
        left: 0;
        right: 0;
        position: absolute;
        padding-bottom: 4rem;

        .k-icon {
            background-image: url('@{agiledialogs-images}/icons-sprite.png?25300.8.0.25300.2050420250612');
        }

        .site-bottom-bar-content {
            .innerbox();            
            background-color: transparent;
            border-bottom-left-radius: @main-border-radius;
            border-bottom-right-radius: @main-border-radius;

            .site-bottom-bar-left-area-container {
                position: absolute;
                top: 0;
                left: 0;
                padding: 9px;
                white-space: nowrap;
            }

            #backButton,
            #bottombarbuttonswrapper {
                display: inline-block;
                vertical-align: top;
            }

            #bottombarbuttons {

                a {
                    margin: 0 4px 0 0;
                }
            }

            .optionsContainer {
                padding-top: 9px;
                float: right;

                div {
                    display: inline-block;
                    padding-right: 0.4em;

                    input {
                        height: 33px;
                        padding-top: 2px;

                        &.last-button {
                            padding-left:20px;
                        }
                    }

                    .k-icon {
                        &.k-i-arrowhead-e {
                            position:relative;
                            left:20px;
                            margin-left:-16px;
                        }
                    }
                }
            }

            .showmore,
            .showless {
                display: none;

                .k-icon {
                    margin: -2px 0 0 0;
                }
            }

            &.buttonsoverflow {

                #bottombarbuttons {
                    display: none;
                }

                .showmore {
                    display: block;
                }

                .showless {
                    display: none;
                }
            }

            &.buttonsoverflow.buttonsvisible {

                #bottombarbuttons {
                    z-index: 1;
                    position: absolute;
                    bottom: 45px;
                    display: block;
                    .boxshadow();
                    padding: 4px 0 0 4px;
                    border: 1px solid @widget-border-color;
                    background-color: @widget-background-color;

                    a {
                        margin: 0 4px 4px 0;
                        display: block;
                    }
                }

                .showless {
                    display: block;
                }

                .showmore {
                    display: none;
                }
            }

            &.buttonsoverflow.buttonshidden {

                .showless {
                    display: none;
                }

                .showmore {
                    display: block;
                }
            }

            .site-bottom-bar-right-area-container {
                position: absolute;
                top: 0;
                right: 0;
                padding: 9px;
            }
        }
    }
}

#notesPanel {
    .innerbox();
    height: auto;
    top: -33px;
    bottom: auto;
    margin-right: 30px;
    margin-left: 5px;
    display: none;

    &.collapsed {
        width: 90px;
        #notesInput{
            display:none;
        }
    }
}
	
	@media screen and (-webkit-min-device-pixel-ratio:0) {  // Chrome hack
	
		#notesPanel {
		
			top: -32px;
		}
	}
	
	#notesTitle {
		position: relative;
		left: 6px;
		z-index: 1;
	}
	
	#notesInput {
		
		padding: 5px 5px 0 100px;
		border: 1px solid @widget-border-color;
		position: relative;
		top: -38px;
		background-color: @widget-background-color;
		z-index: 0;
		border-top-left-radius: @main-border-radius;
		border-top-right-radius: @main-border-radius;
		
        &.focus-item {
            .highlight-behavior(@focused-border-color);
        }

        textarea { 
            resize: none; 
		}
	}
	
	#txtNotes {
		
		width: 100%;		
		height: 50px;
	}
	
	#ADAppWrapper.notessmall #txtNotes { height: 50px; } 
	#ADAppWrapper.notesmedium #txtNotes { height: 100px; }
	#ADAppWrapper.notesbig #txtNotes { height: 150px; }
	
	
	
	
.k-widget {
    &.k-window {
        height: auto !important;
        z-index: 100000;

        &.k-window-frame {
            height: inherit !important;
            max-height: 88%;
            width: 65%;

            &.k-window-maximized {
                max-height: 95%;
            }

            .frame-window {
                overflow: hidden;
                padding: 0;
            }
        }

        #messageContent {
            margin-bottom: 20px;
        }

        .k-window-title {
            overflow: inherit;
        }

        .notes-content-buttons {
            text-align: right;
        }

        &.history-window {
            width: 80%;
        }

        #pendingTasks {
            height: 36.5em;

            #pendingTasksGrid {
                height: 34.5em !important;
            }

            .k-grid .k-button.rowButton {
                min-width: 32px;
                max-width: 32px;
            }
        }

        &.pending-tasks-window {
            width: 80%;
        }

        &.k-window-popup {


            &:not(.k-window-maximized) {
                min-width: 35rem !important;
                max-height: 85% !important;
                max-width: 85% !important;
            }

            &.k-window-maximized {
                height: ~"calc(100% - 2.7rem)" !important;
                width: ~"calc(100% - 2px)" !important;
                max-width: 100% !important;
                max-height: 100% !important;

                .render-popup {
                    &.k-window-content {
                        height: 90% !important;
                        overflow-y:initial;

                        #ADWidgetsWrapper 
                        {
                            height: 84% !important;

                            &.start-page {
                                max-height: 47vh;
                                margin: 0;

                                .AgileDialogsWidget {
                                    max-width: initial;
                                }

                                > :last-child {
                                    margin-bottom: 1rem;
                                }
                            }
                        }
                    }
                }

                .render-popup-buttons {
                    top: -2.5rem;
                    position: relative;
                    right: 1rem;
                }
            }

            .render-popup-buttons {
                padding: 0.75rem 0.5rem;
                height: 3rem;
                float: right;

                .k-button {
                    margin-right: .35rem;

                    &:first-child {
                        height: auto;
                        display: inline-block !important;
                    }

                    &.last-button {
                    }

                    &.k-button-disabled {
                        display: none;
                    }
                }

                .optionsContainer {
                    display: inline-block;

                    .radio-button-options-container {
                        display: inline-table;
                    }

                    &.buttonset {
                        .radio-button-options-container {
                            &:last-child {
                                &::before {
                                    display: block;
                                    height: 1rem;
                                    width: 1rem;
                                    position: relative;
                                    content: "";
                                    background-position: -16px -272px;
                                    background-image: url('@{image-folder}/sprite.png?25300.8.0.25300.2050420250612');
                                    left: 0.3rem;
                                    top: 1.5rem;
                                    z-index: 1;
                                }

                                input {
                                    padding-left: 1.5rem;
                                }
                            }
                        }
                    }
                }
            }
        }

        .k-window-content {
            overflow-y: initial;

            &.render-popup {
                position: static;
                width: 100%;
                //overflow: hidden;
                padding-top: 0;

                #ADWidgetsWrapper {
                    font-size: @screenzoom;
                    padding-left: 6px;
                    padding-right: 6px;
                    overflow-y: auto;
                    position: relative;
                    max-height: 70vh;
                    max-width: 100%;
                    margin-top: 0;
                    border-top: none;

                    & > :last-child {
                        margin-bottom: 50px;
                    }

                    .k-widget {
                        z-index: auto;

                        &.k-invalid-msg {
                            z-index: 10002;
                        }
                    }

                    .ContainerControl {

                        .AgileDialogsWidget {

                            &.span1 {
                                width: calc(~"(100% / 12) * 1 - 10px" )
                            }

                            &.span2 {
                                width: calc(~"(100% / 12) * 2 - 10px" )
                            }

                            &.span3 {
                                width: calc(~"(100% / 12) * 3 - 10px" )
                            }

                            &.span4 {
                                width: calc(~"(100% / 12) * 4 - 10px" )
                            }

                            &.span5 {
                                width: calc(~"(100% / 12) * 5 - 10px" )
                            }

                            &.span6 {
                                width: calc(~"(100% / 12) * 6 - 10px" );
                            }

                            &.span7 {
                                width: calc(~"(100% / 12) * 7 - 10px" )
                            }

                            &.span8 {
                                width: calc(~"(100% / 12) * 8 - 10px" )
                            }

                            &.span9 {
                                width: calc(~"(100% / 12) * 9 - 10px" )
                            }

                            &.span10 {
                                width: calc(~"(100% / 12) * 10 - 10px" )
                            }

                            &.span11 {
                                width: calc(~"(100% / 12) * 11 - 10px" )
                            }

                            &.span12 {
                                width: calc(~"100% - 10px" );
                            }
                        }
                    }

                    .AgileDialogsWidget {
                        &.span1 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 1" )
                        }

                        &.span2 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 2" )
                        }

                        &.span3 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 3" )
                        }

                        &.span4 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 4" )
                        }

                        &.span5 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 5" )
                        }

                        &.span6 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 6" )
                        }

                        &.span7 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 7" )
                        }

                        &.span8 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 8" )
                        }

                        &.span9 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 9" )
                        }

                        &.span10 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 10" )
                        }

                        &.span11 {
                            max-width: calc(~"(@render-popup-width-unit / 12) * 11" )
                        }

                        &.span12 {
                            max-width: @render-popup-width-unit;
                        }
                    }
                }
            }
        }
    }
}
	
#loadingSpin {		
	height: 70px !important;		
	.spinner { top: 30px !important; }	
}

#lookupWindow {
    .top {
    }

    .body {
        margin-bottom: 10px;

        .k-content {
            height:auto;
            .grid-right-align-data {
                text-align: right;
            }
        }
    }

    .botton {
        float: right;
    }

    .watermark {
        .watermark();
        top: 20px;
        left: 20px;
    }

    .focus-item {
        .highlight-behavior(@focused-border-color);
    }
}

#notesWindow{
    margin:.5rem;
}

#notesContent {
    min-width: 18rem;
    padding: 0.5rem;
    margin-bottom: 0.5rem;
    overflow-x: hidden;
    overflow-y: auto;
    min-height: 4rem;
    max-height: 65vw;
}

#confirmWindow {
    .message-content-buttons {
        float:right;
    }
}

#messageWindow {
    .message-content-buttons {
        float: right;
    }
}

#feedbackWindow {
    max-height: 80vh;
    overflow:hidden;
    .feedback-title {
        font-weight: bold;
        font-size: 0.8em;
    }

    #feedbackGrid {
        width: 100%;
        height: 30em;
        font-size: 0.7em;
    }

    form {
        padding: 5px;
        height:93px;
        textarea {
            width: 100%;
            height: 5em;
            padding: 5px;
            padding-right: 0px;
            font-family: @font-family;
        }

        .k-tooltip-validation {
            left: 5px;
            position: relative;
            top: -35px;
        }
    }

    .buttons-container {
        float: right;
        padding: 0.5em 0em 0.5em 0.5em;
    }

    .k-remove-feedback {
        max-width: 32px;
        min-width: 30px;
    }

    .query-options-container {
        padding: 2px;
        font-size: 0.7em;

        label {
            position: relative;
            top: -2px;
        }
    }
}

#errorWindow {
    height: 385px;
    width: 580px;
    padding:0;
    overflow:hidden;
}

#toolsWindow{  
    width: 35rem;
    iframe{
        min-height:15rem;
    }
}

.cover {
    border: none;
    position: absolute;
    top: -2px;
    left: -2px;
    height: calc(101% + 2px);
    width: 101%;
    z-index: -1;
}





#historyWindow {
    height: 80vh;

    &.state {
        height: auto;

        .history {
            border: 1em;
            border-color: rgb(249, 245, 245);

            &.state {
                .CrmGridControlContainer {
                    .k-grid-content {
                        tr.k-state-selected {
                            background-image: none;
                        }
                    }
                }

                .RichTextEdiorControlContainer {

                    .content {
                        &.disable {
                            opacity: 0.75;
                        }
                    }

                    .overlay {                        
                        background-color: initial;
                    }
                }
            }
        }
    }

    .history {
        counter-increment: IndexOrder;

        &:before {
            content: counter(IndexOrder);
            padding: 0 7px 2px;
            margin: 3px 0 0 0;
            border: 1px solid @widget-border-color;
            border-radius: 50%;
            color: @text-outstanding;
            font-weight: bold;
            position: absolute;
        }

        &:not(.state) {
            &:hover {
                border-color: rgb(207, 234, 240);
                background-color: rgb(229, 245, 248);
                cursor: pointer;
            }
        }

        h2 {
            margin: 10px 0 10px 40px;
            font-size: 120%;
            color: @text-outstanding;
        }

        .pageCaption {
            &.popup {
            }
        }
    }

    #historyForm {
        height: ~"calc(100% - 1rem)";
        width: ~"calc(100% - 1rem)";

        > div {
            position: relative;
            padding: 1.5rem;
            padding-top: 0;
        }

        .AgileDialogsWidget {
            &.ContainerWidget {
                padding: 0;
            }

            .k-grid-content {
                overflow: hidden;
            }
        }
    }

    #ADWidgetsWrapper {
        margin: 0;
        overflow: hidden;
        padding: 20px 0;
        position: inherit;

        .AgileDialogsWidget {
            margin: 0 0 10px;
        }

        > *:last-child {
            margin-bottom: 10px;
        }
    }
}

.confirmContent {
    padding: 1em;
}

.hidden-form {    
    border: solid 5px #3b79b7;
    background-color: rgba(255, 255, 255, 0.2);
    overflow: hidden;
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.5);
    padding: 8rem;
    width: 85%;
    text-align: center;
}
@media-phone: ~"only screen and (min-device-width : 0px) and (max-device-width : 425px) , only screen and (min-width : 0px) and (max-width : 425px) ";
@media-tablet: ~"only screen and (min-device-width : 426px) and (max-device-width : 769px) , only screen and (min-width : 426px) and (max-width : 769px)";

@font-size-tablet: 1.1rem;
@font-size-tablet-lists: 1rem;
@font-size-phone: 1.05rem;
@breadcrumbs_padding_left: 8px;

@drop-down-min-height: 5em;
@lookup-min-height: 1.6rem;

// mixing overrirdes
.questionCaption-mx() {
    .questionCaption {
        @media @media-phone {
            &.required {
                padding-left: 4rem;
            }
        }

        @media @media-tablet {
            &.required {
                padding-left: 1.6rem;
            }
        }
    }
}

// private
.body-mx(@sz) {
    body > * {
        font-size: @sz !important;
    }

    form {
        margin: 1rem;
    }

    #ADAppWrapper {
        left: 0 !important;
    }

    #ADFinishFrameContent {
        font-size: initial;
    }
}

.pageCaption-mx (@sz) {
    #Output > .pageParentDiv > .dialogPageTable .pageCaption {
        font-size: @sz;
        min-height: @sz + 1em;

        &.hasBreadCrumbs {
            display: none;
        }
    }
}

.widgetContainer-mx () {
    #ADWidgetsWrapper {
        .ContainerWidget {
            margin-left: 0rem !important;
            margin-right: 0rem !important;

            .AgileDialogsWidgetCaptionContainer {
                .questionCaption {
                    &:empty {
                        display: none;
                    }
                }
            }

            .AgileDialogsWidgetControlContainer {
            }
        }
    }
}

.ADWidgetsWrapper-mx ( @fz; @marginbottom; @req_sz; @watermark_fs; @description_fs; @caption_min; @lookup-width; @phone) {

    form {
        &.non-hosted {
            #ADAppWrapper {
                min-height: ~"calc(100% - (@{ad-app-wrapper-border-size} * 2) - 4rem)" !important;
            }
        }

        #ADAppWrapper {
            .k-dropdown, .k-combobox {
                font-size: @fz;
            }
        }

        #ADWidgetsWrapper {
            margin-top: @margintop !important;
            margin-bottom: @marginbottom !important;
            padding: @req_sz !important;
            vertical-align: top;

            .AgileDialogsWidget {
                vertical-align: top !important;
                margin-left: 0.5rem !important;
                min-height: @widget-min-height;
                padding-right: initial !important;

                .AgileDialogsWidgetCaptionContainer {
                    .questionCaption {
                        height: @caption_min + 1 !important;
                        min-height: @caption_min !important;

                        .tooltiptext {
                            .line() when (@phone = 1) {
                                line-height: 3rem;

                                &::before {
                                    font-size: 1em !important;
                                    top: 1em !important;
                                }
                            }

                            .line() when (@phone = 0) {
                                line-height: 2rem;

                                &::before {
                                    font-size: 1em !important;
                                    top: ~"calc(1em + 2px)" !important;
                                }
                            }

                            font-size: @description_fs;
                            top: -0.5rem;
                            margin-top: 0;
                            .line();
                        }
                    }
                }

                .AgileDialogsWidgetControlContainer {
                    input[type=text],
                    input[type=password],
                    textarea {
                        font-size: @fz;
                        padding-left: 1rem !important;

                        &.lookup {
                            max-width: @lookup-width !important;
                        }
                    }

                    .watermark {
                        font-size: @watermark_fs;
                        left: 1.5rem !important;
                        top: 0.5rem !important;
                    }

                    &.YesNoControlContainer,
                    &.RadioControlContainer,
                    &.CheckControlContainer {
                        .optionsContainer-mx(0; @phone);
                    }
                }
            }
        }
    }
}

.hide-centered-mx() {
    #dialogTitle {
        margin-left: 0.6rem !important;
        margin-top: 0.3rem !important;
        width: 100% !important;
        height: auto;
    }

    #ADAppWrapper {

        &.centered {
            &::before,
            &::after {
                display: none !important;
            }

            width: initial !important;

            #fixedDiv {
                width: initial !important;
                padding-top: 0.5rem;
            }
        }
    }
}

.optionsContainer-mx(@layout_h, @phone) {

    .fieldset-mx(@top; @adjust; @lb) {
        fieldset {
            padding-top: 0;

            .label() {
                div {
                    min-height: 2rem !important;
                    line-height: 2rem;

                    label {
                        font-size: @description_fs;
                        margin: 0 0.5rem 0 0.5rem;
                        box-decoration-break: clone;
                    }
                }
            }

            .label() when (@phone = 1) {
                div {
                    min-height: 3.5rem;

                    label {
                        margin: 1.5rem !important;
                        padding: 1rem;
                        box-decoration-break: clone;
                    }
                }
            }

            .inputs() when (@layout_h = 0 ) {

                input[type=radio], input[type=checkbox] {
                    top: calc(@top + ~" + 1px");
                    position: relative;
                }
            }

            .inputs() when (@layout_h = 1 ) {
                label {
                    padding-left: @lb;
                }

                input[type=radio],
                input[type=checkbox] {
                    top: 1px;
                    margin-top: @adjust;
                }
            }

            .label();
            .inputs();
        }
    }

    .optionsContainer {
        .fieldset-mx( -0.5rem; 0.4rem; 0);

        &.Horizontal {
            .fieldset-mx( -0.5rem; 0.5rem; 0) !important;

            fieldset {
                div {
                    display: inline-flex;                    
                }
            }
        }
    }
}

.site-bottom-bar-content-mx(@scale) {
    .site-bottom-bar-content {
        .site-bottom-bar-left-area-container {
            margin-left: 0.4rem;
        }

        .site-bottom-bar-right-area-container {
            margin-right: 0;
            padding-right: 0;
        }

        .radio-button-options-container {

            input[type=button] {
                height: auto !important;
            }
        }

        > .k-button {
            padding: 1rem;
        }

        .k-icon {
            transform: scale(@scale);
        }
    }
}

.cancel-button(@phone) when (@phone = 1) {
    /* phone */
    #cancelButton {
        .k-icon {
            display: none;
        }
    }

    .site-bottom-bar-content-mx(3.3);
}

.cancel-button(@phone) when (@phone = 0) {
    /* tablet */
    #cancelButton {
        .k-icon {
            transform: scale(1.2);
        }
    }

    .site-bottom-bar-content-mx(1.6);
}

.fixedDiv-mx (@sz; @margin; @phone; @spinScale) {

    #fixedDiv {
        height: @sz !important;
        margin: @margin !important;

        #viewProcessButton,
        #historyButton,
        #feedbackButton,
        #notesPanel {
            display: none !important;
        }

        .cancel-button(@phone);

        .site-bottom-bar-frame {
            top: -0.3rem !important;
        }
    }

    .imagespin {
        transform: @spinScale;
    }

    form {
        &:not(.k-rtl) {
            #fixedDiv {
                .site-bottom-bar-content {
                    margin-right: 1rem !important;
                    margin-left: 0 !important;
                }
            }
        }

        &.k-rtl {
            #fixedDiv {
                .site-bottom-bar-content {
                    margin-right: 0 !important;
                    margin-left: .5rem !important;
                }
            }
        }
    }
}

.kendo-popups-mx(@fs; @calendar-header-icon-scale; @icon-scale; @lookupGrid-height; @lookupGrid-icon-scale; @isPhone) {

    .k-animation-container {
    }

    .k-list-container.k-popup {
        min-height: @drop-down-min-height !important;

        ul {

            li.k-item {
                font-size: @fs;
                /*font-size: @fs *.75 !important;
                zoom: 0.8;*/
            }
        }
    }

    .k-calendar-container {

        .k-header {
            .k-icon {
                transform: @calendar-header-icon-scale;
            }
        }

        .k-calendar {
            min-width: @calendar-width;
            font-size: @calendar-font-size;

            .k-link {
                padding: .5rem;
                line-height: initial;
                text-align: center;
            }
        }
    }

    .k-widget.k-window {
        max-width: 90vw;
        min-width: 80% !important;

        .k-window-titlebar {
            font-size: @fs;
        }

        .k-window-content {
            overflow: hidden;             
        }

        &.history-window {
             
            padding: 0 !important;
            .k-window-content {
                overflow-y: auto;
            }
        }

        .k-window-actions {
            .k-window-action {
                .k-icon:not(.k-i-close) {
                    display: none;
                }
            }
        }

        #messageWindow {
            font-size: @fs * .75;
            overflow: hidden;
            padding: 0.5em;

            #messageContent {
                max-height: 93%;
                height: 93%;
                overflow: initial;
            }
        }

        &.lookup-window {
            width: 80% !important;

            .k-window-titlebar {
                display: none;
            }

            #lookupWindow {
                overflow: hidden;
                padding-top: 0 !important;
                top: -1rem !important;
                max-height: 90vh !important;

                .top {
                    a#lookupFilterButton {
                        right: 1rem;
                        border: none;
                        height: 1rem;
                        top: -1rem;

                        .k-lookupFilterButton-top-mx() when (@isPhone = 0) {
                            top: -1rem;
                        }

                        .k-lookupFilterButton-top-mx();

                        .k-icon {
                            transform: @lookupGrid-icon-scale;
                        }
                    }

                    #txtLookupFilter {
                        padding-right: 7.5rem;
                    }

                    .watermark {
                        top: .8rem;
                        left: 1.5rem;
                    }
                }

                .body {
                    margin-top: 3em;
                    margin-bottom: 1rem - @isPhone;

                    .k-content {
                        padding-right: 1px;

                        #lookupGrid {
                            height: @lookupGrid-height;
                            zoom: 0.74;

                            .k-grid-header {
                                height: @fs * 2.6;

                                .k-header {
                                    font-size: @fs;
                                }
                            }

                            .k-grid-content {
                                tr {
                                    td {
                                        font-size: @fs !important;
                                        line-height: 2.5rem;
                                        text-overflow: ellipsis;
                                        overflow: hidden;
                                        white-space: nowrap;
                                    }
                                }
                            }

                            .k-grid-pager {
                                overflow: hidden;
                                min-height: 2rem;

                                .k-pager-nav,
                                .k-pager-info,
                                .k-pager-input {
                                    display: none !important;
                                }

                                .k-icon {
                                    transform: scale(2.5);
                                    margin-top: 0.6rem;
                                }

                                .k-link,
                                .k-pager-numbers li *:not(.k-link) {
                                    padding: 1rem;
                                }

                                span, a {
                                    line-height: 1em !important;
                                }
                            }
                        }
                    }
                }

                .botton {
                    margin: 1rem;

                    .k-icon {
                        transform: @lookupGrid-icon-scale;
                    }
                }
            }
        }

        &.confirm-window {
            width: ~"calc(100vw - 16rem)" !important;
            height: 80vh !important;
            margin-right: 4rem;

            #confirmContent {
                height: 85%;
            }
        }

        &.message-window {
            width: ~"calc(100vw - 16rem)" !important;
            height: 80vh !important;
            margin-right: 4rem;
        }

        &.k-window-popup {

            .render-popup-buttons {
                height: 2em !important;
                padding-bottom: 1.5rem !important;

                .k-icon {
                    transform: @icon-scale;
                    margin: 0.4rem;
                }
            }

            #ADWidgetsWrapper {
                padding-top: 0 !important;
                margin-top: 1rem !important;
                max-height: 65vh;
            }
        }

        .k-err-window-mx() when (@isPhone = 1) {
            transform: scale(1,1);
            width: 100% !important;

            .k-content-frame {
                height: 24rem;
            }
        }

        .k-err-window-mx() when (@isPhone = 0) {
            transform: scale(1,1);
            width: 80vw !important;

            .k-content-frame {
                height: 24rem;
            }
        }

        #errorWindow {
            .k-err-window-mx();
        }

        #confirmWindow {
            .message-content-buttons {
                padding: 1rem;
            }
        }
    }
}

.breadcrumbs-mx (@sz, @iconScale) {
    #BreadCrumbs {
        margin-left: 0 !important;
        width: ~"calc(100% - 1rem) !important";
        max-width: ~"calc(100% - 1rem) !important";

        &.overflow #BreadCrumbsSteps {
            padding-top: 0px !important;
        }

        #BreadCrumbsSteps {
            padding-left: @breadcrumbs_padding_left;

            span:last-child {
                font-size: calc(@sz ~" + 0.5rem");
            }
        }

        .showmore, .showless {
            margin-top: 0.5em;

            .k-si-plus, .k-si-minus {
                transform: scale(@iconScale);
                position: relative;
                top: -0.5rem;
            }
        }

        .breadCrumbsTemplateLink {
            font-size: @sz;
        }
    }
}

.widget-width-mx (@fs; @icon_transform; @numeric-control-link-height;) {

    &.disabledControl {
        .AgileDialogsWidgetCaptionContainer {
            .questionCaption {
                padding-left: 1.4rem !important;
            }
        }
    }

    .AgileDialogsWidgetCaptionContainer,
    .AgileDialogsWidgetControlContainer {

        .questionCaption {
            font-size: @fs;

            &.required {
                &:before,
                &:after {
                    top: @readonly-icon-top !important;
                }
            }
        }

        .k-icon {
            &.helpImage {
                transform: @helpImage-transform;
                top: @helpImage-top;
                position: relative;
            }
        }

        .k-tooltip-validation {
            position: relative;
            float: left;
            width: ~"calc(100% - 32px)";
        }

        .k-dropzone {

            .k-tooltip-validation {
                position: absolute;
                width: ~"calc(100% - 32px)";
                top:3.5rem !important;
            }
        }

        .k-input {
            min-height: 1.15rem;
        }

        &.ComboControlContainer {
            min-height: initial;

            .k-dropdown {
                .k-icon {
                    transform: @icon_transform;
                    margin: 0.5rem;
                }

                .k-tooltip-validation {
                    position: absolute;
                }
            }
        }

        &.CalendarControlContainer {

            .k-datepicker,
            .k-datetimepicker {
                max-width: initial !important;
                width: initial !important;
            }

            .k-select {
                padding: @calendar-icon-padding !important;

                .k-icon {
                    transform: @calendar-icon-transform;
                    margin: @calendar-icon-margin !important;
                }
            }

            .k-tooltip-validation {
                width: ~"calc(100% + 2rem)";
            }

            .k-picker-wrap {
                min-height: 2.4rem;
            }
        }

        &.NumericControlContainer,
        &.CurrencyControlContainer {
            .k-select {
                top: @currency-select-top;
                margin-right: calc(0.2rem * @isPhone);

                .k-icon {
                    transform: @icon_transform;
                }

                .k-link {
                    height: @numeric-control-link-height;
                }
            }
        }

        &.CrmGridControlContainer {

            col:not(:first-child) {
                width: 90vw !important;
            }

            .k-grid-header {
                .k-header {
                    font-size: @grid-font-size !important;
                }
            }

            .k-grid-content {

                tr {
                    td {
                        font-size: @grid-font-size * .9 !important;
                    }
                }
            }

            .k-grid-pager {
                font-size: @grid-font-size * .8;
                overflow: hidden;
                min-height: @grid-font-size * 1.6;

                .k-pager-nav,
                .k-pager-info,
                .k-pager-input {
                    display: none !important;
                }

                .k-pager-numbers li {
                    a, span, .k-link {
                        padding: .35rem !important;
                    }
                }

                .k-icon {
                    transform: scale(1.5);
                }

                span, a {
                    line-height: 1em !important;
                }
            }
        }

        &.CrmLookupControlContainer {
            .k-autocomplete {
                input {
                    margin-right: 0px;
                    max-height: initial;
                    min-height: @lookup-min-height;
                }
            }

            .k-tooltip-validation {
                position: absolute;
                width: ~"calc(100% - 1rem)";

                .k-icon {
                    right: 2rem !important;
                }
            }

            input[type=button] {
                transform: @lookup-icon-tranform;
                top: @lookup-input-top;
                left: @lookup-input-left;
                margin-right: 1rem;
            }
        }

        &.CrmLookupControlContainer:not(.span12) {
            input[type=button] {
                top: 0.5rem;
                left: -2.5rem;
            }
        }

        &.CheckControlContainer,
        &.RadioControlContainer,
        &.YesNoControlContainer {
            .inputs-mx() when (@isPhone = 0) {
            }

            .inputs-mx() when (@isPhone = 1) {
                input[type=radio], input[type=checkbox] {
                    margin-left: 0 !important;
                }
            }

            .inputs-mx();
        }

        &.CheckControlContainer {

            .checkbox-mx() when (@isPhone = 0) {
                input[type=checkbox] {
                    transform: @icon_transform;
                }
            }

            .checkbox-mx() when (@isPhone = 1) {
            }

            .checkbox-mx();

            label {
                top: @option-control-label-top;
            }

            .k-tooltip-validation {
                position: absolute;
            }
        }

        &.RadioControlContainer {

            .radio-mx() when (@isPhone = 0) {
                input[type=radio] {
                    transform: @icon_transform;
                }
            }

            .radio-mx() when (@isPhone = 1) {
            }

            .radio-mx();

            label {
                top: @option-control-label-top;
            }

            .k-tooltip-validation {
                position: absolute;
            }
        }

        &.YesNoControlContainer {
            .yesno-mx() when (@isPhone = 0) {
                input[type=radio] {
                    transform: @icon_transform;
                }
            }

            .yesno-mx() when (@isPhone = 1) {
            }

            .yesno-mx();

            label {
                top: @option-control-label-top;
            }

            .k-tooltip-validation {
                position: absolute;
            }
        }

        &.TabContainerControlContainer {
            ul {

                &.k-tabstrip-items {
                    padding: 0;

                    li {
                        font-size: 1.143rem;
                        display: block;

                        &.k-state-default:not(.k-state-active) {
                        }

                        &.k-state-active {
                            font-weight: bold;
                        }

                        .k-link {
                            overflow: hidden;
                            white-space: nowrap;
                            text-overflow: ellipsis;
                            padding: 0;
                            font-size: @fs;
                            margin: 0.5rem;
                        }

                        &.k-item {
                            border: none !important;
                        }
                    }
                }
            }
        }

        &.GroupContainerControlContainer {
            .AgileDialogsWidget {
                &.infoWidget {
                    .AgileDialogsWidgetCaptionContainer {
                        .questionCaption {
                            font-size: @fs !important;
                            font-weight: initial;
                        }
                    }
                }

                .AgileDialogsWidgetCaptionContainer {
                    .questionCaption {
                        font-size: @fs !important;
                        font-weight: initial;
                    }
                }
            }
        }

        &.FileControlContainer {
            font-size: 1.5rem;

            .k-dropzone {
                .k-upload-button {
                    max-width: 92vw !important;
                    width: 100%;

                    input[type=file] {
                        max-width: 100% !important;
                        min-height: calc(@fs * 2);
                    }
                }

                em {
                    display: none;
                }
            }


            .k-upload-files {

                .upload-file-max-mx() {
                    max-width: 89%;
                }

                .upload-file-max-mx() when (@isTablet = 1) {
                    max-width: 92%;
                }

                .upload-file-max-mx();


                .k-icon {
                    transform: scale(1 + @isPhone);
                }

                .k-filename {
                    padding-left: 2rem;
                }
            }

            .k-state-disabled {

                input[type=file] {
                    display: none;
                }
            }
        }

        &.RichTextEdiorControlContainer {
            .k-editor-toolbar {
                .k-dropdown-wrap {
                    input {
                        max-height: 1rem;
                        margin: 0;
                        font-size: 0.9rem;
                    }
                }
            }

            .k-tooltip-validation {
                position: absolute;
            }
        }
    }
}

.caption-container-responsive-hor-mx(@description_fs, @phone) {

    .top() when (@phone = 1) {
        top: -4rem;
    }

    .top() when (@phone = 0) {
        top: -4rem;
    }

    &.YesNoControlCaption,
    &.RadioControlCaption,
    &.CheckControlCaption {
        width: auto !important;
    }

    &.CalendarControlCaption {
        width: auto !important;
        max-width: ~"calc(100% - 18rem)" !important;
    }

    .tooltiptext {
        position: absolute;
        .top();

        &::before {
            font-size: 1em;
        }
    }

    div[rel='tooltip'] {
        top: 3px !important;
    }
}

.control-container-responsive-hor-mx(@watermark_fs, @fs, @phone) {

    input, .k-dropdown {
        min-width: initial;
        float: right;
    }

    &.YesNoControlContainer {
        .optionsContainer-mx(1; @phone);        
    }

    &.RadioControlContainer {
        .optionsContainer-mx(1; @phone);

        fieldset div label {
            top: -1px;
        }
    }

    &.CheckControlContainer {
        .optionsContainer-mx(1; @phone);
    }

    .k-numerictextbox {

        > * {
        }

        .k-numeric-wrap {
        }
    }

    &.CalendarControlContainer {
        input {
            padding-left: 0 !important;
        }

        .k-picker-wrap {
            min-height: 2.4rem;
        }
    }

    &.NumericControlContainer,
    &.CurrencyControlContainer {
        input {
            padding-left: 0 !important;
        }
    }

    &.CrmLookupControlContainer {
        .k-tooltip-validation {
            position: absolute !important;
            width: ~"calc(100% - 1rem)";
            float: initial;
            top: 4rem !important;
        }

        input[type=button] {
            float: none;
            left: 95% !important;
            top: -3rem !important;
        }

        &:not(.span12) {

            input[type=button] {
                top: -2.5rem !important;
                left: auto !important;
                right: 1rem !important;
                float: right;
            }
        }
    }

    &:not(.span12) {

        .k-lookup-button {
        }

        input {

            &.lookup {
            }
        }

        input[type=button] {
            top: 0;
            left: -2.5rem;
        }
    }

    .k-tooltip-validation-mx() {
        .k-tooltip-validation {
            top: initial !important;
            float: right;
            position: absolute !important;
        }
    }

    .k-tooltip-validation-mx() when (@phone = 0) {
        .k-tooltip-validation {
            top: 2.8rem !important;
        }

        .optionsContainer {
            .k-tooltip-validation {
                top: 2rem !important;

                &:after {
                    right: initial;
                    left: 1rem !important;
                }
            }
        }
    }

    .k-tooltip-validation-mx();

    .watermark {
        margin-left: -0.5rem !important;
    }
}

.widget-container-width-mx(@span) {

    &.infoWidget {
        min-width: @relative-width-infowidget * @span;
    }

    @media @media-phone {
        @isPhone: 1;
        @isTablet: 0;

        @lookup-input-top: .7rem;
        @lookup-icon-tranform: scale(1.5);
        @lookup-input-left: -2rem;

        @calendar-icon-transform: scale(1.3);
        @calendar-icon-margin: 0rem 0.2rem 0rem 0.2rem;
        @calendar-header-icon-scale: scale(2);
        @calendar-icon-padding: 0.3rem 0 0 0;

        @currency-select-top: .1rem;

        @option-control-label-top: 0px;

        @k-tooltip-validation-size: 1rem;

        @grid-content-height: 56rem;
        @grid-font-size: 1rem;

        @readonly-icon-top: 0;

        @helpImage-transform: scale(1.4);
        @helpImage-top: auto;

        @question-caption-padding-left: 4rem;

        .widget-width-mx(@font-size-phone; scale(1.5); .7rem);
        min-width: calc(100% - 3em) !important;

        &.infoWidget {
            min-width: calc(100% - 3em);
        }
    }

    @media @media-tablet {
        @isPhone: 0;
        @isTablet: 1;

        @lookup-input-top: .8rem;
        @lookup-icon-tranform: scale(1.5);
        @lookup-input-left: -2rem;

        @calendar-icon-transform: scale(1.5);
        @calendar-icon-margin: 0 0.7rem 0 0;
        @calendar-header-icon-scale: scale(2);
        @calendar-icon-padding: .5rem 0 0 0;

        @currency-select-top: 0.2rem;

        @option-control-label-top: -0.25rem;
        @k-tooltip-validation-size: 2rem;
        @grid-content-height: 53vw;
        @grid-font-size: 1.1rem;
        @readonly-icon-top: 0;

        @helpImage-transform: scale(1.2);
        @helpImage-top: auto;

        @question-caption-padding-left: 1rem;

        .widget-width-mx(@font-size-tablet; scale(1.5); .8rem);
        min-width: calc(50% - 3em) !important;

        &.infoWidget {
            min-width: calc(50% - 3em);
        }
    }
}

.windows-mx(@fs; @isPhoneDevice;) {
    .gradientBack {
        .render-popup {
            #ADWidgetsWrapper {
            }
        }

        .k-widget.k-window {
            &.k-window-popup {
                max-width: 85vw !important;
                min-width: 60vw !important;

                &.k-window-maximized {
                    max-width: 100% !important;
                    max-width: 100% !important;
                }
            }
        }
    }

    .win-err-mx() {
        .ADFinish {
            #ADFinishFrame {
                width: initial;
                height: initial;
                max-height: initial;
            }

            div#ADBackground {
                display: none;
            }
        }
    }

    .win-err-mx() when (@isPhoneDevice = 1) {
        .ADFinish {

            #ADFinishFrameContent {
                width: 95%;
                height: 95%;

                #LogoAD, #LogoXRM {
                    zoom: .4;
                }

                #processViewerButton {
                    display: none;
                }

                #Version {
                    zoom: .8;
                }

                #Message {
                    margin: .5rem;
                    max-height: ~"calc(100% - 12rem)";
                    font-size: @fs *.60;

                    .message-title error {
                        font-size: @fs *.60;
                    }

                    .message-detail {
                        font-size: @fs *.52;
                    }
                }

                #Actions {
                    top: 14rem;
                }

                #resumeButton {
                    font-size: @fs *.75;
                }
            }
        }
    }

    .win-err-mx();
}

.reassingPanel-mx() {
    body.ADFinish {
        #ReassingPanel {
            top: initial;
            position: initial;
            right: initial;
        }
    }
}

.phone-mx-hor() {
    form {
        #ADWidgetsWrapper {

            &.Horizontal {

                .AgileDialogsWidget:not(.infoWidget):not(.XRMGrid):not(.ContainerWidget):not(.FrameControl) {

                    .AgileDialogsWidgetCaptionContainer {
                    }

                    .AgileDialogsWidgetControlContainer {
                        fieldset div {
                            width: inherit;
                        }
                    }
                }
            }
        }
    }
}

.phone-mx() {

    @widget-min-height: 15rem;
    @calendar-width: 18rem;
    @calendar-font-size: 1rem;
    @margintop: 2em;

    .body-mx(@font-size-phone);
    /*
    .pageCaption-mx (@font-size-phone) !important;
    .ADWidgetsWrapper-mx(@font-size-phone; 7rem; 1.2em; @font-size-phone; @font-size-phone; 4rem; ~"calc(100% - 4rem)"; 1 );
    .widgetContainer-mx();
    */

    .breadcrumbs-mx(@font-size-phone, 2);
    .hide-centered-mx();
    .fixedDiv-mx(2.7em; 0.4rem 0 0rem 0; 0; scale(1.5));
    .kendo-popups-mx(1.2rem; scale(1.5); scale(1.5); 40rem; scale(1.5); 1);
    .windows-mx(1.5rem, 1);
    .reassingPanel-mx() !important;
    .phone-mx-hor();

    #ADWidgetsWrapper {
        &:not(.Horizontal) {
            .AgileDialogsWidget {
                .AgileDialogsWidgetCaptionContainer {
                }

                .AgileDialogsWidgetControlContainer {
                    min-width: 100% !important;
                }
            }
        }
    }

    .k-widget.k-window.k-window-popup:not(.k-window-maximized) {
        min-width: ~"calc(100% - 3rem)!important";
    }
}

.tablet-mx-hor(@watermark_fs, @description_fs) {

    form {

        #ADWidgetsWrapper {

            &.Horizontal {
                padding-top: 4rem !important;

                .AgileDialogsWidget:not(.infoWidget):not(.XRMGrid):not(.ContainerWidget):not(.FrameControl) {

                    .AgileDialogsWidgetCaptionContainer {
                        .caption-container-responsive-hor-mx(@description_fs, 0);
                    }

                    .AgileDialogsWidgetControlContainer {
                        .control-container-responsive-hor-mx(@watermark_fs, @description_fs, 0);
                    }
                }
            }
        }
    }
}

.tablet-mx() {

    @widget-min-height: auto;
    @calendar-width: 95%;
    @calendar-font-size: 1rem;
    @margintop: 3.5em;

    .body-mx(@font-size-tablet);
    .pageCaption-mx(@font-size-tablet) !important;
    .ADWidgetsWrapper-mx(@font-size-tablet; 1rem; 0.5em; @font-size-tablet; @font-size-tablet; 1.3rem; ~"calc(100% - 1rem)"; 0);
    .widgetContainer-mx();
    .breadcrumbs-mx(@font-size-tablet, 2);
    .hide-centered-mx();
    .fixedDiv-mx(2.7em; 0.5rem 0 0rem 0; 0; scale(1.3));
    .kendo-popups-mx(1.3rem; scale(2); scale(1.5); 34rem; scale(1.3); 0);
    .windows-mx(1.5rem, 0);
    .tablet-mx-hor(@font-size-tablet; @font-size-tablet);

    #ADWidgetsWrapper {
        .AgileDialogsWidget {
            &.ContainerWidget {
                padding: 0 !important;
            }
        }
    }
}

/* Media Queries */  

@media @media-tablet {
    @viewport {
        zoom: 1.0;
        width: extend-to-zoom;
    }    
    .tablet-mx();
}

@media @media-phone {
    @viewport {
        zoom: 1.0;
        width: extend-to-zoom;
    }
    .phone-mx();
}


body.ADFinish {
    margin: 0;
    padding: 0;
    overflow: hidden;



    #ADFinishFrame,
    #ADFinishFrameContent {
        max-width: 45rem;
        width: 80vw;
        height: 80vh;
        max-height: 90%;
        position: sticky;
        
    }

    #ADFinishFrame {
        margin: auto;
        top: 5vh;
        left: 0;
        right:0;
        position:absolute
    }

    #ADFinishFrameContent {
        margin-top:2rem;
        border: solid 5px @widget-frame-color;
        background-color: rgba(255,255,255, 0.2);
        overflow: hidden;
        .finishboxshadow();
        min-height: 100%;
    }

    #LogoAD {
        background: url('@{agiledialogs-images}/logos/ad_01.png?25300.8.0.25300.2050420250612') no-repeat;
        height: 44px;
        width: 304px;
        margin: 18px 0 0 30px;
    }

    #Version {
        font-size: 60%;
        margin: 5px 0 0 70px;

        p {
            margin: 0;
        }
    }

    #Message {
        margin: 2rem 2rem 3rem 2rem;
        font-weight: bold;
        font-size: 1.1em;        
        height: ~"calc(100% - 12rem)";
        overflow-y: auto;
        text-align: center;
        
    }

    #LogoXRM {
        position: absolute;
        background: url('@{agiledialogs-images}/logos/axrm_01.png?25300.8.0.25300.2050420250612') no-repeat;
        height: 30px;
        width: 150px;
        left: 10px;
        bottom: 18px;
        left: 30px;
    }

    #LogoAP {
        position: absolute;
        height: 24px;
        width: 133px;
        right: 23px;
        bottom: 18px;
        right: 30px;
    }


    .completed {
    }

    .suspended {
        color: #BC4B00;
    }

    .other {
    }

    .error {
        color: red;
    }

    .button-close {
        margin: 2em;
    }

    #ReassingPanel {
        
        text-align: center;
        top: ~"calc(100% - 3rem)";
        position:absolute;
        right:1rem;
    }

    & #ADFinishFrameContent.has-buttons {
        height: 360px;
    }
}

// Notify values to runtime
#NoElementID_NotifyValuesToRuntime {
    content: notifyVariableToRuntime("@xrmgrid-row-height", @xrmgrid-row-height);
    content: notifyVariableToRuntime("@font-family", @font-family);
    content: notifyVariableToRuntime("@xrmgrid-min-width", @xrmgrid-min-width);
}
#ADWidgetsWrapper
{ 
    &.designtime{
        margin:1rem;
    }

    .AgileDialogsWidget {

        .hidden {
            background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAMAAAC7IEhfAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAMAUExURQAAAHV1dQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAN+0BjgAAAEAdFJOU////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////wBT9wclAAAACXBIWXMAAA7DAAAOwwHHb6hkAAAAGnRFWHRTb2Z0d2FyZQBQYWludC5ORVQgdjMuNS4xMUfzQjcAAACtSURBVDhP7ZNRDsMgDMXK/Q/dxYlZt6mEHaD+e5Yl+IBjwDnJVWimy1DTdRlq2o5Q03cRajbdODS77grdoPl2M3SD5scZuqFE4IZYFbohN7iBmaEbmIkbchO6IR24oUSEbigXuEFz/Nmd9XoK1f0ZH6FmcZcr1Cy6K9SsuneoWXYz1Kw7Q03TVajpugw1bUeo6bsINZvu+TOQDtxQIkI3lAvcoHn+DNRMNOnGeAHOJNC/TYsN6AAAAABJRU5ErkJggg==') /*../../Images/hiddenWidget-bg.png?25300.8.0.25300.2050420250612*/;
            content: " ";
            height: 100%;
            opacity: 0.1;
            position: absolute;
            width: 100%;
        }

        &.designtime {
            background-color: #F4F4F4;
            min-height: 60px;

            &.ContainerWidget {
                background-color: #FFF2D9;
            }

            &.VariableControlWidget {
                display: block !important;
                visibility: visible !important;

                &::after {
                    content: "";
                    background: url('../images/variableControl.png?25300.8.0.25300.2050420250612') no-repeat;
                    background-size: contain;
                    opacity: 0.3;
                    top: 0;
                    left: 0;
                    bottom: 0;
                    right: 0;
                    position: absolute;
                }
            }

            &.XRMGrid {
                .designtime-preview-disabled {

                    .k-loading-image,
                    .k-loading-color,
                    .k-loading-mask {
                        display: none
                    }

                    .k-grid-content {
                        &:before {
                            padding-top: 2em;
                            content: "Data unavailable at design time";
                            display: block;
                            width: 100%;
                            text-align: center;
                            font-size: 3em;
                        }
                    }
                }
            }

            &.XrmSearchControlWidget {
                display: block !important;
                visibility: visible !important;

                &::after {
                    content: "";
                    background: url('../images/xrmSearchControl.png?25300.8.0.25300.2050420250612') no-repeat;
                    background-size: contain;
                    opacity: 0.3;
                    top: 0;
                    left: 0;
                    bottom: 0;
                    right: 0;
                    position: absolute;
                }
            }

            &.hiddenWidget::before {
                .hidden();
            }

            &.hiddenWidget:hover::before,
            &.hiddenWidget.designtime-selected::before {
                opacity: 0.4;
            }

            &.hiddenWidget {
                opacity: 1;

                .AgileDialogsWidget::before {
                    .hidden();
                }

                .AgileDialogsWidget {
                    opacity: 1;
                }
            }

            .controlname-label {
                background-color: white;
                padding: 0.5em;
                border: 1px solid;
                font-size: 0.8em;
                margin-left: 2em;
                top: 2.5em;
                position: relative;
            }
        }

        &.designtime-selected {
            background-color: #CFCFCF;

            &.ContainerWidget {
                background-color: rgba(156, 139, 43, 0.5);
            }

            &.designtime-invalid,
            &.designtime-invalid-ajax {
                background-color: #f28686 !important;
            }
        }

        &.designtime-invalid,
        &.designtime-invalid-ajax {
            background-color: #FFCFCF !important;
        }

        &.designtime-unselected:hover {
            background-color: #CFCFB7;
            cursor: pointer;

            &.ContainerWidget {
                background-color: #cebd5e;
            }
        }

        .AgileDialogsWidgetControlContainer {

            .k-widget span.k-icon.k-loading {
                padding-left: 7px;
                position: absolute;
                top: 8px;
            }
        }

        .AgileDialogsWidgetControlContainer {
            .CurrencyControlContainer {
                max-width: 260px;
                min-width: 90px;
            }
        }

        .suscriberSpin {
            display: inline-block;
            position: absolute;
            background: url('@{image-folder}/loading.gif') no-repeat;
            height: 16px;
            margin-left: 5px;
            width: 16px;
        }

        .not-avaliable {
            color: red;
            border: solid 1px red;
            padding: 3em;
        }
    }
}/* Customization CSS */
.PowerShellStyle
{
	font-family: "lucida console";
	font-size: 12px;
	background-color: #012456;
	color: #eeedf0 !important;
}

.frontendHeader{
	color:green;	
}

.backendHeader{
	color:blue;
}

.deploymentHeader{
	color:burlywood;
}

.TextAlignToCenter{
     text-align:center;
}

.TextAlignToRight{
     text-align:right;
}

.BigTextControl .questionCaption, .BigTextControl .optionsContainer
{
	font-size:1.3rem !important;
}

@media screen and (min-width: 768px) {
	.Horizontal-checklist-style .AgileDialogsWidgetCaptionContainer
	{
		float:left;
		width:8% !important;
	}

	div.Horizontal-checklist-style fieldset div
	{
		display:inline;
		float:left;
		min-width:10px;
		width:calc((100% / 12)  - 20px);
	}	

	div.Horizontal-checklist-style fieldset div[data-value="9"]
	{
		padding-left: 1%;
	}

	body:not(:-moz-handler-blocked) div.Horizontal-checklist-style fieldset div {
		width:calc((100% / 12)  - 16px);
	}

	body:not(:-moz-handler-blocked) div.Horizontal-checklist-style fieldset div[data-value="5"] {
		padding-left: 1%;
  	}
}

@media screen and (min-width: 768px) and (-webkit-min-device-pixel-ratio:0) { 
	div.Horizontal-checklist-style fieldset div[data-value="5"]{
  		padding-left: 1%;
	}

	div.Horizontal-checklist-style fieldset div[data-value="8"]{		
  		padding-left: 1%;
	}

	div.Horizontal-checklist-style fieldset div[data-value="9"]{		
  		padding-left: 1%;
	}
}

@media screen and (min-width: 1080px) {
	div.Horizontal-checklist-style fieldset div[data-value="1"]
	{
		padding-left: 3%;
	}

	div.Horizontal-checklist-style fieldset div[data-value="3"]
	{
		padding-left: 1%;
	}

	div.Horizontal-checklist-style fieldset div[data-value="6"]
	{
		padding-left: 1%;
	}


	div.Horizontal-checklist-style fieldset div[data-value="8"]
	{
		padding-left: 1%;
	}

	div.Horizontal-checklist-style fieldset div[data-value="9"]
	{
		padding-left: 1%;
	}
}

@media screen and (min-width: 1080px) and (-webkit-min-device-pixel-ratio:0) { 
	div.Horizontal-checklist-style fieldset div[data-value="8"]
	{
		padding-left: 0%;
	}

	div.Horizontal-checklist-style fieldset div[data-value="9"]
	{
		padding-left: 0%;
	}
}

/* Hide remove feedback button */
#feedbackWindow .k-remove-feedback {
    display: none;    
}

#feedbackWindow .k-grid-header-wrap col:nth-child(1), 
#feedbackWindow .k-grid-header-wrap thead th:nth-child(1),
#feedbackWindow .k-grid-content col:nth-child(1), 
#feedbackWindow .k-grid-content tr td:nth-child(1)
{
    display:none;
}

/* Dynamics logo and svg scale */
#ADLogoAD.ADLogo {
    background-image: url(../images/custom/dynamics-logo.png);
	min-width: 264px;
	background-size: cover;
	}
div.AgileDialogsWidgetCaptionContainer > div.questionCaption img[src$=".svg"]	{
	width:100%;
}/* End of Customization CSS */