skinUtils.addSkinTemplate('basic', 'a:link,.link, a:visited { color:{mainColor}; }a:hover, .link:hover,.link.normal:hover,a.normal:hover  { color:{hoverColor};}::selection { background-color: {mainColor}4D; }.OnlyTextTips.remember:after{color:{mainColor}}.Menu{border:none;}.MDITabCaption:hover{color:{mainColor};background-color:#fafafa;}.MDITabCaption.active { color:{mainColor};}.MDITabBar .Button.SpeedButton:hover,.MenuBar .MenuRootActive,.MenuBar .MenuRoot.active,.MenuBar .MenuRoot.Show,.MenuBar .MenuRoot:hover { background-color: {hoverColor}}.Menu .MenuItem:hover,.NormalMenu.Menu .MenuItem:hover {background-color:{hoverColor};color:{fontColor}}.Menu .MenuItem:hover .MenuShortcut { color:{fontColor}; }.Menu .MenuItem.MenuText,.Menu .MenuItem.MenuText:hover .MenuCaption,.RootMenu.Menu .MenuItem.lockIcon .MenuSpacerRight:before{color:{mainColor};}.FormBorder,.Popup.Modal{border-top-color:{mainColor};}.UISkinIcon:hover,.FormCaption .FormCaptionButton:hover{background-color: {hoverColor};}.Popup.p-top,.Popup.p-left,.Popup.p-right,.Popup.p-bottom{border-color:{mainColor};}.Popup.p-top .PopupArrow{border-bottom-color: {mainColor};}.Popup.p-bottom .PopupArrow{border-top-color: {mainColor};}.Popup.p-left .PopupArrow{border-right-color: {mainColor};}.Popup.p-right .PopupArrow{border-left-color: {mainColor};}.Button:hover, .Button.hover,.Button.SecondButton:hover, .Button.SecondButton.hover,.Button.hasRight:hover,.Button.hasRight.ShowDrop,.Buttons .Button:hover{ border-color: {lightColor}; background-color:{lightColor};color:#333;}.Button:active,.Button.BorderButton:active,.Button.SecondButton:active { border-color: {mainColor}; color: {mainColor}; background-color:{lightColor};}.Button .RightIcon { border-color: {hoverColor}; }.Button.hasClick .RightIcon:hover { background-color: {lightColor};color:{mainColor}}.Button.SpeedButton:hover,.SpeedButton.icononly:hover{color:{mainColor};}.Buttons .Button.active{border-color: {mainColor}; background-color: {mainColor};color: #fff;}.Button.SpecialButton.HasLine .RightIcon:after,.Button.SpecialButton.hasClick .RightIcon:hover{background-color: {hoverColor};color:#fff;}.Button.SpecialButton.HasLine .RightIcon:after,.CombEditor .Button.SpecialButton:after {border-color: {hoverColor};}.Button.SpecialButton.HasLine .RightIcon {background-color: {mainColor};}.SwitchButton.checked { background-color: {mainColor} }.SwitchButton.checked.disabled { background-color: {lightColor}; }.Normal.Buttons .Button.active:after {border-color: transparent transparent {mainColor} transparent;}.TabNormal.Buttons .Button.active,.TabNormal.Buttons .Button:hover,.Border.Buttons .Button.active,.Normal.Buttons .Button.active { border-color: {mainColor};color:{mainColor}}.EditBlock .SkinButton:hover { color: {mainColor}; }.Button.SpecialButton.rightHover.HasLine,.Grid .Button.SpecialButton,.Button.SpecialButton{background-color: {mainColor}; border-color:{mainColor};color:#fff;}.Grid .Button.SpecialButton:hover,.Button.SpecialButton:hover,.Button.SpecialButton.hover, .Button.SpecialButton:active {background-color: {hoverColor}; border-color: {hoverColor};color:#fff;}.Button.SpecialButton.ShowDrop{background-color: {mainColor}; border-color: {mainColor};color:#fff;}.ShowDrop .ArrowCombo:before, .ShowPopup .ArrowCombo:before{color:{mainColor};}.Edit.hover,.Edit:hover,.TextArea:hover,.EditBlock:hover .SkinButton,.EditBlock:hover .Edit,.EditBlock:hover .SkinButtonBlock,.TextEdit:focus,.TextArea:focus,.EditBlock.active .SkinButton,.EditBlock.active .Edit,.EditBlock.active .SkinButtonBlock { border-color: {mainColor};}.TreeView .Buttons .Button:hover { background-color: {mainColor};}.LayoutGroupCaption:before,.FlexBlock .FlexCaption .text:before,.FlowPanel .FlowCaption:before{background-color:{mainColor};}.DropItem.selected,.TreeNode.selected,.TreeView.ShowLine .TreeNode.selected,.TreeTitle:hover,.CheckBoxListPopup .VertItem:hover, .TreeView .TreeNode:hover{color:{mainColor}; background-color:{lightColor}}.TreeNode .EditorBlock .SkinButton:hover{background-color: {mainColor};}.TreeNode .EditorBlock{background-color:{lightColor} }.TabHeader .TabCaption.active,.TabHeader .TabCaption:hover{ color:{mainColor};}.PageControl.MaxTab2>.TabHeader .TabCaption.active {background-color: {mainColor};border-color: {mainColor}}.PageControl.MaxTab>.TabHeader .TabCaption.active {color: {mainColor};border-color: {mainColor};}.CellIcons div:hover,.Grid .GridDynamicButtonBody .aicon:hover,.Grid .SkinButton:hover { color: {mainColor}; }.Grid .activeEditor { border-color:{mainColor};  box-shadow: 0 0 2px 1px {hoverColor};}.Grid .GridBodyRow.hover >td,.Grid .GridBodyRow:hover >td,.GridBlock.NoBorder .GridBodyRow:hover >td{ background-color:{lightColor};}.ColorPopup .Title,.TreeView .Buttons{background-color: {lightColor};}.Grid .LinkColumn,.Grid .GridDynamicButtonBody a,.Grid .GridDynamicButtonBody a:link,.Grid .GridDynamicButtonBody a:visited { color: {mainColor}; }.Grid .LinkColumn:hover,.Grid .GridDynamicButtonBody a:hover { color: {hoverColor}; }.GridDynamicButtonBody.Normal a:hover { background-color: {mainColor}; color:#fff; }.Grid .IconRight .GridHeaderCaptionText:hover:before{color:{mainColor};}.CalendarMain .DayCell.selected { background-color: {mainColor}; }.CalendarRange .CalendarMain .DayCell.mtCurr:hover,.CalendarMain .DayCell:hover { background-color: {mainColor};}.CalendarRange .CalendarMain .DayCell.inRange{background-color: {lightColor};}.CalendarRange .CalendarMain .DayCell.start, .CalendarRange .CalendarMain .DayCell.end {background-color: {mainColor};}.CalendarMain .CalendarTitle span:hover,.MonthPopup ._td:hover { color: {mainColor}; }.CalendarMain .TodayButton:hover{background-color: {mainColor};}.MonthPopup ._td.selected{background-color: {mainColor}; color:{fontColor};}.CalculatorPopup .ctorRight>*,.CalculatorPopup .Btn.opt{color:{mainColor};}.CalculatorPopup .Btn.equalsign{background-color:{mainColor};color:{fontColor};}.CalculatorPopup .Btn:hover{background-color:{mainColor};color:{fontColor};}.NavBar .NBGroupHeader:hover { color: {mainColor}; background-color: {lightColor}; }.ChkBoxStyle:hover:before{border-color:{mainColor};}.ChkBoxStyle.checked:before { background-color: {mainColor}; border-color:{mainColor};}.ChkBoxStyle.checked.disabled:before{ color:{mainColor};}.ChkBoxStyle.half:before{ border-color:{mainColor};color:{mainColor};background-color:#fff;}.RadioButtonList .ChkBoxStyle.checked:before, .RadioButton.ChkBoxStyle.checked:before { border-color:{mainColor};}.RadioButtonList .ChkBoxStyle.checked.disabled:before, .RadioButton.ChkBoxStyle.checked.disabled:before { background-color:{mainColor};}.HomeMenu {background-color: {mainColor};}.Workflow.Radius .WorkItem.HasNext,.Workflow.Radius .WorkItem.HasPrev{background-color:{mainColor} ;border-color:{mainColor}}.Workflow .WorkResizer .Add{color:{mainColor};border-color: {mainColor};}.Workflow .WorkResizer .Add:hover{background-color: {hoverColor};color:#fff;}.Workflow .WorkResizer .FResizer,.Workflow .WorkItem .WorkResizer{border-color:{mainColor};}.Wholesale .Workflow .WorkItem:hover{background-color: {mainColor};}.RetailPage .Workflow .WorkItem:hover:before { background-color: {mainColor}; }.RetailPage .Workflow .WorkItem:hover { color: {mainColor}; }.CheckBox.Border:hover,.CheckBoxList.Border .ChkBoxStyle:hover,.CheckBoxList.Border .ChkBoxStyle.checked {border-color: {mainColor};}.LeftButtons.Buttons .Button:hover,.LeftButtons.Buttons .Button.active{color:{mainColor};}.Button.BorderButton{border-color: {mainColor};color:{mainColor}}.Button.BorderButton:hover { border-color: {mainColor}; color: {mainColor}; background-color:{lightColor}; }.Button.BorderButton.active{border-color:{mainColor}}.Button.SpeedButton.BorderButton:hover,.Button.BorderButton.NoBorder:hover{color:{hoverColor};}.ButtonEdit.Buttons .Button {background-color: {lightColor};color: {mainColor};border-color: {mainColor};}.ButtonEdit.Buttons .Button:hover{background-color:{hoverColor};color: #fff }.ListGrid .GridBodyRow.active .GridBodyCell:first-child {border-left-color: {mainColor};}.ListGrid .GridBodyRow:hover .GridBodyCell{color:{mainColor};}.Pager .PagerButton.active,.Pager .PagerButton:hover{color:{mainColor};border-color:{mainColor}}.TipBox,.TipBox:before,.TipBox:after{border-color:{mainColor};}.TipBox{box-shadow: 3px 4px 2px 4px {lightColor};}.ProgressBar { background-color: {hoverColor}4D; }.ProgressBar .ProgressValue {  background-image: linear-gradient(90deg, {mainColor} 0%, {hoverColor} 100%);}.ProgressBar.hasItems .Item.active{color:{mainColor};}.ProgressBar.hasItems .Item.active:before{background-color: {mainColor};border-color:{mainColor};}.Grid .ProgressBar .ProgressValue{background-color: {mainColor};}.ButtonEdit.Buttons .Button span:hover{color:{mainColor};}.MoreColumn .GridHeaderCaptionText{color:{mainColor};}.Grid .GridBodyRow:hover .DefaultEditor.GridBodyCell { box-shadow: inset 0 0 0 1px {mainColor};}.Grid .RowNoConfigIcon:hover { color: {mainColor}; }.Popup.Step .Bottom .Label:hover{color:{mainColor}}.Grid .GridHeaderBar .GridHeader .GridHeaderCaption.focus{border-color:{mainColor}; background-color: {mainColor};color:#fff;}.Grid .GridFilterBar .GridFilterBlock.focus,.Grid .GridHeaderBar .GridHeader .GridHeaderCaption.focus,.Grid .GridBody .GridBodyCell.focus{border-left: 1px solid {mainColor}; border-right: 1px solid {mainColor};}.Grid .GridBody .GridBodyRow:last-child .GridBodyCell.focus{border-bottom:1px solid {mainColor};}.PageControl.TabVert > .TabHeader .TabCaption.active{background-color:{mainColor};border-color:{mainColor};}.RadioView .UI_ListItem:hover{border-color: {mainColor};}.RadioView .UI_ListItem.active{background: {lightColor};border-color:{mainColor}}.RadioView .UI_ListItem.active .icon{color:{mainColor}}.DragGroups .CurDrop{box-shadow:0 0 5px {lightColor}; }.DragSpacer{border-left-color:{mainColor};}.DropStyle, .TreeBlock.DropStyle, .GridBlock.DropStyle{box-shadow: 0 0 8px {lightColor};}.SkinColor, .SkinColorIcon:before{color:{mainColor} !important;}.SkinColor:hover,.SkinColorHover:hover{color: {mainColor} !important}.SkinLightBg,.SkinLightBgHover:hover{background-color:{lightColor} !important;}.SkinBorder,.SkinBorderHover:hover{border-color:{mainColor} !important;}.SkinBg,.SkinBgHover:hover{background-color:{mainColor} !important;}.TimePopup .TimeBody .item.selected,.TimePopup .TimeBody .item:hover{background-color:{lightColor};}.TimePopup .TimeBody .item.selected{color:{mainColor};}.CalendarMain .DayCell.Today{border-color: {mainColor}}.CalendarMain .TodayButton{color:{mainColor};}.WorkChart .WorkChartItem:hover{background-color:{hoverColor};border-color: {hoverColor};color: #fff}.MonthPopup .YearArrowRow .DateArrow:hover{background-color:{hoverColor};}.Popup.Step .StepNums .item.cur{background-color:{mainColor};}.MDITabCaption.active.homeIcon:before,.NoBorder.Buttons .Button:hover, .NoBorder.Buttons .Button.active{color:{mainColor}}.CalendarRange .RangeDay,.CalendarRange .LeftButtons .Button:hover{color:{mainColor};}.NormalList .UI_ListView .UI_ListItem:hover,.NormalList .UI_ListView .UI_ListItem.active {background-color:{lightColor}; color: {mainColor}}@keyframes bgcolor-animation {0% {color: #333;}50% {color: {mainColor}}100% {color: #333;}10%,90% {transform: translate3d(-2px, 0, 0);}20%,80% {transform: translate3d(+3px, 0, 0);}30%,70% {transform: translate3d(-6px, 0, 0);}40%,60% {transform: translate3d(+6px, 0, 0);}50% {transform: translate3d(-6px, 0, 0);}}.Pager_refresh:before{color:{mainColor}}.ProgressBar.hasItems.hasText.hasClick .Item:hover {color: {mainColor};}.TreeBlock.hasTool.NoBorder .TreeToolBar .Button:hover:before{color:{mainColor};}.PageControl.TabCenter>.TabHeader .TabCaption.active{background-color: {mainColor};}.PageControl.TabCenter.TabNumber>.TabHeader .TabCaption.active:before {color:{mainColor};}.Buttons.Group .Button.active {border-color: {mainColor};color: {mainColor}}.ShowDrop .ArrowCombo:before,.ShowPopup .ArrowCombo:before,.ShowPopup.ArrowCombo:before {color: {mainColor};}.TileContainer>.ChildrenBlock .selected::before { background-color: {mainColor};}.Grid .GridDynamicButtonBody.NormalText a:hover {color: {mainColor};}.Buttons .Button.active.disabled {background-color: {mainColor} !important;border-color: {mainColor} !important;}.ProgressCircle .progress-circle-value {  stroke: {mainColor};}.GridBodyRow[selected="true"],.GridBodyRow[selected="true"] .GridBodyRowNoCell {background-color: {lightColor};}.UI_ListView .UI_ListItem.selected {border-color: {mainColor};background-color: {lightColor};}.FormCaption {background-color:{mainColor};}.Button.SpecialButton.ShowDrop, .Button.SpecialButton.ShowDrop .RightIcon {background-color: {mainColor};border-color: {mainColor};}.Grid .GridHeaderBar,.Grid .ActiveColumn {background-color: rgba({rgb_mainColor}, 0.1);}.ButtonView .UI_ListItem:hover,.ButtonView .UI_ListItem.selected {border-color: {mainColor} !important;}.ButtonView .UI_ListItem.selected:after {border-color: transparent transparent {mainColor} transparent;}.Splitter{color:{mainColor}}.HSplitter .Shape {background: linear-gradient(180deg, {lightColor} 0%, #FFFFFF 100%);}.VSplitter .Shape {background: linear-gradient(-90deg, {lightColor} 0%, #FFFFFF 100%);}.Splitter .Shape:hover {background-image: none;background-color:{mainColor};border-color: {mainColor};}.Splitter.hover, .Splitter:hover{border-color: {mainColor};}.Grid .RowButtons .RowBtn {color:{mainColor};}.Grid .RowButtons .RowBtn:hover {background-color:{mainColor};}.TreeDragLine{background-color: {mainColor};}.TreeDragLine:before {border-left-color: {mainColor};}.TreeNode.dragChild {box-shadow: inset 0 0 0 1px {mainColor}}.HSplitter.noShape:hover .Shape {border-color: {mainColor};}.Button.SpecialButton.HasLine:hover .RightIcon:after {border-color: {hoverColor};}.Button.NormalLine:hover .RightIcon {border-left-color: {mainColor};}.Button.NormalLine.rightHover .RightIcon:hover {border-color: {mainColor};}.TextEdit:focus,.TextArea:focus,.EditBlock.active {box-shadow: 0 0 0 2px rgba({rgb_mainColor}, 0.1);}.globalLeftBtns.Buttons .Button.active {color: {mainColor}}.ListBlockItem .UI_ListItem {background: linear-gradient(180deg, {lightColor} 0%, #fff 100%);}.Button.HintButton {color: {mainColor};}.Button.HintButton:active,.Button.HintButton:hover {border-color: {mainColor}; color: {mainColor}; background-color:{lightColor};}.ChkBoxStyle.checked:hover:before {box-shadow: 0 0 0 2px {lightColor};}.CalendarMain .WeekRow{background-color: {mainColor};}');