-
-
Save floydpink/56a9c96c1019cf7a247e124544ac067b to your computer and use it in GitHub Desktop.
Aurelia Validation Demo
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- | |
| __ __ _ _ _ _ _ _____ _ | |
| \ \ / / | (_) | | | | (_) / ____| | | |
| \ \ / /_ _| |_ __| | __ _| |_ _ ___ _ __ | | | |__ __ _ _ __ __ _ ___ ___ | |
| \ \/ / _` | | |/ _` |/ _` | __| |/ _ \| '_ \ | | | '_ \ / _` | '_ \ / _` |/ _ \/ __| | |
| \ / (_| | | | (_| | (_| | |_| | (_) | | | | | |____| | | | (_| | | | | (_| | __/\__ \ | |
| \/ \__,_|_|_|\__,_|\__,_|\__|_|\___/|_| |_| \_____|_| |_|\__,_|_| |_|\__, |\___||___/ | |
| __/ | | |
| |___/ | |
| see official docs: http://aurelia.io/hub.html#/doc/article/aurelia/validation/latest/validation-basics/1 | |
| Upgrade Steps | |
| ------------- | |
| 1) Replace aurelia-validation injection with armature-validation injection (see new-style-form.js) | |
| In actual practice you will use | |
| import {ArmatureValidation, ValidationRules} from 'armature-validation'; | |
| 2) Inject ValidationRules (see new-style-form.js) | |
| 3) Replace string based fluid syntax with property access functions on ValidationRules (see new-style-form.js) | |
| 4) Remove validate.bind from the form element (see new-style-form.html) | |
| 5) Add form component class names (see new-style-form.html) | |
| 6) Add '& validate' to value bindings on form (see new-style-form.html) | |
| 7) Trust me this is going to be way better :) | |
| --> | |
| <template> | |
| <require from="./new-style-form"></require> | |
| <new-style-form></new-style-form> | |
| </template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| export class App { | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import { | |
| ValidationRenderer, | |
| RenderInstruction, | |
| ValidateResult | |
| } from 'aurelia-validation'; | |
| export class ArmatureFormRenderer { | |
| render(instruction) { | |
| for (let { result, elements } of instruction.unrender) { | |
| for (let element of elements) { | |
| this.remove(element, result); | |
| } | |
| } | |
| for (let { result, elements } of instruction.render) { | |
| for (let element of elements) { | |
| this.add(element, result); | |
| } | |
| } | |
| } | |
| add(element, result) { | |
| if (result.valid) { | |
| return; | |
| } | |
| const formGroup = element.closest('.form-group'); | |
| if (!formGroup) { | |
| return; | |
| } | |
| // add the has-error class to the enclosing form-group div | |
| formGroup.classList.add('has-error'); | |
| // add the has-warning class to the control in question | |
| const formControl = element.closest('.form-control'); | |
| if( formControl ) { | |
| formControl.classList.add('has-warning'); | |
| } | |
| // add help-block | |
| const message = document.createElement('span'); | |
| message.className = 'help-block validation-message error-message-validation'; | |
| message.textContent = result.message; | |
| message.id = `validation-message-${result.id}`; | |
| formGroup.appendChild(message); | |
| } | |
| remove(element, result) { | |
| if (result.valid) { | |
| return; | |
| } | |
| const formGroup = element.closest('.form-group'); | |
| if (!formGroup) { | |
| return; | |
| } | |
| const formControl = element.closest('.form-control'); | |
| if( formControl ) { | |
| formControl.classList.remove('has-warning'); | |
| } | |
| // remove help-block | |
| const message = formGroup.querySelector(`#validation-message-${result.id}`); | |
| if (message) { | |
| formGroup.removeChild(message); | |
| // remove the has-error class from the enclosing form-group div | |
| if (formGroup.querySelectorAll('.help-block.validation-message').length === 0) { | |
| formGroup.classList.remove('has-error'); | |
| } | |
| } | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import {inject, transient} from 'aurelia-framework'; | |
| import { | |
| ValidationControllerFactory, | |
| ValidationController, | |
| ValidationRules | |
| } from 'aurelia-validation'; | |
| import {ArmatureFormRenderer} from './armature-form-renderer'; | |
| /* | |
| * The ArmatureValidationController removes a couple of lines of ceremony | |
| * from the validation preparation process. Simply inject, set up rules | |
| * and call validate() | |
| */ | |
| @transient() | |
| @inject(ValidationControllerFactory) | |
| export class ArmatureValidation { | |
| constructor( controllerFactory ) { | |
| this.controller = controllerFactory.createForCurrentScope(); | |
| this.controller.addRenderer(new ArmatureFormRenderer()); | |
| } | |
| validate( context ) { | |
| return new Promise( (res, rej) => { | |
| this.controller.validate( context ? context : undefined ) | |
| .then( validationResult => { | |
| if( validationResult.valid ) { | |
| res( validationResult ); | |
| } else { | |
| rej( validationResult ); | |
| } | |
| }, err => { | |
| rej( err ); | |
| }); | |
| }); | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <title>Aurelia - Validation</title> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <style> | |
| new-style-form { | |
| display: block; | |
| max-width: 300px; | |
| margin-left: auto; | |
| margin-right: auto; | |
| } | |
| .col-group{padding:0;clear:both}.col-group:after{display:table;clear:both;content:" "}.col-group .col-group{padding:0}.col-group [class*=col-]{min-height:1px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.col-mb-11{width:91.66666667%;float:left}.col-mb-10{width:83.33333333%;float:left}.col-mb-9{width:75%;float:left}.col-mb-8{width:66.66666667%;float:left}.col-mb-7{width:58.33333333%;float:left;padding-right:0}.col-mb-6{width:50%;float:left;padding-left:0}.col-mb-5{width:41.66666667%;float:left}.col-mb-4{width:33.33333333%;float:left}.col-mb-3{width:25%;float:left}.col-mb-2{width:16.66666667%;float:left}.col-mb-1{width:8.33333333%;float:left}@media (min-width:768px){.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-8,.col-9{padding-left:0;padding-right:0;float:left}.container{max-width:768px;margin:0 auto}.col-12{width:100%}.col-11{width:91.66666667%}.col-10{width:83.33333333%}.col-9{width:75%}.col-8{width:66.66666667%}.col-7{padding-left:0;padding-right:0;width:58.33333333%;float:left}.col-6{width:50%}.col-5{width:41.66666667%}.col-4{width:33.33333333%}.col-3{width:25%}.col-2{width:16.66666667%}.col-1{width:8.33333333%}.col-offset-12{margin-left:100%}.col-offset-11{margin-left:91.66666667%}.col-offset-10{margin-left:83.33333333%}.col-offset-9{margin-left:75%}.col-offset-8{margin-left:66.66666667%}.col-offset-7{margin-left:58.33333333%}.col-offset-6{margin-left:50%}.col-offset-5{margin-left:41.66666667%}.col-offset-4{margin-left:33.33333333%}.col-offset-3{margin-left:25%}.col-offset-2{margin-left:16.66666667%}.col-offset-1{margin-left:8.33333333%}.col-group,.col-offset-0{margin-left:0}.col-pull-12{right:100%}.col-pull-11{right:91.66666667%}.col-pull-10{right:83.33333333%}.col-pull-9{right:75%}.col-pull-8{right:66.66666667%}.col-pull-7{right:58.33333333%}.col-pull-6{right:50%}.col-pull-5{right:41.66666667%}.col-pull-4{right:33.33333333%}.col-pull-3{right:25%}.col-pull-2{right:16.66666667%}.col-pull-1{right:8.33333333%}.col-pull-0{right:0}.col-push-12{left:100%}.col-push-11{left:91.66666667%}.col-push-10{left:83.33333333%}.col-push-9{left:75%}.col-push-8{left:66.66666667%}.col-push-7{left:58.33333333%}.col-push-6{left:50%}.col-push-5{left:41.66666667%}.col-push-4{left:33.33333333%}.col-push-3{left:25%}.col-push-2{left:16.66666667%}.col-push-1{left:8.33333333%}.col-push-0{left:0}.col-group{margin-right:0;padding:0;clear:both}.col-group:after{display:table;clear:both;content:" "}}@media (min-width:992px){.col-dt-1,.col-dt-10,.col-dt-11,.col-dt-12,.col-dt-2,.col-dt-3,.col-dt-4,.col-dt-5,.col-dt-6,.col-dt-8,.col-dt-9{padding-left:0;padding-right:0;float:left}.container{max-width:992px;margin:0 auto}.col-dt-12{width:100%}.col-dt-11{width:91.66666667%}.col-dt-10{width:83.33333333%}.col-dt-9{width:75%}.col-dt-8{width:66.66666667%}.col-dt-7{padding-left:0;padding-right:0;width:58.33333333%;float:left}.col-dt-6{width:50%}.col-dt-5{width:41.66666667%}.col-dt-4{width:33.33333333%}.col-dt-3{width:25%}.col-dt-2{width:16.66666667%}.col-dt-1{width:8.33333333%}.col-dt-offset-12{margin-left:100%}.col-dt-offset-11{margin-left:91.66666667%}.col-dt-offset-10{margin-left:83.33333333%}.col-dt-offset-9{margin-left:75%}.col-dt-offset-8{margin-left:66.66666667%}.col-dt-offset-7{margin-left:58.33333333%}.col-dt-offset-6{margin-left:50%}.col-dt-offset-5{margin-left:41.66666667%}.col-dt-offset-4{margin-left:33.33333333%}.col-dt-offset-3{margin-left:25%}.col-dt-offset-2{margin-left:16.66666667%}.col-dt-offset-1{margin-left:8.33333333%}.col-dt-offset-0{margin-left:0}.col-dt-pull-12{right:100%}.col-dt-pull-11{right:91.66666667%}.col-dt-pull-10{right:83.33333333%}.col-dt-pull-9{right:75%}.col-dt-pull-8{right:66.66666667%}.col-dt-pull-7{right:58.33333333%}.col-dt-pull-6{right:50%}.col-dt-pull-5{right:41.66666667%}.col-dt-pull-4{right:33.33333333%}.col-dt-pull-3{right:25%}.col-dt-pull-2{right:16.66666667%}.col-dt-pull-1{right:8.33333333%}.col-dt-pull-0{right:0}.col-dt-push-12{left:100%}.col-dt-push-11{left:91.66666667%}.col-dt-push-10{left:83.33333333%}.col-dt-push-9{left:75%}.col-dt-push-8{left:66.66666667%}.col-dt-push-7{left:58.33333333%}.col-dt-push-6{left:50%}.col-dt-push-5{left:41.66666667%}.col-dt-push-4{left:33.33333333%}.col-dt-push-3{left:25%}.col-dt-push-2{left:16.66666667%}.col-dt-push-1{left:8.33333333%}.col-dt-push-0{left:0}}@media (min-width:1200px){.col-ld-1,.col-ld-10,.col-ld-11,.col-ld-12,.col-ld-2,.col-ld-3,.col-ld-4,.col-ld-5,.col-ld-6,.col-ld-8,.col-ld-9{padding-left:0;padding-right:0;float:left}.container{max-width:1200px;margin:0 auto}.col-ld-12{width:100%}.col-ld-11{width:91.66666667%}.col-ld-10{width:83.33333333%}.col-ld-9{width:75%}.col-ld-8{width:66.66666667%}.col-ld-7{padding-left:0;padding-right:0;width:58.33333333%;float:left}.col-ld-6{width:50%}.col-ld-5{width:41.66666667%}.col-ld-4{width:33.33333333%}.col-ld-3{width:25%}.col-ld-2{width:16.66666667%}.col-ld-1{width:8.33333333%}.col-ld-offset-12{margin-left:100%}.col-ld-offset-11{margin-left:91.66666667%}.col-ld-offset-10{margin-left:83.33333333%}.col-ld-offset-9{margin-left:75%}.col-ld-offset-8{margin-left:66.66666667%}.col-ld-offset-7{margin-left:58.33333333%}.col-ld-offset-6{margin-left:50%}.col-ld-offset-5{margin-left:41.66666667%}.col-ld-offset-4{margin-left:33.33333333%}.col-ld-offset-3{margin-left:25%}.col-ld-offset-2{margin-left:16.66666667%}.col-ld-offset-1{margin-left:8.33333333%}.col-ld-offset-0{margin-left:0}.col-ld-pull-12{right:100%}.col-ld-pull-11{right:91.66666667%}.col-ld-pull-10{right:83.33333333%}.col-ld-pull-9{right:75%}.col-ld-pull-8{right:66.66666667%}.col-ld-pull-7{right:58.33333333%}.col-ld-pull-6{right:50%}.col-ld-pull-5{right:41.66666667%}.col-ld-pull-4{right:33.33333333%}.col-ld-pull-3{right:25%}.col-ld-pull-2{right:16.66666667%}.col-ld-pull-1{right:8.33333333%}.col-ld-pull-0{right:0}.col-ld-push-12{left:100%}.col-ld-push-11{left:91.66666667%}.col-ld-push-10{left:83.33333333%}.col-ld-push-9{left:75%}.col-ld-push-8{left:66.66666667%}.col-ld-push-7{left:58.33333333%}.col-ld-push-6{left:50%}.col-ld-push-5{left:41.66666667%}.col-ld-push-4{left:33.33333333%}.col-ld-push-3{left:25%}.col-ld-push-2{left:16.66666667%}.col-ld-push-1{left:8.33333333%}.col-ld-push-0{left:0}}.col-fixed-hd:before,.col-fixed-landscape:before,.col-fixed-portrait:before,.col-fixed-square:before{content:"";display:block}.col-fixed-hd .col-content,.col-fixed-landscape .col-content,.col-fixed-portrait .col-content,.col-fixed-square .col-content{position:absolute;top:0;right:0;bottom:0;left:0;padding:0}.col-fixed-hd:before{margin-top:56.25%}.col-fixed-landscape:before{margin-top:75%}.col-fixed-square:before{margin-top:100%}.col-fixed-portrait:before{margin-top:133.33333333%}.center-block{margin:0 auto}.clear:after{display:table;clear:both;content:" "}.font-bigger,.gray-badge,.list-inline>li,.outline-badge{display:inline-block}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{font-family:inherit;font-weight:500;line-height:1.4;color:inherit;margin:5px 0}.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small,h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small{font-weight:400;line-height:1}.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small{font-size:65%}.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small{font-size:75%}.h1,h1{font-size:22px}.h2,h2{font-size:20px}.h3,h3{font-size:18px}.h4,h4{font-size:16px}.h5,h5{font-size:13px}.h6,h6{font-size:12px}p{margin:0 0 12px}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}.text-justify{text-align:justify}.text-nowrap{white-space:nowrap}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}a{color:#3498db;text-decoration:none}.actions-text a:hover,.auth-container a:hover,.flex-layout .checkbox-row a:hover,.flex-layout .header-row a:hover,.flex-layout .instance-row a:hover,.flex-layout .item-row a:hover,.item-menu-hz>span a:hover,.listing-icon-links>li>a:hover,header.header-layout .user-profile-container .dropdown-button .dropdown-button-menu a:hover{text-decoration:underline}a:hover{color:underline}.list-unstyled{list-style:none}.list-inline{list-style:none;margin-left:-5px}.list-inline>li{padding-left:5px;padding-right:5px}.light-weight{font-weight:400}.normal-weight{font-weight:500}.semi-bold{font-weight:600}.bold{font-weight:700}.extra-bold{font-weight:800}.font-bigger{font-size:14px;line-height:21px}pre.wrap{white-space:pre-wrap}pre.not-fixed-width{font-family:inherit}.gray-badge{font-weight:600;background-color:#f0f2f5;font-size:80%;padding:5px 8px;border-radius:3px;margin-right:5px}.outline-badge{font-weight:500;padding:7px;font-size:14px;border-radius:4px;line-height:17px;border:2px solid #6a809b;margin-right:10px}.outline-badge.outline-badge-assigned{border-color:#757575;color:#757575}.outline-badge.outline-badge-pending{border-color:#8D6E63;color:#8D6E63}.outline-badge.outline-badge-resolved{border-color:#43A047;color:#43A047}header.header-layout{position:fixed;top:0;left:0;min-height:50px;min-width:350px;width:100%;z-index:1005;background-color:#8BC34A}header.header-layout>a{float:left}header.header-layout:after{content:"";display:table;clear:both}header.header-layout .header-logo{background:url(images/36px_white_blk.png) no-repeat;width:185px;height:50px;background-position-x:10px;background-position-y:5px;margin:0 15px 0 0}@media only screen and (min-width:1px) and (max-width:949px){header.header-layout .header-logo{width:55px}}header.header-layout .user-profile-container{margin:3px 10px 0 0;float:right}.card-listing>li,.component-list-item .item-actions,.item-listing .with-icon-marker>div:first-child{float:left}header.header-layout .user-profile-container .dropdown-button>button{text-align:center;background-color:#f6f8f9;padding:0;border-radius:50%;width:40px;height:40px;border:none}.flex-layout .header-row,.flex-layout.line-separated>.item-row,.subheader-layout{border-bottom:1px solid #dee3e9}header.header-layout .user-profile-container .dropdown-button>button i{color:#899aaf;margin-right:1px;vertical-align:top;line-height:40px;font-size:10px}header.header-layout .user-profile-container .dropdown-button>button i:first-child{font-size:18px}header.header-layout .user-profile-container .dropdown-button>button:hover{background-color:#fff}header.header-layout .user-profile-container .dropdown-button>button:hover i{background-color:transparent;color:#6a809b}header.header-layout .user-profile-container .dropdown-button .dropdown-button-menu{border-radius:4px;background-color:#fff;z-index:1003}header.header-layout .user-profile-container .dropdown-button .dropdown-button-menu label{margin-bottom:1px}header.header-layout .user-profile-container .dropdown-button .dropdown-button-menu a{font-size:11px}header.header-layout .user-profile-container .dropdown-button .dropdown-button-menu .profile-menu-item{padding:10px}header.header-layout .user-profile-container .dropdown-button .dropdown-button-menu .customer-menu-item{padding:10px;border-top:2px solid #dee3e9}@media only screen and (max-width:529px){header.header-layout .search-component{width:150px}}header.header-layout.org-layout-header{background:#37474f;background:-webkit-linear-gradient(left,#37474f 0,#546e7a 48%,#455a64 100%);background:-o-linear-gradient(left,#37474f 0,#546e7a 48%,#455a64 100%);background:linear-gradient(to right,#37474f 0,#546e7a 48%,#455a64 100%)}header.header-layout.person-layout-header{background:#0288d1;background:-webkit-linear-gradient(#0288d1 0,#039be5 100%);background:-o-linear-gradient(#0288d1 0,#039be5 100%);background:linear-gradient(#0288d1 0,#039be5 100%)}.sidebar,.subheader-layout{position:fixed;background-color:#fff}.subheader-layout{left:0;right:0;padding:0 15px;border-left:1px solid #dee3e9;height:40px;z-index:1003}.with-sidebar .subheader-layout{left:165px}@media only screen and (min-width:1px) and (max-width:949px){.with-sidebar .layout-container{margin-left:45px}.with-sidebar .subheader-layout{left:45px}}.breadcrumbs,breadcrumbs{display:inline-block;vertical-align:middle;line-height:40px}.breadcrumbs ul,breadcrumbs ul{list-style:none;padding:0;margin:0}.breadcrumbs ul.indent-5>li,breadcrumbs ul.indent-5>li{padding-left:5px}.breadcrumbs ul li,breadcrumbs ul li{display:inline-block;font-size:11px;margin:0;text-transform:uppercase}.breadcrumbs ul li label,breadcrumbs ul li label{margin-bottom:0}.breadcrumbs ul li>a:after,breadcrumbs ul li>a:after{display:inline-block;margin:0 5px;content:'/'}.breadcrumbs ul:after,.component-list-item:after,.item-listing>li:after,breadcrumbs ul:after{content:"";clear:both}.breadcrumbs ul:after,breadcrumbs ul:after{display:table}.layout-switcher-container{padding-top:10px}.layout-switcher-container .dropdown-button button{font-size:11px;font-weight:600;text-transform:uppercase;text-align:right}.sidebar{display:inline-block;height:100%;padding-top:50px;color:#6a809b;width:165px;font-size:11px;left:0;z-index:1004}@media only screen and (min-width:1px) and (max-width:949px){.sidebar{width:45px}}.sidebar-menu{list-style:none;padding:0;margin:0}.sidebar-menu.indent-5>li{padding-left:5px}.sidebar-menu>li{position:relative;margin:0 0 0 1px;border-left:4px solid #fff;border-radius:2px;overflow:hidden}.sidebar-menu>li a{display:inline-block;width:100%;padding:10px 15px;font-size:11px;color:#899aaf;text-transform:uppercase}.sidebar-menu>li a i{display:inline-block;margin-right:5px}.sidebar-menu>li:hover{color:#6a809b;border-left:4px solid #f0f2f5;background-color:#f6f8f9}.sidebar-menu>li.selected{border-left:4px solid #8BC34A;background-color:#f0f2f5;font-weight:600}.sidebar-menu>li.selected a{color:#6a809b}@media only screen and (min-width:1px) and (max-width:949px){.sidebar-menu>li a span{display:none}}.sidebar-menu-child-menu{list-style:none;padding:0;margin:0}.sidebar-menu-child-menu.indent-5>li{padding-left:5px}.flex-nowrap,.flex-wrap{-webkit-flex-wrap:wrap;-moz-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.flex-layout{display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:-ms-flex;display:flex;width:100%;-webkit-flex-flow:row wrap;-moz-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap}.flex-layout .checkbox-row,.flex-layout .header-row,.flex-layout .instance-row,.flex-layout .item-row{position:relative;padding:0;width:100%;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:-ms-flex;display:flex}.flex-layout .checkbox-row>div.padded,.flex-layout .header-row>div.padded,.flex-layout .instance-row>div.padded,.flex-layout .item-row>div.padded{padding:5px 10px 5px 0}.flex-layout .checkbox-row>div.inset,.flex-layout .header-row>div.inset,.flex-layout .instance-row>div.inset,.flex-layout .item-row>div.inset{padding:2px}.flex-layout .checkbox-row .icon-marker,.flex-layout .header-row .icon-marker,.flex-layout .instance-row .icon-marker,.flex-layout .item-row .icon-marker{color:#a7b4c4;text-align:center}.flex-layout .checkbox-row .icon-marker i,.flex-layout .header-row .icon-marker i,.flex-layout .instance-row .icon-marker i,.flex-layout .item-row .icon-marker i{font-size:16px;display:inline-block;margin:10px 0 0 15px}.flex-layout .checkbox-row .icon-marker i.normal,.flex-layout .header-row .icon-marker i.normal,.flex-layout .instance-row .icon-marker i.normal,.flex-layout .item-row .icon-marker i.normal{color:#1976D2}.flex-layout .checkbox-row .icon-marker i.warning,.flex-layout .header-row .icon-marker i.warning,.flex-layout .instance-row .icon-marker i.warning,.flex-layout .item-row .icon-marker i.warning{color:#FE9700}.flex-layout .checkbox-row .date-cell,.flex-layout .header-row .date-cell,.flex-layout .instance-row .date-cell,.flex-layout .item-row .date-cell{width:100px}.flex-layout .checkbox-row .row-selector,.flex-layout .header-row .row-selector,.flex-layout .instance-row .row-selector,.flex-layout .item-row .row-selector{min-width:18px;text-align:center}.flex-layout .checkbox-row .indicator-icon,.flex-layout .header-row .indicator-icon,.flex-layout .instance-row .indicator-icon,.flex-layout .item-row .indicator-icon{min-width:20px;text-align:center;font-size:13px;color:#c6ced8}.flex-layout .checkbox-row .ack-marker,.flex-layout .header-row .ack-marker,.flex-layout .instance-row .ack-marker,.flex-layout .item-row .ack-marker{min-width:24px}.flex-layout .checkbox-row .ack-marker i,.flex-layout .header-row .ack-marker i,.flex-layout .instance-row .ack-marker i,.flex-layout .item-row .ack-marker i{color:#a7b4c4;font-size:14px;display:inline-block;margin:10px 20px 0 10px}.flex-layout .checkbox-row .padded-item,.flex-layout .header-row .padded-item,.flex-layout .instance-row .padded-item,.flex-layout .item-row .padded-item{padding:8px 15px}.flex-layout .checkbox-row .padded-item.top-right,.flex-layout .header-row .padded-item.top-right,.flex-layout .instance-row .padded-item.top-right,.flex-layout .item-row .padded-item.top-right{padding:8px 15px 0 0}.flex-layout .checkbox-row .padded-item.vr-slim,.flex-layout .header-row .padded-item.vr-slim,.flex-layout .instance-row .padded-item.vr-slim,.flex-layout .item-row .padded-item.vr-slim{padding:3px 10px}.flex-layout .checkbox-row .padded-item.hz-slim,.flex-layout .header-row .padded-item.hz-slim,.flex-layout .instance-row .padded-item.hz-slim,.flex-layout .item-row .padded-item.hz-slim{padding:8px 3px}.flex-layout .checkbox-row .padded-item.condensed,.flex-layout .header-row .padded-item.condensed,.flex-layout .instance-row .padded-item.condensed,.flex-layout .item-row .padded-item.condensed{padding:3px 10px 3px 0}.flex-layout .checkbox-row.padded-cells>div,.flex-layout .header-row.padded-cells>div,.flex-layout .instance-row.padded-cells>div,.flex-layout .item-row.padded-cells>div{padding:5px 10px}.flex-layout .checkbox-row.smaller-text,.flex-layout .header-row.smaller-text,.flex-layout .instance-row.smaller-text,.flex-layout .item-row.smaller-text{font-size:12px}.flex-layout .checkbox-row.sxs>div,.flex-layout .header-row.sxs>div,.flex-layout .instance-row.sxs>div,.flex-layout .item-row.sxs>div{padding:5px 0}.flex-layout .checkbox-row.sxs>div:first-child,.flex-layout .header-row.sxs>div:first-child,.flex-layout .instance-row.sxs>div:first-child,.flex-layout .item-row.sxs>div:first-child{font-size:12px;min-width:150px}.flex-layout .checkbox-row.sxs:first-child>div,.flex-layout .header-row.sxs:first-child>div,.flex-layout .instance-row.sxs:first-child>div,.flex-layout .item-row.sxs:first-child>div{padding-top:0}.flex-layout .checkbox-row.row-nowrap,.flex-layout .header-row.row-nowrap,.flex-layout .instance-row.row-nowrap,.flex-layout .item-row.row-nowrap{-webkit-flex-flow:row nowrap;-moz-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap}.flex-layout .checkbox-row>div{cursor:pointer}.flex-layout .checkbox-row>div:first-child{padding:3px 2px 3px 0}.flex-layout .checkbox-row>div:nth-child(2){padding:3px 0}.flex-layout .header-row{font-weight:600;background-color:#f0f2f5;font-size:11px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.flex-layout .header-row.rounded{border-bottom:none;border-radius:2px}.flex-layout .toolbar-row{position:relative;width:100%;padding:5px 0 0 8px}.flex-layout .confirmation-row,.flex-layout .edit-row{position:relative;width:100%;padding:0}.flex-layout .confirmation-row .error-failure-placard,.flex-layout .confirmation-row .remove-confirmation-inline,.flex-layout .edit-row .error-failure-placard,.flex-layout .edit-row .remove-confirmation-inline{margin:5px 15px}.flex-layout .with-vertical-row-padding>div.item-row{padding:4px 0}.flex-layout .edit-row{border-bottom:1px solid #dee3e9;position:relative;width:100%;padding:5px 15px}@media only screen and (max-width:640px){.flex-layout .item-row{-webkit-flex-flow:column wrap;-moz-flex-flow:column wrap;-ms-flex-flow:column wrap;flex-flow:column wrap}.flex-layout.adapt-full .header-row{display:none}.flex-layout.adapt-full>.item-row>div{width:100%}.flex-layout.adapt-full .filter-aside{border-bottom:1px solid #dee3e9}.flex-layout.row-nowrap .item-row{-webkit-flex-flow:row nowrap;-moz-flex-flow:row nowrap;-ms-flex-flow:row nowrap;flex-flow:row nowrap}}.flex-layout.vertical{height:100%;-webkit-flex-flow:column nowrap;-moz-flex-flow:column nowrap;-ms-flex-flow:column nowrap;flex-flow:column nowrap}.flex-layout.vertical>div{width:100%}.flex-form .item-row>div{padding-bottom:5px;padding-right:6px}.flex-form .item-row>div label{font-size:11px;margin-bottom:0}.flex-form .item-row>div input[type=search],.flex-form .item-row>div input[type=text],.flex-form .item-row>div select,.flex-form .item-row>div textarea{width:100%;box-sizing:border-box}.flex-form .twitter-typeahead{width:100%}.flex-order-1{-webkit-order:1;-moz-order:1;-ms-order:1;order:1}.flex-order-2{-webkit-order:2;-moz-order:2;-ms-order:2;order:2}.flex-order-3{-webkit-order:3;-moz-order:3;-ms-order:3;order:3}.flex-order-4{-webkit-order:4;-moz-order:4;-ms-order:4;order:4}.flex-order-5{-webkit-order:5;-moz-order:5;-ms-order:5;order:5}.flex-order-6{-webkit-order:6;-moz-order:6;-ms-order:6;order:6}.flex-order-7{-webkit-order:7;-moz-order:7;-ms-order:7;order:7}.flex-order-8{-webkit-order:8;-moz-order:8;-ms-order:8;order:8}.flex-order-9{-webkit-order:9;-moz-order:9;-ms-order:9;order:9}.flex-order-10{-webkit-order:10;-moz-order:10;-ms-order:10;order:10}.notifications-results-list{font-size:12px}.notifications-results-list .info{color:#FFE082}.notifications-results-list .alert{color:#FFC107}.notifications-results-list .unviewed .image-container,.notifications-results-list .unviewed .time-container{font-weight:600}.notifications-results-list .image-container>i{font-size:18px;line-height:32px;vertical-align:middle}.notifications-results-list .unviewed-marker{font-weight:700;color:#000}.alerts-notifier-container{padding:9px 0 8px 15px;border-bottom:1px solid #dee3e9}.alerts-notifier-container .dropdown-button>button{background-color:transparent}.alerts-notifier-container .dropdown-button>button .circle{display:inline-block;text-align:center;background-color:#899aaf;width:22px;height:22px;margin-right:4px}.alerts-notifier-container .dropdown-button>button .circle i{line-height:22px;font-size:12px}.alerts-notifier-container .dropdown-button>button span{color:#899aaf;font-size:11px}.alerts-notifier-container .dropdown-button>button:hover{background-color:transparent}.alerts-notifier-container .dropdown-button>button:hover .circle{background-color:#6a809b}.alerts-notifier-container .dropdown-button>button:hover span{color:#6a809b}.alerts-notifier-container .dropdown-button.open>button{background-color:transparent}.alerts-notifier-container .dropdown-button .dropdown-content{border:1px solid #899aaf;background-color:#fff}.alerts-notifier-container.has-messages .dropdown-button>button .circle{background-color:#FFC107}.alerts-notifier-container.has-messages .dropdown-button>button:hover .circle{background-color:#dda600}.flex-grid .header-row,.item-listing.clickable-item>li:hover{background-color:#f6f8f9}.alerts-notifier-container .dropdown-content{min-width:350px}.alerts-notifier-container .notification-list-item{line-height:26px;font-size:12px;border-bottom:1px dotted #dee3e9}.alerts-notifier-container .notification-list-item i{color:#c6ced8}.alerts-notifier-container .notification-list-item>div{padding:8px 4px}.alerts-notifier-container .notification-list-item>div:nth-child(3){min-width:80px;padding-right:10px}.alerts-notifier-container .notification-list-item>div:nth-child(3) a,.alerts-notifier-container .notification-list-item>div:nth-child(3) button{font-size:11px}.alerts-notifier-container .notification-list-item:last-child{border-bottom:none}.alerts-notifier-container .container-footer{border-top:1px solid #dee3e9;background-color:#f6f8f9;text-transform:uppercase;padding:5px 10px;text-align:right}.notification-definition-edit-form .form-row>textarea,.notification-template-edit-form .form-row>textarea{min-width:500px}@media only screen and (min-width:1px) and (max-width:949px){.alerts-notifier-container .dropdown-button>button span,.alerts-notifier-container .notification-list-item div:first-child{display:none}.alerts-notifier-container .notification-list-item>div{padding:4px 10px}.notification-definition-edit-form .form-row>textarea,.notification-template-edit-form .form-row>textarea{width:240px;min-width:0}}.notification-definition-container .row>div{display:inline-block;padding:15px 5px;min-width:250px}@media only screen and (min-width:1px) and (max-width:949px){.notification-definition-container .row>div{display:block;padding:5px;min-width:inherit}}.multi-line-listing{list-style:none;padding:0;margin:0;line-height:28px}.multi-line-listing.indent-5>li{padding-left:5px}.fluid-grid-listing>div.col-group{border-bottom:1px solid #dee3e9;margin-bottom:4px;padding:6px 0}.item-listing{list-style:none;padding:0;margin:0}.item-listing.indent-5>li{padding-left:5px}.item-listing .date-time{margin-right:30px;display:inline-block}.item-listing.nested{margin-left:20px}.item-listing.no-padding>li{padding:0}.item-listing>li{position:relative;padding:10px 0 10px 15px}.item-listing>li .item-info{padding:5px 0}.item-listing>li .padding-list-item{padding:10px 15px}.item-listing>li.selectable{cursor:pointer}.item-listing>li:after{display:table}.item-listing.compressed>li{padding:5px 15px;font-size:12px}.item-listing.line-separated>li,.item-listing.line-seperated>li{border-bottom:1px solid #dee3e9}.item-listing.line-separated>li:last-child,.item-listing.line-seperated>li:last-child{border-bottom:0 none}.item-listing.clickable-item>li{cursor:pointer}.item-listing .with-icon-marker>div:first-child i{display:inline-block;color:#dee3e9;font-size:24px;line-height:26px}.item-listing .with-icon-marker>div:first-child i.small{font-size:19px}.item-listing .with-icon-marker>div:nth-child(2){position:relative;margin-left:35px}.item-listing .with-icon-marker>div:nth-child(2) .title{font-weight:600;font-size:14px}.item-listing .with-icon-marker.small>div:first-child i{font-size:19px}.item-listing .with-icon-marker.small>div:nth-child(2){margin-left:30px}.virtual-listing>li:first-child,.virtual-listing>li:last-child{padding:0!important;border:none}.component-list-item .item-action-component{display:inline-block}.component-list-item .item-actions>.item-expander{display:inline-block;min-width:16px;margin-right:5px;vertical-align:middle}.component-list-item .item-actions>.item-selector,.component-list-item .item-actions>.item-selector a{display:inline-block}.component-list-item .item-actions>.item-selector a i{display:inline-block;line-height:26px;font-size:13px}.component-list-item .item-container{margin-left:22px}.component-list-item .item-container.expanded{margin-left:44px}.component-list-item .item-container .item-read{line-height:26px}.component-list-item .item-container .item-read.outlined{border:1px solid #dee3e9;border-left:5px solid #dee3e9;border-radius:3px;padding:6px 12px;margin-bottom:5px}.component-list-item .item-container .item-read.outlined .title{font-size:16px;margin-bottom:0}.component-list-item .item-container .item-read.outlined .title.smaller{font-size:13px}.component-list-item .item-container .item-read.outlined .title i{display:inline-block;color:#dee3e9;margin-right:5px}.component-list-item .item-container .item-read.outlined small{font-size:12px}.component-list-item .item-container .item-read.outlined .item-content{padding:3px 5px}.component-list-item .item-container .item-read.condensed{line-height:24px}.component-list-item .item-container .item-read.selected{border:2px solid #5faee3;border-radius:3px}.component-list-item .item-container .item-read em{font-size:12px;font-style:normal}.component-list-item .item-container .item-menu-hz{height:26px;line-height:26px}.component-list-item:after{display:table}.component-list-item.highlighted .item-container .item-read.outlined{border:1px solid #5faee3;border-left:5px solid #5faee3}.flex-grid .edit-row,.flex-grid .finder-row.line-separated,.flex-grid .header-row,.flex-grid .header-row.line-separated,.flex-grid .instance-row.line-separated,.flex-grid .menu-row.line-separated{border-bottom:1px solid #dee3e9}.flex-grid{width:100%;display:flex;flex-flow:row wrap}.flex-grid .header-row{font-weight:600;font-size:11px;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.flex-grid .toolbar-row{position:relative;width:100%;padding:5px 0 0 8px}.flex-grid .confirmation-row,.flex-grid .edit-row{position:relative;width:100%;padding:5px 15px}.flex-grid .finder-row,.flex-grid .header-row,.flex-grid .instance-row,.flex-grid .menu-row{width:100%;display:flex;flex-flow:row nowrap;padding:5px 0}.flex-grid .finder-row.truncate>div,.flex-grid .header-row.truncate>div,.flex-grid .instance-row.truncate>div,.flex-grid .menu-row.truncate>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.flex-grid .finder-row>div,.flex-grid .header-row>div,.flex-grid .instance-row>div,.flex-grid .menu-row>div{width:125px;padding:5px 10px}.flex-grid .finder-row>div.width-10,.flex-grid .header-row>div.width-10,.flex-grid .instance-row>div.width-10,.flex-grid .menu-row>div.width-10{width:10%}.flex-grid .finder-row>div.width-20,.flex-grid .header-row>div.width-20,.flex-grid .instance-row>div.width-20,.flex-grid .menu-row>div.width-20{width:20%}.flex-grid .finder-row>div.width-30,.flex-grid .header-row>div.width-30,.flex-grid .instance-row>div.width-30,.flex-grid .menu-row>div.width-30{width:30%}.flex-grid .finder-row>div.width-40,.flex-grid .header-row>div.width-40,.flex-grid .instance-row>div.width-40,.flex-grid .menu-row>div.width-40{width:40%}.flex-grid .finder-row>div.width-50,.flex-grid .header-row>div.width-50,.flex-grid .instance-row>div.width-50,.flex-grid .menu-row>div.width-50{width:50%}.flex-grid .finder-row>div.width-60,.flex-grid .header-row>div.width-60,.flex-grid .instance-row>div.width-60,.flex-grid .menu-row>div.width-60{width:60%}.flex-grid .finder-row>div.width-70,.flex-grid .header-row>div.width-70,.flex-grid .instance-row>div.width-70,.flex-grid .menu-row>div.width-70{width:70%}.flex-grid .finder-row>div.width-80,.flex-grid .header-row>div.width-80,.flex-grid .instance-row>div.width-80,.flex-grid .menu-row>div.width-80{width:80%}.flex-grid .finder-row>div.width-90,.flex-grid .header-row>div.width-90,.flex-grid .instance-row>div.width-90,.flex-grid .menu-row>div.width-90{width:90%}.flex-grid .finder-row>div.width-100,.flex-grid .header-row>div.width-100,.flex-grid .instance-row>div.width-100,.flex-grid .menu-row>div.width-100{width:100%}.flex-grid .finder-row>div.row-selector,.flex-grid .header-row>div.row-selector,.flex-grid .instance-row>div.row-selector,.flex-grid .menu-row>div.row-selector{width:20px;min-width:20px;padding:0 5px;text-align:center}.flex-grid .finder-row>div.actions,.flex-grid .finder-row>div.selector,.flex-grid .header-row>div.actions,.flex-grid .header-row>div.selector,.flex-grid .instance-row>div.actions,.flex-grid .instance-row>div.selector,.flex-grid .menu-row>div.actions,.flex-grid .menu-row>div.selector{padding:5px 0;text-align:center}.flex-grid .finder-row>div.actions.selector,.flex-grid .finder-row>div.selector.selector,.flex-grid .header-row>div.actions.selector,.flex-grid .header-row>div.selector.selector,.flex-grid .instance-row>div.actions.selector,.flex-grid .instance-row>div.selector.selector,.flex-grid .menu-row>div.actions.selector,.flex-grid .menu-row>div.selector.selector{width:32px;min-width:32px}.flex-grid .finder-row>div.actions.actions,.flex-grid .finder-row>div.selector.actions,.flex-grid .header-row>div.actions.actions,.flex-grid .header-row>div.selector.actions,.flex-grid .instance-row>div.actions.actions,.flex-grid .instance-row>div.selector.actions,.flex-grid .menu-row>div.actions.actions,.flex-grid .menu-row>div.selector.actions{width:100px}.flex-grid .finder-row>div.actions.actions>button,.flex-grid .finder-row>div.actions.actions>dropdown-button,.flex-grid .finder-row>div.selector.actions>button,.flex-grid .finder-row>div.selector.actions>dropdown-button,.flex-grid .header-row>div.actions.actions>button,.flex-grid .header-row>div.actions.actions>dropdown-button,.flex-grid .header-row>div.selector.actions>button,.flex-grid .header-row>div.selector.actions>dropdown-button,.flex-grid .instance-row>div.actions.actions>button,.flex-grid .instance-row>div.actions.actions>dropdown-button,.flex-grid .instance-row>div.selector.actions>button,.flex-grid .instance-row>div.selector.actions>dropdown-button,.flex-grid .menu-row>div.actions.actions>button,.flex-grid .menu-row>div.actions.actions>dropdown-button,.flex-grid .menu-row>div.selector.actions>button,.flex-grid .menu-row>div.selector.actions>dropdown-button{width:100%}.flex-grid .finder-row>div.date,.flex-grid .header-row>div.date,.flex-grid .instance-row>div.date,.flex-grid .menu-row>div.date{width:105px;min-width:80px}.flex-grid .finder-row>div.date-text,.flex-grid .header-row>div.date-text,.flex-grid .instance-row>div.date-text,.flex-grid .menu-row>div.date-text{width:125px;min-width:100px}.flex-grid .finder-row>div.progress,.flex-grid .header-row>div.progress,.flex-grid .instance-row>div.progress,.flex-grid .menu-row>div.progress{width:110px;min-width:100px}.flex-grid .finder-row>div .desc-label,.flex-grid .header-row>div .desc-label,.flex-grid .instance-row>div .desc-label,.flex-grid .menu-row>div .desc-label{display:none}.flex-grid .finder-row>div.indicator,.flex-grid .header-row>div.indicator,.flex-grid .instance-row>div.indicator,.flex-grid .menu-row>div.indicator{width:22px;text-align:center;padding:5px 0}.flex-grid .finder-row>div.indicator i,.flex-grid .header-row>div.indicator i,.flex-grid .instance-row>div.indicator i,.flex-grid .menu-row>div.indicator i{color:#c6ced8;font-size:14px}.flex-grid .finder-row>div.action-icon,.flex-grid .header-row>div.action-icon,.flex-grid .instance-row>div.action-icon,.flex-grid .menu-row>div.action-icon{text-align:center;width:95px;padding-top:10px;min-width:75px}.flex-grid .finder-row>div:first-child,.flex-grid .header-row>div:first-child,.flex-grid .instance-row>div:first-child,.flex-grid .menu-row>div:first-child{padding-left:20px}.flex-grid .finder-row>div:first-child.selector,.flex-grid .header-row>div:first-child.selector,.flex-grid .instance-row>div:first-child.selector,.flex-grid .menu-row>div:first-child.selector{padding-left:5px}.flex-grid .menu-row{border:2px solid #6a809b;border-bottom:none}.flex-grid .finder-row>div,.flex-grid .instance-row>div{font-size:12px}.flex-grid .finder-row.selected,.flex-grid .instance-row.selected{border:2px solid #6a809b;border-top:none}.actions-text,.entity-attribute-listing>li:last-child>div,.search-results-listing>li{border-bottom:1px solid #dee3e9}.flex-grid .header-row>div{padding:0 10px}.flex-grid .header-row>div.row-selector{width:0;min-width:0;padding-left:0}.flex-grid .header-row>div.action-icon{padding-top:0}.flex-grid .header-row>div.selector{padding:0}@media only screen and (max-width:640px){.flex-grid .header-row{display:none}}.checkable-item{cursor:pointer}.checkable-item .check-selector{display:inline-block;color:#eaedf1;font-size:14px;margin-right:5px}.card-listing:after,.search-results-listing>li:after{display:table;content:"";clear:both}.checkable-item .check-selector.success{color:#8BC34A}.checkable-item:hover .check-selector{color:#c8e3aa}.checkable-item:hover .check-selector.success{color:#8BC34A}.bulk-toolbar,.button-bar{background-color:#899aaf;padding:5px 20px;color:#fff}.bulk-toolbar .selection-msg,.button-bar .selection-msg{margin-right:10px}.bulk-toolbar button,.button-bar button{background-color:#6a809b;color:#fff;padding:0 15px;line-height:20px;text-transform:uppercase;font-size:10px;margin-right:4px!important;font-weight:600}.bulk-toolbar button:hover,.button-bar button:hover{background-color:#54677e}.actions-text,.entity-attribute-listing>li.header-row>div{background-color:#f0f2f5}.actions-text{padding:3px 15px}.card-listing{list-style:none;padding:0;margin:0}.card-listing.indent-5>li{padding-left:5px}.card-listing>li{position:relative;cursor:pointer;border:1px solid #dee3e9;border-top:4px solid #dee3e9;width:265px;margin-right:15px;margin-bottom:15px;min-height:150px}.card-listing.condensed>li{width:200px;min-height:100px}.search-results-listing{list-style:none;padding:0;margin:0}.search-results-listing.indent-5>li{padding-left:5px}.search-results-listing>li{position:relative;padding:10px 15px}.listing-icon-links{list-style:none;padding:0;margin:0}.listing-icon-links.indent-5>li{padding-left:5px}.listing-icon-links>li{position:relative;float:left;text-align:center;padding:10px 15px}.listing-icon-links>li>i{display:block;font-size:16px;color:#a4c7e8}.listing-icon-links>li>a{display:inline-block;text-align:center;padding:3px 5px 2px;text-transform:uppercase;font-size:11px;font-weight:600}.new-item-container{border:1px solid #dee3e9;border-radius:3px;margin-left:20px}.item-menu-hz{min-height:26px;font-size:12px}.item-menu-hz>span{padding:0 5px 0 6px;border-right:1px solid #eaedf1}.item-menu-hz>span:first-child{padding-left:0}.item-menu-hz>span:last-child{border-right:none}.item-menu-hz>span a{line-height:26px;min-width:26px}.item-menu-hz i{line-height:26px}.reference-listing>li{padding:15px}.reference-listing>li .listing-remove{float:right;margin-right:5px}.reference-listing>li .listing-remove a{color:#68a1d8}.reference-listing>li .listing-remove a:hover{color:#327BC1}.reference-listing>li .listing-icon{float:left}.reference-listing>li .listing-icon i{color:#c6ced8;font-size:24px}.reference-listing>li .listing-content{position:relative;vertical-align:top;margin-left:35px;margin-right:30px}.control-list{list-style:none;padding:0;margin:0}.control-list.indent-5>li{padding-left:5px}.control-list>li{padding:3px 0}.control-list>li .list-action{color:#c6ced8;font-size:10px}.control-list>li .list-action:hover{color:#3498db}.control-list>li .list-action i{display:inline-block;margin-right:4px}.entity-attribute-listing{list-style:none;padding:0;margin:0;min-width:480px}.entity-attribute-listing.indent-5>li{padding-left:5px}.entity-attribute-listing>li>div{font-size:12px;padding:0 8px;float:left;width:125px;border-left:1px solid #dee3e9;border-top:1px solid #dee3e9}.entity-attribute-listing>li>div:last-child{border-right:1px solid #dee3e9}.entity-attribute-listing>li:after{content:"";display:table;clear:both}ul.attribute-list{margin:0;padding:0;list-style:none}ul.attribute-list>li{display:inline-block;padding-right:6px;border-right:1px solid #899aaf;line-height:100%}ul.attribute-list>li:first-child{padding-left:0}ul.attribute-list>li:last-child{padding-right:0;border-right:none}ul.attribute-list>li>span:first-child:after{content:':';margin-right:5px}.docs-tile:after,.findings-tile:after,.notes-tile:after{content:"";clear:both}ul.attribute-list>li>span:last-child{font-weight:600}.auth-body{margin-top:-52px}.auth-container{margin:0 auto;background-color:#fff;padding:15px 20px;width:425px;box-shadow:3px 3px 4px 2px rgba(135,135,135,.4);text-align:center}.auth-container .updating-overlay{padding-top:10px}.auth-container>header{background:url(images/logo50px.png) center no-repeat;width:200px;height:60px;margin:0 auto 10px}.auth-container>div h1,.auth-container>div h2{font-weight:600;font-size:15px}.auth-container>div p{line-height:28px}.auth-container .auth-form{margin:0 auto;width:350px;overflow:auto}.auth-container .auth-form button,.auth-container .auth-form input[type=password],.auth-container .auth-form input[type=text]{height:35px;border-radius:3px;margin:5px 2px;padding:0 6px;width:315px;font-size:110%}.auth-container .auth-form button{text-align:center;background-color:#8BC34A;border:none;color:#fff;width:325px;cursor:pointer}.auth-container .auth-form button:hover{background-color:#7eb73d}.auth-container .auth-form .cancel-button{background-color:#a7b4c4}.auth-container .auth-form .cancel-button:hover{background-color:#98a7ba}.auth-container a{font-weight:600;font-size:11px;display:inline-block;margin:15px 0}@media only screen and (max-width:529px){.auth-container .auth-form{width:auto}.auth-container .auth-form input[type=password],.auth-container .auth-form input[type=text]{width:225px}.auth-container .auth-form button{width:235px}.auth-container{width:300px}}.anim-message{text-align:center;padding:10px 15px}.anim-message-inline{text-align:center;background-color:#f0f2f5;padding:8px;border-bottom:1px solid 1px solid #dee3e9}.no-items-message{display:inline-block;text-align:center;color:#a7b4c4}.no-items-message.padded{padding:10px 15px}.error-message{color:#AA0021}.message-standout{position:relative;display:block;margin:5px 0;overflow:hidden}.message-standout,.message-standout .icon-button,.message-standout.info,.message-standout.info .icon-button{color:#3498db}.message-standout.success,.message-standout.success .icon-button{color:#8BC34A}.message-standout.warning,.message-standout.warning .icon-button{color:#FE9700}.message-standout.error,.message-standout.error .icon-button{color:#AA0021}.message-standout.inline{display:inline-block;margin:0 0 0 10px;vertical-align:bottom}.docs-tile .arrow i,.framed-layout-part .part-search .search-facets>button,.framed-layout-part .part-search .sort-options>button,.framed-layout-part .part-search>*,.notes-tile .arrow i{vertical-align:middle}.message-standout.show{animation:slide-in ease-in 1;animation-fill-mode:forwards;animation-duration:.25s}.message-standout.hide{animation:slide-out ease-out 1;animation-fill-mode:forwards;animation-duration:.25s}.error-message-validation{color:#FE9700;font-weight:600;padding-left:15px;text-align:left;font-size:10.5px;line-height:15px}p.error-message-validation{-webkit-margin-before:0;-webkit-margin-after:0}.has-warning,typeahead.has-warning .tt-input{box-shadow:-2px 0 #FE9700}.error-failure-placard{border:1px dotted #AA0021;margin:0 10px 10px 0;padding:6px 10px;border-radius:3px}.error-failure-placard>span{color:#AA0021;font-weight:600}.error-failure-placard button.ack-button{background-color:#AA0021;color:#fff;padding:1px 15px;text-align:center;border:none;font-size:11px}date-picker,multiselect-dropdown{display:inline-block}.scrollable-body{overflow-y:scroll}.scrollable-body::-webkit-scrollbar-track{border-radius:1px;background-color:#F5F5F5}.scrollable-body::-webkit-scrollbar{width:5px;background-color:#F5F5F5}.scrollable-body::-webkit-scrollbar-thumb{border-radius:1px;background-color:#c6ced8}.smart-modal-overlay{display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:-ms-flex;display:flex;-webkit-align-items:center;-moz-align-items:center;-ms-align-items:center;align-items:center;-webkit-justify-content:center;-moz-justify-content:center;-ms-justify-content:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;background-color:rgba(0,0,0,.3)}.smart-modal{height:480px;width:640px;background-color:#fff;z-index:2005;border-radius:0 0 2px 2px;box-shadow:6px 6px 15px 0 rgba(80,80,80,.67)}@media screen and (max-width:620px){.smart-modal{width:100%;margin:20px}}@media screen and (max-height:420px){.smart-modal{height:90%;margin:20px}}.smart-modal.full{height:100%;width:100%}.smart-modal.large{width:800px;height:600px}@media screen and (max-width:820px){.smart-modal.large{width:100%;margin:20px}}@media screen and (max-height:620px){.smart-modal.large{height:90%;margin:20px}}.smart-modal.small{width:360px;height:200px}@media screen and (max-width:380px){.smart-modal.small{width:100%;margin:20px}}@media screen and (max-height:220px){.smart-modal.small{height:90%;margin:20px}}.smart-modal.bottom-right{position:fixed;bottom:10px;right:10px}.smart-modal .modal-header{position:relative;height:36px;line-height:36px;background-color:#4D4D4D;color:#fff}.smart-modal .modal-header>label{position:relative;padding:0 10px;line-height:36px;overflow:hidden;margin-right:30px;white-space:nowrap;text-overflow:ellipsis}.smart-modal .modal-header button{position:absolute;right:0;top:0;border:none;background:0 0;line-height:34px;margin:1px 3px;color:#fff;padding:0 8px}.smart-modal .modal-header button:hover{background-color:#1a1a1a}.smart-modal .modal-body{height:100%}.smart-modal .modal-footer{border-top:1px solid #dee3e9}.smart-modal .modal-footer .buttons-container{text-align:right;padding:3px 10px}.smart-modal .modal-footer .buttons-container>button{padding:2px;min-width:65px;margin:1px;border:none}.findings-tile{border-radius:2px;border:1px dotted #1565C0;background-color:#fff;margin:0 8px 15px 0}.findings-tile header.tile-header{padding:6px 10px;cursor:pointer}.findings-tile section{padding:12px 10px}.findings-tile .circle{float:left;width:28px;height:28px;background-color:#1565C0;text-align:center}.findings-tile .circle i{display:inline-block;line-height:28px;color:#fff;font-size:14px}.findings-tile .arrow{float:right;width:18px}.findings-tile .arrow i{display:inline-block;vertical-align:middle;font-size:18px;color:#1565C0}.findings-tile .title{position:relative;margin-left:38px;margin-right:24px}.findings-tile .title label{margin-bottom:0;line-height:14px}.findings-tile:hover{border:1px solid #1565C0}.findings-tile:hover .circle{background-color:#104d92}.findings-tile.expanded{border:1px solid #388be9;border-top:1px solid #388be9}.findings-tile.expanded header.tile-header{border-bottom:1px dotted #388be9}.findings-tile:after{display:table}.docs-tile{border-radius:2px;border:1px dotted #03A9F4;background-color:#fff;margin:0 8px 15px 0}.docs-tile header.tile-header{padding:6px 10px;cursor:pointer}.docs-tile section{padding:12px 10px}.docs-tile .circle{float:left;width:28px;height:28px;background-color:#03A9F4;text-align:center}.docs-tile .circle i{display:inline-block;line-height:28px;color:#fff;font-size:14px}.docs-tile .arrow{float:right;width:18px}.docs-tile .arrow i{display:inline-block;font-size:18px;color:#03A9F4}.docs-tile .title{position:relative;margin-left:38px;margin-right:24px}.docs-tile .title label{margin-bottom:0;line-height:14px}.docs-tile:hover{border:1px solid #03A9F4}.docs-tile:hover .circle{background-color:#0286c2}.docs-tile.expanded{border:1px solid #47c4fd;border-top:1px solid #47c4fd}.docs-tile.expanded header.tile-header{border-bottom:1px dotted #47c4fd}.docs-tile:after{display:table}.notes-tile{border-radius:2px;border:1px dotted #0091EA;background-color:#fff;margin:0 8px 15px 0}.notes-tile header.tile-header{padding:6px 10px;cursor:pointer}.notes-tile section{padding:12px 10px}.notes-tile .circle{float:left;width:28px;height:28px;background-color:#0091EA;text-align:center}.notes-tile .circle i{display:inline-block;line-height:28px;color:#fff;font-size:14px}.notes-tile .arrow{float:right;width:18px}.notes-tile .arrow i{display:inline-block;font-size:18px;color:#0091EA}.notes-tile .title{position:relative;margin-left:38px;margin-right:24px}.notes-tile .title label{margin-bottom:0;line-height:14px}.notes-tile:hover{border:1px solid #0091EA}.notes-tile:hover .circle{background-color:#0071b7}.notes-tile.expanded{border:1px solid #37b3ff;border-top:1px solid #37b3ff}.notes-tile.expanded header.tile-header{border-bottom:1px dotted #37b3ff}.notes-tile:after{display:table}.count-tile{padding:10px;text-align:center;cursor:pointer}.count-tile label{font-size:18px;margin:0;line-height:16px}.count-tile span{font-size:10px;text-transform:uppercase;font-weight:600}.layout-container{position:relative;min-height:500px;padding-top:50px;padding-bottom:30px}.layout-container.full-screen{background-color:transparent}.layout-container>header{background-color:#fff;padding:10px 15px;border-bottom:1px solid #dee3e9}.layout-container>header>h2{margin:0 0 5px;text-transform:uppercase;font-size:15px;font-weight:600}.layout-container .content{height:100%;padding:47px 7px 7px}.with-sidebar .layout-container{margin-left:165px}@media only screen and (min-width:1px) and (max-width:949px){.with-sidebar .layout-container{margin-left:45px}}.alt-customer-notification{background-color:#3F51B5;padding:5px 10px;border-radius:3px;font-size:11px;color:#fff;margin:2px 7px 5px}.alt-customer-notification button{background-color:transparent;padding:0 12px;color:#fff;font-weight:600;cursor:pointer}.alt-customer-notification button:hover{background-color:#32408f}.alt-customer-notification.record-marker{background-color:#7986CB;display:inline-block;padding:0 4px;font-size:9px;line-height:18px;margin:0 3px 0 0}.padded-container{position:relative;padding:10px 15px}.padded-container .compressed{padding:5px 15px}.padded-container-decorated{padding:10px 0 10px 10px}.padded-container-decorated h4{font-weight:600;font-size:13px}.padded-container-decorated .line-separated>li{padding-left:0}.padded-container-decorated .line-separated>li:first-child{padding-top:0}.padded-container-decorated button.animated-button,.padded-container-decorated button.primary{padding:4px 10px;line-height:1!important}.row-editing-container{padding:5px 20px 15px}.padded-right{padding-right:15px}.content-header-message{background-color:#fff;margin:7px;border-radius:3px;border:1px solid #dee3e9;cursor:pointer}.content-header-message>div:first-child{float:left;width:32px;height:32px;background-color:#03A9F4;border-radius:3px 0 0 3px;text-align:center}.content-header-message>div:first-child i{display:inline-block;color:#fff;line-height:32px;font-size:16px}.content-header-message:after,.framed-layout-part .part-header:after,.framed-layout-part .part-section:after,.framed-layout-part>header.with-action:after{display:table;content:"";clear:both}.content-header-message>div:nth-child(2){float:left;padding:4px 15px;color:#3498db;font-weight:600}.framed-layout-part{position:relative;border:1px solid #dee3e9;border-top:3px solid #dee3e9;border-radius:3px;background-color:#fff;margin:7px}.framed-layout-part>header.with-action div.title{position:relative;font-weight:600;margin-right:80px;border-right:1px solid #dee3e9;padding:5px 15px}.framed-layout-part>header.with-action div.actions{float:right}.framed-layout-part>header.with-action div.actions button{border:none;border-radius:0;width:80px;text-align:center;font-size:11px;line-height:32px}.framed-layout-part .title-label{margin-bottom:10px;font-size:115%;font-weight:400}.framed-layout-part .flow-header{border-bottom:1px solid #dee3e9;padding:5px 15px}.framed-layout-part .flow-header .widget-title label{font-weight:400;text-transform:none;font-size:14px;color:#666}.framed-layout-part .part-header{padding:5px 15px;border-bottom:1px solid #eaedf1}.framed-layout-part .part-header .action-button{margin-left:5px}.framed-layout-part .part-section{position:relative}.framed-layout-part .part-section .editing-container{padding:10px 15px}.framed-layout-part .part-search{padding:5px 15px;border-bottom:1px solid #dee3e9}.framed-layout-part .part-search .search-facets,.framed-layout-part .part-search .sort-options{padding:0 5px 0 0;display:inline-block;line-height:30px}.framed-layout-part .part-search:after{content:"";display:table;clear:both}.framed-layout-part .new-item-inline{padding:10px 15px;border-bottom:1px solid #dee3e9;margin-bottom:15px;box-shadow:0 6px 8px -2px #bbb}.framed-layout-part.no-border{border:none}.framed-layout-part .search-facets button.selected:first-child{background-color:#419fdd}.framed-layout-part .search-facets button.selected:nth-child(2){background-color:#4ea5e0}.framed-layout-part .search-facets button.selected:first-child(3){background-color:#5bace2}.framed-layout-part .search-facets button.selected:first-child(4){background-color:#68b2e4}.framed-layout-part .search-facets button.selected:first-child(5){background-color:#75b9e7}.layout-sxs>div{float:left;margin-right:75px;margin-bottom:20px}.layout-sxs>div:last-child{margin-right:10px}.filter-aside{font-size:12px;padding:2px}.filter-aside .filters-title{background-color:#f0f2f5;padding:5px 15px}.filter-aside .filters-title>i{display:inline-block;margin-right:3px}.filter-aside>section{padding:5px 15px}.filter-aside>section .filter-button-container{width:100%;padding:10px 0 20px}.filter-aside>section .filter-button-container>button{width:100%}.filter-aside>section .filter-group-label{margin:10px 0 0;border-bottom:1px dotted #dee3e9}.info-part{background-color:#fff;border:2px solid #3498db;border-radius:3px}.info-part>header{padding:10px 10px 0}.info-part>header h1{display:inline-block;font-size:13px;text-transform:uppercase;font-weight:600;color:#333}.info-part>header i{display:inline-block;font-size:15px;color:#3498db;margin:0 5px}.info-part>header:after{content:"";display:table;clear:both}.info-part>section{font-size:12px;padding:0 15px 10px 37px}.error-page-content{color:#a7b4c4;background-color:#fff;padding:15px;margin-top:5px;text-align:center}.widget-title .expander-component i,.widget-title label{color:#6a809b;vertical-align:middle;display:inline-block}.error-page-content .big{font-size:2em;margin-bottom:.2em;margin-top:.2em}.widget-title.with-actions{position:relative;margin-right:100px}.widget-title>label.padded{padding:5px 15px}.widget-title .expander-component{margin-right:4px;background-color:#fff}.widget-title .expander-component i{font-size:16px}.widget-title label{font-size:11px;margin-bottom:0;text-transform:uppercase}.widget-title .item-count{display:inline-block;background-color:#a7b4c4;color:#fff;border-radius:3px;line-height:12px;padding:1px 6px;font-size:9px;font-weight:600;margin:0 4px;vertical-align:top}.widget-title .item-count.none{background-color:#dee3e9;color:#fff}.widget-actions{position:absolute;text-align:right;right:0;top:0;min-width:105px;padding:5px 8px 0 0}.widget-actions .action-button{min-width:80px}.widget-actions button.primary{padding:4px 10px;line-height:1}.listing-min-height{min-height:150px}.widget-min-height{min-height:75px}.display label,form label{margin-bottom:5px}.display input[type=email],.display input[type=number],.display input[type=password],.display input[type=text],.display select,form input[type=email],form input[type=number],form input[type=password],form input[type=text],form select{padding:0 5px;height:28px;width:240px}.display input[type=checkbox],form input[type=checkbox]{vertical-align:middle}.display input.with-addon+button.addon,form input.with-addon+button.addon{position:relative;left:-3px;min-width:0;width:35px;height:30px;padding:3px 10px;border-top-left-radius:0;border-bottom-left-radius:0}.display select,form select{width:250px;height:30px}.display textarea,form textarea{width:calc(508px);height:36px}.display textarea.x1,form textarea.x1{width:250px}.display .form-row,form .form-row{margin:8px 0}.display .form-row dropdown-button button.action-button,form .form-row dropdown-button button.action-button{padding:2px 15px;font-size:inherit}.display .form-row.small,form .form-row.small{margin:4px 0}.display .form-row.medium,form .form-row.medium{margin:8px 0}.display .form-row.large,form .form-row.large{margin:16px 0}.display.inline-editor,form.inline-editor{display:inline-block}.display.sxs .form-row label,form.sxs .form-row label{font-size:11px}.display.sxs .form-row>div,form.sxs .form-row>div{display:inline-block;vertical-align:top;margin-right:10px;margin-bottom:10px}.display.sxs .form-row>div:last-child,form.sxs .form-row>div:last-child{margin-right:1px}.display.sxs .form-row.label-only>div,.display.sxs .form-row>div.label-only,form.sxs .form-row.label-only>div,form.sxs .form-row>div.label-only{width:240px}.display.display.sxs .form-row>div,form.display.sxs .form-row>div{width:225px}.display.condensed-form .form-row>div,form.condensed-form .form-row>div{display:inline-block;vertical-align:top;margin-right:10px;margin-bottom:2px}.display.condensed-form .form-row>div:last-child,form.condensed-form .form-row>div:last-child{margin-right:1px}.display.condensed-form .form-row>div button.cancel,.display.condensed-form .form-row>div button.primary,form.condensed-form .form-row>div button.cancel,form.condensed-form .form-row>div button.primary{font-size:11px;padding:2px 8px;min-width:55px}.display.condensed-form .form-row label.small,form.condensed-form .form-row label.small{font-size:11px;margin-bottom:0}@media only screen and (max-width:390px){.display input[type=email],.display input[type=number],.display input[type=password],.display input[type=text],.display select,.display textarea,form input[type=email],form input[type=number],form input[type=password],form input[type=text],form select,form textarea{width:180px}}.padded-row{padding:10px 0}.standout-form-row{padding:10px 15px;background-color:#f0f2f5;border-radius:3px}.editable-div,.standout-form-row>div{padding:5px 10px}.editable-div{border:1px solid #dee3e9;height:300px;overflow-y:scroll;border-radius:3px}.form-control,.search-component{border:1px solid #dee3e9}.entity-attribute-container{width:225px}.entity-attribute-container input[type=number],.entity-attribute-container input[type=text]{width:200px}.entity-attribute-container select{width:210px}.inset-edit{margin-left:20px}button>i{display:inline-block}button.working>i{animation-name:rotate;animation-duration:1.25s;animation-iteration-count:infinite}button.working>i:before{content:'\edaa'}.route-nav-config-params{height:100px}input.disabled{background-color:#ebebe4!important;color:#a9a9a9!important}.form-group{padding:0 15px 15px 0}.form-group .form-group{padding-bottom:0}.form-group .form-control,.form-group input[type=text],.form-group textarea{display:block;width:100%;padding:4px;box-sizing:border-box}.form-group select{height:30px}.input-group{padding-right:0}.search-component{width:240px;display:inline-block;border-radius:3px;padding:0;background-color:#fff;position:relative}.search-component.width-100{width:100%}.search-component .help-block{display:none}.search-component>input[type=search],.search-component>input[type=text]{border:none;border-radius:3px;height:30px;padding:0 4px;width:100%;overflow:hidden}.search-component>input[type=search]:focus,.search-component>input[type=text]:focus{border:none}.search-component>button{position:absolute;right:0;top:0;line-height:30px;padding:0 10px;background-color:#fff;border:none;cursor:pointer;border-radius:0}.dropdown-button,.editing-outline{position:relative}.search-component>button.action{background-color:#3498db;color:#fff}.search-component>button.action:hover{background-color:#217dbb}.search-component>button:hover{background-color:#dee3e9}.search-component>button:focus{border:none}.search-component:after{content:"";display:table;clear:both}@media only screen and (max-width:529px){.search-component{width:180px}}.animated-button [class*=updating-animation-]{display:inline-block;vertical-align:middle;height:16px;width:16px;opacity:1;margin-right:5px}.animated-button [class*=updating-animation-]>div{background-color:#fff}.animated-button>span{display:inline-block;line-height:18px;vertical-align:middle}.remove-confirmation-inline{border:1px dotted #E8950C;border-radius:3px;margin:0 10px 10px 0;padding:5px 10px;overflow:auto}.remove-confirmation-inline>span{color:#d0850b}.remove-confirmation-inline>div{padding:5px 0}.remove-confirmation-inline>div button{min-width:45px;padding:1px 5px;text-align:center;border:none;font-size:11px}.remove-confirmation-inline>div button:first-child{background-color:#E8950C;color:#fff}.remove-confirmation-inline>div button:first-child:hover{background-color:#d0850b}.remove-confirmation-inline>div button.cancel{width:40px}.remove-confirmation-inline.no-border{border:none}.toolbar-inline{background-color:#fff;border-radius:3px;color:#3498db;margin-bottom:2px;display:inline-block}.toolbar-inline ul{list-style:none;padding:0;margin:0}.toolbar-inline ul.indent-5>li{padding-left:5px}.toolbar-inline ul>li{display:inline-block;padding:0;margin-right:3px;text-transform:uppercase}.toolbar-inline ul>li button{font-size:10px;font-weight:600;padding:1px 8px;line-height:16px;min-width:50px;background-color:#fff;border:1px solid #0288D1;color:#0288D1}.toolbar-inline ul>li button:hover{background-color:#0288D1;color:#fff}.toolbar-inline.text-links ul>li button{font-size:12px;min-width:5px;border:none;padding:0}.toolbar-inline.text-links ul>li button:hover{background:#fff;color:#0288D1;text-decoration:underline}.toolbar-inline.text-links ul>li::after{content:' | '}.toolbar-inline.text-links ul>li:last-child::after{content:''}.filter-container-inline:after,.tab-listing:after,.tab-tiles:after{content:"";clear:both}.editing-outline .updating-overlay{background-color:transparent}.customer-count-link{display:inline-block;border:1px solid #327BC1;border-radius:3px;padding:0 10px;font-weight:600}.customer-count-link>span{display:inline-block;margin:0 3px;font-size:11px;vertical-align:top}.actions-text{font-size:12px;font-weight:600}.filter-container-inline{padding:7px 15px;border-bottom:1px solid #dee3e9}.filter-container-inline>label{font-weight:400;margin-right:5px;float:left}.filter-container-inline>div{float:left;padding:0 15px}.filter-container-inline>div label{font-weight:400;display:inline-block;margin:0 20px 5px 0;min-width:75px}.filter-container-inline>div button{line-height:20px}.filter-container-inline:after{display:table}.picture-frame{border:2px solid #dee3e9;width:32px;height:32px;text-align:center}.picture-frame>i{font-size:18px;line-height:32px;color:#a7b4c4}.decorator-label{text-transform:uppercase;font-size:11px;margin-bottom:0;margin-right:5px}.decorator-label.standout{background-color:#f0f2f5;padding:5px 10px;border-radius:2px;color:#6a809b}.decorator-label button.primary{padding:4px 10px;line-height:1}.decorated-item{padding:10px}.tab-listing{list-style:none;padding:0;margin:0 7px}.tab-listing.indent-5>li{padding-left:5px}.tab-listing>li{display:inline-block;cursor:pointer;margin:0 4px 4px 0}.tab-listing>li a,.tab-listing>li button{display:inline-block;padding:3px 5px;border-radius:3px;text-transform:uppercase;min-width:65px;text-align:center;background-color:#fff;color:#6a809b;border:2px solid #fff}.tab-listing>li a i,.tab-listing>li button i{display:block;padding:5px 0 3px;font-size:13px;color:#899aaf}.tab-listing>li a label,.tab-listing>li button label{font-size:9px;color:#6a809b;margin-bottom:0;cursor:pointer}.tab-listing>li a:hover,.tab-listing>li button:hover{background-color:#fff;border:2px solid #899aaf}.tab-listing>li a:hover i,.tab-listing>li a:hover label,.tab-listing>li button:hover i,.tab-listing>li button:hover label{color:#6a809b}.tab-listing>li a.selected,.tab-listing>li button.selected{background-color:#8BC34A}.tab-listing>li a.selected i,.tab-listing>li a.selected label,.tab-listing>li button.selected i,.tab-listing>li button.selected label{color:#fff}.tab-listing>li a.selected:hover,.tab-listing>li button.selected:hover{background-color:#7eb73d}.tab-listing>li a.selected:hover i,.tab-listing>li a.selected:hover label,.tab-listing>li button.selected:hover i,.tab-listing>li button.selected:hover label{color:#fff}.tab-listing:after{display:table}.dropdown-button{display:inline-block}.dropdown-button [class*=icon-caret]{display:inline-block;margin:0 6px 0 2px}.dropdown-button .dropdown-button-menu{position:absolute;top:24px;border:1px solid #dee3e9;box-shadow:0 3px 5px 0 #eaedf1;z-index:500}.dropdown-button .dropdown-button-menu.left{float:none;left:0}.dropdown-button .dropdown-button-menu.center{float:none;left:-50%;text-align:center}.dropdown-button .dropdown-button-menu.center>ul>li>a{text-align:center}.dropdown-button .dropdown-button-menu.right{float:none;right:0}.dropdown-button .dropdown-button-menu ul{list-style:none;padding:0;margin:0}.dropdown-button .dropdown-button-menu ul.indent-5>li{padding-left:5px}.dropdown-button .dropdown-button-menu ul>li{position:relative;padding:0;border-bottom:1px solid #dee3e9;background-color:#fff;cursor:pointer;white-space:nowrap}.dropdown-button .dropdown-button-menu ul>li a,.dropdown-button .dropdown-button-menu ul>li button,.dropdown-button .dropdown-button-menu ul>li label{display:block;font-size:11px;text-align:left;padding:5px 25px 5px 10px;white-space:nowrap}.dropdown-button .dropdown-button-menu ul>li label{margin:0}.dropdown-button .dropdown-button-menu ul>li label input,.dropdown-button .dropdown-button-menu ul>li label span{vertical-align:middle}.dropdown-button .dropdown-button-menu ul>li label input[type=checkbox]{margin:0 3px 0 0}.dropdown-button .dropdown-button-menu ul>li button{display:inline-block;width:100%;border:none;border-radius:0;background:0 0;vertical-align:middle}.dropdown-button .dropdown-button-menu ul>li button.inline{width:20px;padding:0;vertical-align:middle}.dropdown-button .dropdown-button-menu ul>li button.inline.right{position:absolute;float:none;right:0}.dropdown-button .dropdown-button-menu ul>li i{line-height:inherit;vertical-align:middle}.dropdown-button .dropdown-button-menu ul>li:hover{background-color:#5394d3;color:#fff}.dropdown-button .dropdown-button-menu ul>li:hover a,.dropdown-button .dropdown-button-menu ul>li:hover button{color:#fff}.dropdown-button .dropdown-button-menu ul>li:last-child{border-bottom:none}.dropdown-button .dropdown-button-menu .button-bar{display:flex;border-top:4px solid #dee3e9}.dropdown-button .dropdown-button-menu .button-bar>button{flex:1 1;width:auto;margin:0;padding:10px;border:none;border-radius:0;text-align:center;background-color:transparent}.dropdown-button .dropdown-button-menu .button-bar>button:last-child{border-right:none}.dropdown-button .dropdown-button-menu .button-bar>button:hover{background-color:#327BC1;color:#fff}.dropdown-button.grouped .dropdown-button-menu{padding:4px}.dropdown-button.double-wide .dropdown-button-menu{width:200%}.dropdown-button.open>.action-button{border-bottom-left-radius:0;border-bottom-right-radius:0;background-color:#327BC1;color:#fff}.dropdown-button.open>.action-button.inverse{background-color:#fff;color:#327BC1}.dropdown-button.multiselect .dropdown-button-menu{font-size:11px;position:absolute;top:31px;border-top-width:1px;border-bottom:none;max-height:200px;overflow-y:auto;overflow-x:hidden;background-color:#fff;box-shadow:11px 10px 18px -4px #bbb;border-radius:3px}.dropdown-button.multiselect .dropdown-button-menu ul>li{display:block;font-weight:400;min-width:250px;font-size:11px;cursor:pointer}.dropdown-button.multiselect .dropdown-button-menu ul>li:hover .grip{opacity:1}.dropdown-button.multiselect .dropdown-button-menu ul>li button{color:inherit}.dropdown-button.multiselect>button.action-button{background-color:#fff;padding:4px;color:#666;border:1px solid #dee3e9;border-radius:0;font-size:inherit;text-align:left;width:250px}.dropdown-button.multiselect>button.action-button:focus{border:1px solid #a1afc0}.dropdown-button.multiselect>button.action-button>div{font-weight:400;text-transform:none;width:220px;display:inline-block;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;line-height:15px;vertical-align:middle}.dropdown-button.multiselect>button.action-button>i{vertical-align:middle}.tags .tag>a,.tags li.tag-entry{vertical-align:top}.dropdown-button.multiselect>button.action-button:hover{background-color:#fff}.dropdown-button.multiselect.attribute-item>button.action-button{width:212px}.dropdown-button.multiselect.attribute-item>button.action-button>div{width:185px}.inline-action-icons{display:inline-block}.inline-action-icons i{display:inline-block;margin-right:4px;font-size:11px}.inline-edit-placard{position:relative;border:1px solid #dee3e9;border-radius:3px;margin:8px 0;background-color:#f0f2f5;padding:5px 10px}.inline-edit-placard button.cancel,.inline-edit-placard button.primary{font-size:11px;padding:2px 10px;min-width:40px}.vertical-checkbox-list{list-style:none;padding:0;margin:0}.vertical-checkbox-list.indent-5>li{padding-left:5px}.vertical-checkbox-list>li{padding:8px 0}.vertical-checkbox-list>li label{font-weight:400}.tab-tiles{list-style:none;padding:0;margin:2px 7px}.tab-tiles.indent-5>li{padding-left:5px}.tab-tiles>li{float:left;padding:5px 10px;cursor:pointer;background-color:#fff;color:#6a809b;font-size:11px;min-width:50px;text-align:center;border-radius:3px;margin-right:5px;margin-bottom:5px}.tab-tiles>li .tile-footer{border-top:1px solid #dee3e9;text-align:center;padding:3px 10px;background-color:#f0f2f5;font-size:11px;font-weight:600}.tab-tiles:after{display:table}.add-selector{float:left;position:relative;cursor:pointer;border:none;background:#fff;padding:0}.add-selector>i:first-child{position:absolute;top:-9px;left:-12px;margin:0;border:2px solid #fff;background-color:#fff;border-radius:3px;font-size:14px;color:#327BC1}.add-selector>i:first-child.icon-checkmark-circle{color:#8BC34A}.add-selector.with-text>i:first-child{margin-left:-14px;left:initial}.add-selector.with-text label{font-size:10px;font-weight:400;color:#327BC1;text-transform:uppercase}.add-selector>i:nth-child(2){font-size:22px;display:inline-block;color:#dee3e9}.add-selector:hover>i:first-child{color:#286198}.add-selector:hover>i:first-child.icon-checkmark-circle{color:#8BC34A}.add-selector:hover>i:nth-child(2){color:#bfc9d4}.date-range,.date-range .separator{display:inline-block}.date-range .separator:after{content:'\2013';color:#a7b4c4}.progress-indicator .progress-bar{background-color:#eaedf1;border-radius:3px;height:10px;margin:5px 0;position:relative}.progress-indicator .progress-bar .inner-bar{position:absolute;border-radius:3px;height:10px;top:0;left:0;background-color:#8BC34A}.live-tile{cursor:pointer;border-radius:3px;background-color:#fff;margin:10px 5px;padding:10px;overflow:auto}.live-tile .circle{float:left;height:40px;width:40px;text-align:center}.live-tile .circle.tile-color-1{background-color:#8BC34A}.live-tile .circle.tile-color-2{background-color:#673AB7}.live-tile .circle.tile-color-3{background-color:#2196F3}.live-tile .circle.tile-color-4{background-color:#0097A7}.live-tile .circle i{line-height:40px;color:#fff;font-size:18px}.live-tile .tile-metric,.live-tile .tile-subtitle{position:relative;color:#888;margin-left:50px}.live-tile .tile-metric span,.live-tile .tile-subtitle span{display:inline-block;margin-right:2px}.live-tile .tile-metric{font-weight:600;font-size:20px}.live-tile .tile-metric small{font-size:10px;font-weight:400}.live-tile:hover .circle.tile-color-1{background-color:#71a436}.live-tile:hover .circle.tile-color-2{background-color:#512e90}.live-tile:hover .circle.tile-color-3{background-color:#0c7cd5}.live-tile:hover .circle.tile-color-4{background-color:#006974}.link-tile{background-color:#fff;border-radius:4px;margin:7px 7px 4px;padding:6px 10px;border:1px solid #fff}.link-tile>div:first-child{border-radius:50%;float:left;width:36px;text-align:center}.link-tile>div:first-child>i{line-height:36px;display:inline-block;font-size:16px;color:#fff}.link-tile>div:nth-child(2){position:relative;margin-left:44px}.link-tile>div:nth-child(2) label{cursor:pointer;color:#6a809b;margin:0;font-size:13px;line-height:20px}.link-tile:after{content:"";display:table;clear:both}.content-tile{border:2px solid #a7b4c4;border-radius:3px;margin-bottom:3px}.content-tile header{padding:5px 10px}.day-view{list-style:none;padding:0;margin:0}.day-view.indent-5>li{padding-left:5px}.day-view>li{border-left:5px solid #eaedf1;padding:10px 15px;border-bottom:1px dotted #dee3e9}.day-view>li i{margin:0 4px;color:#a7b4c4;line-height:22px}.day-view>li.day-event{border-left:5px solid #2196F3;padding-left:20px}tag-listing li{margin:2px 0}tag-listing li.tag-entry typeahead{display:inline-block;vertical-align:top}tag-listing li.tag-entry typeahead input[type=text]{width:100px;margin:0 4px;padding:3px 8px;border-radius:2px 0 2px 2px;background-color:transparent;font-size:10px}tag-listing li.tag-entry button.add{display:inline-block;position:relative;left:-8px;border:1px solid #ccc;border-left:none;border-radius:0 2px 2px 0;padding:0 7px 0 8px;line-height:20px}tag-listing li.tag-entry button.add i{margin:0;font-size:8px}.tags{position:relative;list-style:none;margin:0;padding:0}.tags li{display:inline-block;position:relative}.tags li.tag-entry .scrollable-dropdown-menu{display:inline-block}.tags li.tag-entry button.add{display:inline-block;position:relative;background-color:#3498db;left:-4px;border-radius:0 2px 2px 0;padding:0 7px 0 8px;line-height:20px}.tags .tag,.tags .tag>a{display:inline-block;line-height:22px}.tags li.tag-entry button.add i{color:#fff;margin:0;font-size:8px}.tags li.tag-entry button.add:hover{background-color:#5faee3}.tags .tag{background:#f0f2f5;border-radius:3px 0 0 3px;color:#666;height:22px;font-size:12px;padding:0 5px 0 23px;position:relative;margin:0 10px 10px 0;text-decoration:none;cursor:default;-webkit-transition:color .2s}.tags .tag::after,.tags .tag::before{background:#fff;content:'';position:absolute}.stage-artifacts-toolbar a:hover,.stage-info-artifacts>li a:hover{text-decoration:underline}.tags .tag>span{display:inline-block;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tags .tag>a{color:#c6ced8}.button-bar>*,.grip{vertical-align:middle;display:inline-block}.tags .tag>a i{display:inline-block;margin:0 3px;font-size:8px}.tags .tag>a:hover{color:#899aaf}.tags .tag::before{border-bottom:11px solid transparent;border-right:10px solid #f0f2f5;border-top:11px solid transparent;left:0;top:0}.tags .tag::after{border-radius:10px;box-shadow:inset 0 1px rgba(0,0,0,.25);height:6px;left:10px;width:6px;top:8px}.tags .tag:hover{background-color:#dee3e9}.tags .tag:hover::before{border-right-color:#dee3e9}.person-user{cursor:pointer;margin-left:5px}.attachment-button{display:inline-block;width:60px;height:30px;line-height:30px;border-radius:15px;background-color:#000;color:#fff;text-align:center;cursor:pointer}.attachment-button .attachment-count{font-weight:700;margin-right:8px;position:relative;top:-1px}.attachment-button .arrow-box{position:relative;background:#88b7d5}.attachment-button .arrow-box:after{top:100%;left:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-top-color:#88b7d5;border-width:8px;margin-left:-8px}.attachment-button.comments{background-color:#8BC34A}.attachment-button.comments:hover{background-color:#97c95d}.attachment-button.comments .arrow-box{background:#8BC34A}.attachment-button.comments .arrow-box:after{border-top-color:#8BC34A}.attachment-button.notes{background-color:#327BC1}.attachment-button.notes:hover{background-color:#68a1d8}.attachment-button.notes .arrow-box{background:#327BC1}.attachment-button.notes .arrow-box:after{border-top-color:#327BC1}.attachment-button.documents{background-color:#E8950C}.attachment-button.documents:hover{background-color:#f6b54b}.attachment-button.documents .arrow-box{background:#E8950C}.attachment-button.documents .arrow-box:after{border-top-color:#E8950C}.button-bar>*{margin:0 2px}.button-bar dropdown-button button.action-button{padding:2px 15px;font-size:inherit}.button-bar .separator{width:1px;height:32px;margin:0 5px;background-color:#eaedf1}widget-schema-display ul{list-style:none;padding:0;margin:0}widget-schema-display ul.indent-5>li{padding-left:5px}widget-schema-display ul li{border-top:1px solid #f0f2f5;padding:5px 0}widget-schema-display ul li .type kbd{padding:2px 5px;border:1px solid #eaedf1;background-color:#f0f2f5;font-family:'Courier New',Courier,monospace}widget-schema-display ul li.required>div>.name:after{content:'*'}widget-schema-display ul li[data-depth='0']:first-child{border-top:none}widget-schema-display ul li[data-depth='1'] .name span{display:inline-block;padding-left:20px}widget-schema-display ul li[data-depth='2'] .name span{display:inline-block;padding-left:40px}widget-schema-display ul li[data-depth='3'] .name span{display:inline-block;padding-left:60px}widget-schema-display ul li[data-depth='4'] .name span{display:inline-block;padding-left:80px}widget-schema-display ul li[data-depth='5'] .name span{display:inline-block;padding-left:100px}.array-editor{list-style:none}.array-editor>li{min-height:30px}.array-editor>li>span{margin-right:10px}.days-in-queue{display:inline-block;border-radius:3px;background-color:#eaedf1;line-height:18px;padding:5px 10px;margin:0 6px;text-align:center}.days-in-queue>label{font-weight:600;margin-bottom:0}.days-in-queue>small{font-size:9px}help-icon{display:inline-block;margin:0 0 0 5px;font-size:10px}.grip{margin-right:10px;cursor:move;opacity:.25}.grip:active,.grip:hover{opacity:1}sort-display{display:inline-block;margin:0 5px}sort-display>label,sort-display>ul{margin:0;display:inline-block;vertical-align:middle}sort-display>label{font-size:10px;font-weight:600;text-transform:uppercase}sort-display button.action-button{display:inline-block;vertical-align:middle;line-height:18px;padding:0 5px}sort-display>ul{padding:0;list-style:none}sort-display>ul li{display:inline-block;box-sizing:border-box;margin:0 3px;padding:0 5px;border-radius:3px;border:1px solid #dee3e9;background-color:#f0f2f5}sort-display>ul li>div{display:flex}sort-display>ul li>div .grip,sort-display>ul li>div button{flex:1 1}sort-display>ul li>div .grip{margin-right:5px}sort-display>ul li>div .grip i{position:relative;top:1px}sort-display>ul li>div .name{position:relative;top:1px;font-size:11px}sort-display>ul li>div button,sort-display>ul li>div button:active,sort-display>ul li>div button:hover{background-color:inherit;border:none;border-radius:0;margin:0;padding:0 2px;color:#a7b4c4}sort-display>ul li>div button i{margin:0}sort-display>ul li>div button.sort-direction{margin-left:5px;font-size:16px}sort-display>ul li>div button.sort-direction.desc i{position:relative;top:3px}sort-display>ul li>div button.remove{margin-left:6px;padding-left:7px;border-left:1px solid #dee3e9;font-size:8px}sort-display>ul li>div button.remove i{position:relative;top:1px}sort-display>ul li>div button:hover{color:inherit}sort-display .dropdown-button{margin:0 3px}sort-display .dropdown-button .dropdown-button-menu{top:24px}.animate{overflow:hidden}.animate.height{transition:height .5s}.animate.height.open{height:300px}.animate.height.closed{height:0}.days-till-due{text-align:center;border:2px solid #dee3e9;border-radius:3px;margin:5px 10px;min-width:65px}.days-till-due label{margin-top:8px;line-height:8px;font-size:15px;margin-bottom:0}.days-till-due>div{text-align:center;font-size:8px;text-transform:uppercase;background-color:#f6f8f9;white-space:nowrap}.days-till-due>small{line-height:8px;font-size:9px;font-weight:600;margin-bottom:5px}.days-till-due.overdue{border:2px solid #FFA000}.days-till-due.overdue label{color:#FFA000}.days-till-due.overdue>div{background-color:#FFECB3;color:#805000}.absolute-messages .help-block{position:absolute}.persona-selector-overlay{position:fixed;top:0;left:0;right:0;bottom:0;padding:25px 0;text-align:center}.persona-selector{box-shadow:3px 3px 4px 2px rgba(135,135,135,.4);text-align:left;display:inline-block;border:1px solid #dee3e9;min-width:400px;border-radius:4px 4px 0 0}.persona-selector header{border-radius:4px 4px 0 0;background-color:#666;color:#fff;padding:10px 15px}.persona-selector section{background-color:#fff}.persona-selector section ul{list-style:none;padding:0;margin:0}.persona-selector section ul.indent-5>li{padding-left:5px}.persona-selector section ul li{border-bottom:1px solid #dee3e9;cursor:pointer;padding:15px}.persona-selector section ul li div:first-child{float:left}.persona-selector section ul li div:first-child .person-circle{border-radius:50%;width:41px;height:41px;text-align:center}.persona-selector section ul li div:first-child .person-circle i{color:#fff;font-size:25px;line-height:39px;display:inline-block}.persona-selector section ul li div:nth-child(2){position:relative;margin-left:54px;padding:7px 0;font-size:20px}.persona-selector section ul li:after{content:"";display:table;clear:both}.persona-selector section ul li div:first-child .person-circle,.persona-selector section ul li:hover{background-color:#a7b4c4}.persona-selector section ul li:hover div:first-child .person-circle{background-color:#899aaf}.persona-selector section ul li:hover div:nth-child(2){color:#fff}.acceptance-button-pair{min-width:110px;padding:10px 0}.acceptance-button-pair>button{padding:0 8px;min-width:40px;font-size:10px;line-height:20px;font-weight:600}.acceptance-button-pair>button.primary{min-width:40px;padding:0 8px;background-color:#8BC34A;border:1px solid #8BC34A}.acceptance-button-pair>button.primary:hover{background-color:#71a436}.timeline .line-hz-connector{position:absolute;top:8px;left:-17px;border-bottom:2px solid #c6ced8;width:16px}.timeline:first-child .line-hz-connector{display:none}.timeline .line-vr{position:absolute;top:16px;bottom:0;left:7px;border-right:1px solid #c6ced8}.timeline .timeline-item{position:relative;margin:10px 0;padding-left:30px}.timeline .timeline-item .timeline-line{border-left:1px solid #c6ced8;position:absolute;top:0;bottom:14px;left:7px}.timeline .timeline-item .timeline-item-branch{position:relative;left:-30px}.timeline .timeline-item .timeline-item-branch .outer-circle{z-index:1002;cursor:pointer}.timeline .timeline-item .timeline-item-branch .outer-circle.disabled{cursor:default}.timeline .timeline-item .timeline-item-branch .line-hz-after{position:absolute;top:7px;left:16px;width:10px;border-top:1px solid #c6ced8}.timeline .timeline-item .timeline-block{position:relative;top:-3px;min-height:21px}.timeline .timeline-item .timeline-block .title{font-weight:400;line-height:16px;margin-bottom:10px;margin-top:10px}.timeline .timeline-item .timeline-block.current,.timeline .timeline-item .timeline-block.visible{position:relative;top:-9px;left:-23px;margin-right:-23px;padding:6px 0 6px 22px;border:1px solid #899aaf;line-height:20px;box-shadow:7px 7px 5px 0 #eaedf1}.dialog,.modal{box-shadow:2px 2px 2px 0 rgba(25,25,25,.4)}.timeline>.timeline-item .timeline-item .timeline-item-branch .line-hz-before{position:absolute;top:7px;left:-22px;width:22px;border-top:1px solid #c6ced8}.under-construction{text-align:center}.under-construction .circle{width:48px;height:48px;background-color:#F57C00;text-align:center;margin:10px auto}.under-construction h3,.under-construction p{margin:10px 0;color:#6a809b}.under-construction .circle i{font-size:24px;color:#fff;line-height:48px}.under-construction h3{font-size:15px;font-weight:600;text-transform:uppercase}.artifacts-inline{list-style:none;padding:0;margin:0}.artifacts-inline.indent-5>li{padding-left:5px}.artifacts-inline>li{padding:5px;margin-right:16px;display:inline-block;text-align:center}.comm-circle,.docs-circle,.findings-circle{border-radius:50%;margin:auto;height:36px;width:36px}.artifacts-inline>li>i{display:block;font-size:18px;color:#6a809b}.comm-circle i,.docs-circle i,.findings-circle i{font-size:16px;line-height:36px;display:inline-block}.artifacts-inline>li small{font-weight:600;text-transform:uppercase}.comm-circle{background-color:#4CAF50}.comm-circle i{color:#fff}.docs-circle{background-color:#03A9F4}.docs-circle i{color:#fff}.findings-circle{background-color:#0288D1}.findings-circle i{color:#fff}.overlay{position:fixed;top:0;left:0;height:100%;width:100%;z-index:2000;background-color:rgba(0,0,0,.3)}.overlay-inline{position:absolute;top:0;left:0;bottom:0;right:0;background-color:#dee3e9;opacity:.95;text-align:center;padding:10px}.modal{position:relative;background-color:#fff;border:1px solid #212121;margin-left:15vw;margin-top:15vh;width:70vw;height:70vh}.modal.auto{margin-left:20vw;margin-right:20vw;margin-top:25vh;width:auto;height:auto}.modal.auto .modal-body{position:static;bottom:auto;top:auto}.modal.auto .modal-footer{position:static}.modal.sm{margin:20vh auto auto;width:30vw;height:30vh}.modal.md{margin:25vh auto auto;width:40vw;height:40vh}.modal .modal-header{height:42px;line-height:42px;background-color:#4d4d4d;color:#fff;border-bottom:1px solid #dee3e9}.modal .modal-header label{position:relative;margin-right:30px;padding-left:15px;overflow:hidden}.modal .modal-body,.modal .modal-footer{position:absolute;bottom:0;right:0;left:0}.modal .modal-header button.close-button{float:right;background:0 0;border:none;padding:0 10px}.modal .modal-header button.close-button>i{color:#fff;line-height:42px;display:inline-block}.modal .modal-body{top:42px;overflow:hidden}.modal .modal-body .scrollable-container{height:100%;overflow-y:scroll}.modal .modal-body .scrollable-container.with-search,.modal .modal-body .scrollable-container>section{overflow-y:auto}.modal .modal-body .scrollable-container.with-search header{padding:5px 15px;height:34px;line-height:34px;border-bottom:1px solid #dee3e9}.modal .modal-body .scrollable-container.with-search section{position:absolute;top:45px;left:0;right:0;bottom:0}.modal .modal-body .scrollable-container.with-search section>div{height:100%}.modal .modal-footer{border-top:1px solid #dee3e9;height:42px;background-color:#fff}.modal .modal-footer .padded-footer{padding:5px 15px}.modal.with-footer .modal-body{bottom:42px}.dialog{position:relative;background-color:#fff;width:70vw;height:70vh;margin-left:15vw;margin-top:15vh;border-radius:6px 6px 4px 4px}.dialog.sm{margin:20vh auto auto;width:30vw;height:30vh}.dialog.sm .dialog-content{height:calc("@height-sm" - "@dialog-header-height")}.dialog.md{margin:25vh auto auto;width:40vw;height:40vh}.dialog.md .dialog-content{height:calc("@height-md" - "@dialog-header-height")}.dialog>header{padding:0;border-bottom:1px solid #dee3e9;height:35px;border-radius:4px 4px 0 0;background-color:#eaedf1}.dialog>header label{position:relative;padding:0 15px;margin-right:30px;overflow:hidden;line-height:35px;text-transform:uppercase;font-size:11px;color:#666}.dialog>header button.close-button{float:right;background:#eaedf1;line-height:27px;margin:4px;padding:0 8px;text-align:center;border:none;color:#666}.account-placard>div:first-child,.address-edit-form .region-line>div,.address-list-item>div,.email-list-item>div,.group-member-search>li .contact-frame,.item-listing .with-doc-marker>div:first-child,.item-listing .with-folder-marker>div:first-child,.phone-list-item>div,.team-member-search>li .contact-frame{float:left}.dialog .dialog-content .padded-content,.upload-progress-layout .item-row .file-container{padding:5px 10px}.dialog>header button.close-button i{font-size:10px;margin:0}.dialog>header button.close-button:hover{background-color:#c6ced8}.dialog>header:after{content:"";display:table;clear:both}.dialog .dialog-content{position:absolute;top:35px;left:0;right:0;bottom:0;overflow-x:hidden;overflow-y:auto;max-height:calc("@height" - "@dialog-header-height");background-color:#fff}.dialog .dialog-content>div{position:relative}.dialog .dialog-content .scrollable-container{position:absolute;top:0;bottom:0;left:0;right:0;overflow-y:auto}.dialog .dialog-content .scrollable-container::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 4px rgba(0,0,0,.3);border-radius:4px;background-color:#F5F5F5}.dialog .dialog-content .scrollable-container::-webkit-scrollbar{width:8px;background-color:#F5F5F5}.dialog .dialog-content .scrollable-container::-webkit-scrollbar-thumb{border-radius:4px;-webkit-box-shadow:inset 0 0 4px rgba(0,0,0,.3);background-color:#6a809b}.scrollable-within-dialog{position:absolute;top:80px;bottom:0;right:0;left:0;overflow-y:scroll;border-top:1px solid #dee3e9}.upload-progress-layout .item-row{border-bottom:1px solid #dee3e9}.upload-progress-layout .item-row .file-container>span{display:inline-block;max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.upload-progress-layout .item-row .file-container .progress-bar-container{margin:5px 0}.upload-progress-layout .item-row .status-container{text-align:center;color:#a7b4c4;padding-top:10px}.upload-progress-layout .item-row .status-container i{display:block;line-height:18px;font-size:22px}.upload-progress-layout .item-row .status-container span{line-height:9px;font-size:9px}.library-breadcrumbs{display:inline-block;vertical-align:middle;padding:5px 15px;line-height:20px;font-size:11px;font-weight:600}.library-breadcrumbs ul{list-style:none;padding:0;margin:0}.library-breadcrumbs ul.indent-5>li{padding-left:5px}.library-breadcrumbs ul li{display:inline-block;font-size:11px;margin:0;text-transform:uppercase}.library-breadcrumbs ul li label{margin-bottom:0}.library-breadcrumbs ul li>a:after{display:inline-block;margin:0 5px;content:'/'}.doc-reference-list-item:after,.library-breadcrumbs ul:after{content:"";display:table;clear:both}.library-search-results{padding:5px 15px 0}.library-search-results h4{font-weight:700;margin-right:3px}.library-search-results button{vertical-align:top;margin:6px}.doc-reference-list-item .doc-info{position:relative;margin-left:35px}.uploads-container{border-top:solid 1px #dee3e9}.uploads-container .no-files{text-align:center}.library-type-header{padding:3px 0;border-bottom:1px dotted #dee3e9}.library-type-header h4{display:inline-block;margin-right:8px}.progress-bar-container{width:95%;height:6px;border-radius:3px}.progress-bar-container .progress-bar{height:6px;background-color:#8BC34A;opacity:.9}.item-listing .with-doc-marker>div:first-child i,.item-listing .with-folder-marker>div:first-child i{display:inline-block;font-size:20px;line-height:26px}.item-listing .with-doc-marker>div:first-child i.small,.item-listing .with-folder-marker>div:first-child i.small{font-size:18px}.item-listing .with-doc-marker>div:nth-child(2),.item-listing .with-folder-marker>div:nth-child(2){position:relative;margin-left:30px;overflow:hidden}.item-listing .with-doc-marker>div:nth-child(2) .title,.item-listing .with-folder-marker>div:nth-child(2) .title{text-overflow:ellipsis;font-weight:600;font-size:12px}.item-listing .with-doc-marker>div:first-child i{color:#dee3e9}i.folder-collapsed,i.folder-expanded{cursor:pointer;color:#a7b4c4}i.folder-collapsed:hover,i.folder-expanded:hover{color:#98a7ba}i.folder-expanded{color:#899aaf}.folder-path{padding:5px 15px;font-size:12px;border-bottom:1px dotted #dee3e9}.folder-path>label{display:inline-block;text-transform:uppercase}.folder-path ul{display:inline-block;list-style:none;padding:0;margin:0}.folder-path ul.indent-5>li{padding-left:5px}.folder-path ul>li{display:inline-block;margin:0 2px}.folder-path ul>li:after{content:'>'}.folder-path ul>li:first-child:after,.folder-path ul>li:last-child:after{content:''}.folder-path ul>li:first-child i{display:inline-block;color:#a7b4c4}.folder-path ul>li:last-child{font-weight:600}.documents-container>.folder-item{position:relative;float:left;width:225px;height:80px}.documents-container>.folder-item .name-plate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:0}.documents-container>li{padding:5px;margin:15px}.file-upload-find-drag-area{text-align:center;color:#3498db;font-size:14px;border-radius:3px;border:1px dashed #3498db;margin:5px 0;padding:15px;cursor:pointer;font-weight:600}.file-upload-find-drag-area:hover{border:1px solid #3498db}.file-upload-table tr>td,.file-upload-table tr>th,.org-listing-row,.person-listing-row{border-bottom:1px solid #dee3e9}.file-upload-button-container{padding:5px 15px;text-align:right}.file-upload-button-container>button{font-weight:600;background-color:#f0f2f5;min-width:60px;font-size:12px}.file-upload-button-container>button>i{display:inline-block;font-weight:400;color:#a7b4c4;margin-right:5px}.file-upload-table-container{padding:5px 0}.file-upload-table{border-collapse:collapse;font-size:12px;border:1px solid #dee3e9}.file-upload-table td,.file-upload-table th{padding:3px 6px;margin:0}.file-upload-table tr>th{font-weight:600;text-align:left;background-color:#f0f2f5;border-right:1px solid #dee3e9}.file-upload-table tr>th:last-child{border-right:none}.file-upload-table tr>td{border-right:1px solid #dee3e9}.file-upload-table tr>td:last-child{border-right:none}.file-upload-table td.file-size,.file-upload-table td.file-status{font-size:11px}.file-upload-table td.cell-with-icon{text-align:center;min-width:18px;padding:3px}.file-upload-table td.cell-with-icon i{display:inline-block;line-height:22px;font-size:16px;vertical-align:middle}.file-upload-table tr.error-row td{color:#AA0021}.profile-editing-buttons button{width:125px;height:30px}.account-placard>div:nth-child(2){position:relative;margin-left:45px}.account-placard:after{content:"";display:table;clear:both}.account-link-buttons{position:relative;padding:10px 15px}.account-link-buttons .compressed{padding:5px 15px}.org-listing-row>div:first-child,.person-listing-row>div:first-child{padding:10px 0 10px 15px}.org-listing-row>div:nth-child(2),.person-listing-row>div:nth-child(2){position:relative;padding:10px 15px}.org-listing-row>div:nth-child(2) .compressed,.person-listing-row>div:nth-child(2) .compressed{padding:5px 15px}.org-listing-row>div:nth-child(2) a,.person-listing-row>div:nth-child(2) a{font-weight:600}.person-profile-display span.person-display,.type-label{font-weight:400}.person-profile-container{position:relative;padding:10px 15px;line-height:25px}.person-profile-container .compressed{padding:5px 15px}.person-profile-picture{width:48px;padding:10px 5px 10px 15px;text-align:center}.person-profile-picture>div{border-radius:50%;display:inline-block;text-align:center;width:35px;height:35px;background-color:#c6ced8;color:#fff}.person-profile-picture>div>i{font-size:20px;line-height:35px}.type-label{display:inline-block;margin:5px 5px 5px 0;width:115px}.address-display{display:inline-block;line-height:28px}.address-edit-form .region-line:after,.address-list-item:after,.email-list-item:after,.phone-list-item:after{content:"";display:table;clear:both}.address-list-item>div:first-child,.email-list-item>div:first-child,.phone-list-item>div:first-child{min-width:275px}.address-list-item .comma-seperator em,.email-list-item .comma-seperator em,.phone-list-item .comma-seperator em{font-weight:600}.address-edit-form input[type=text]{margin-bottom:5px;width:240px}.address-edit-form select{margin-bottom:5px;width:250px}.address-edit-form .region-line input[type=text].city-input,.address-edit-form .region-line input[type=text].postal-code-input{width:105px;margin-right:5px}.address-edit-form .region-line .state-select{width:130px;margin-right:7px}.address-edit-form .show-line{display:inline-block;font-size:10px;margin-left:5px}@media only screen and (max-width:390px){.address-edit-form input[type=text]{width:180px}.address-edit-form select{width:190px}}.flex-address-item{padding:0 15px 8px 0;min-width:225px}.permission-listing>li .flex-layout .access-level,.team-search-container button{min-width:80px}.contact-display>strong{font-style:normal;font-size:14px;font-weight:600}.decision-display{line-height:26px}.group-member-role-desc,.liaison-type-display{line-height:30px}.decision-display label{text-transform:uppercase;margin:0;padding:5px 15px 0 0;background-color:#fff;font-family:Roboto;font-weight:500;font-size:18px;color:#0288D1}.person-display{font-weight:600;display:inline-block}.person-display.large{font-size:16px}.person-display.large>span{font-weight:400;font-size:16px}.group-role-list{list-style:none;padding:0;margin:0}.group-role-list.indent-5>li{padding-left:5px}.group-member-role-desc em{display:inline-block;font-style:normal;font-weight:600;margin-right:15px}.group-member-search>li:after,.team-member-search>li:after{display:table;content:"";clear:both}.group-member-role-desc .role-date{font-weight:600}.group-member-role-desc small{font-size:12px}.group-member-search>li{position:relative}.group-member-search>li .member-detail-frame{position:relative;margin-left:50px}.team-member-search>li{position:relative}.team-member-search>li .match-frame{float:right}.team-member-search>li .match-frame>div{border-radius:3px;border:2px solid #dee3e9;padding:5px 15px;text-align:center}.team-member-search>li .match-frame>div.good-match{border:2px solid #8BC34A}.team-member-search>li .match-frame>div.good-match label{color:#8BC34A}.team-member-search>li .match-frame>div.bad-match{border:2px solid #E8950C}.team-member-search>li .match-frame>div.bad-match label{color:#E8950C}.team-member-search>li .match-frame>div label{margin-bottom:0}.team-member-search>li .member-detail-frame{position:relative;margin-left:20px;margin-right:100px}.group-list-item>i,.program-list-item i,.program-list-item label{display:inline-block}.group-list-item>i{font-size:18px;color:#c6ced8;margin-right:5px}.program-list-item i{font-size:16px;margin-right:5px;color:#c6ced8}.program-list-item small{display:block;padding-left:24px}.affiliation-list-item>div:first-child{float:left}.affiliation-list-item>div:first-child i{color:#c6ced8;font-size:18px}.affiliation-list-item>div:nth-child(2){position:relative;margin-left:30px}.affiliation-list-item>div:nth-child(2) label{font-weight:400}.liaison-type-display em{display:inline-block;font-style:normal;font-weight:600;margin-right:15px}.liaison-type-display .role-date{font-weight:600}.liaison-type-display small{font-size:12px}textarea.summary{display:block;box-sizing:border-box;padding:10px;min-height:175px;width:100%;resize:vertical}.team-search-container{border-bottom:1px solid #dee3e9;padding:5px 15px}.effective-date-edit input[type=text]{width:84px}.effective-date-edit input[type=number]{width:60px}.effective-date-edit select{width:80px}.effective-date-edit form{display:inline-block}.tb-slot-available{position:relative;text-align:center;width:70px;padding:10px;color:#8BC34A}.tb-slot-available .icon-calendar{color:#dee3e9;font-size:24px}.tb-slot-available .icon-check{color:#8BC34A;font-size:16px;position:absolute;top:22px;left:18px}.tb-slot-available small{display:block;text-transform:uppercase;font-size:10px;font-weight:600}.tb-member-summary{padding:5px 10px;line-height:25px}.tb-member-summary ul{vertical-align:bottom}.tb-member-summary .languages,.tb-member-summary .skills{font-size:12px}.tb-member-summary .conflicts-listing{list-style:none;padding:0;margin:0}.tb-member-summary .conflicts-listing.indent-5>li{padding-left:5px}.tb-member-summary .conflicts-listing>li{padding:0;font-size:12px}.tb-member-summary .conflicts-listing>li i{display:inline-block;color:#c6ced8;margin-right:5px}.tb-relevance-match{text-align:center;padding:10px}.relevance-match{padding:4px 15px;border-radius:2px;background-color:#eaedf1;text-align:center}.relevance-match label{font-weight:600;line-height:5px;margin:5px 0 2px}.process-info-ss .no-items,.process-info-ss .process-info,.process-info-ss .task-info{margin-bottom:25px}.relevance-match small{font-size:9px;line-height:5px;text-transform:uppercase}.relevance-match.match-90{background-color:#8BC34A;color:#fff}.relevance-match.match-80{background-color:#a4d070;color:#fff}.relevance-match.match-70{background-color:#bcdc97;color:#fff}.relevance-match.match-60{background-color:#fff;color:#8BC34A}.relevance-match.match-50{background-color:#FE9700;color:#fff}.relevance-match.match-40{background-color:#ffac32;color:#fff}.relevance-match.match-30{background-color:#ffc165;color:#fff}.relevance-match.match-20{background-color:#ffeacb;color:#FE9700}.relevance-match.match-10{background-color:#fff;color:#FE9700}.process-info-ss>label{text-transform:uppercase}.process-info-ss .process-info i,.process-info-ss .task-info i{display:inline-block;color:#c6ced8;font-size:16px;margin-right:4px}.process-info-ss .process-info a,.process-info-ss .task-info a{display:inline-block;font-weight:600;padding:2px 0 5px;font-size:15px}.name-change-request{position:relative;padding:10px 15px}.name-change-request .compressed{padding:5px 15px}.name-change-request>div{margin-bottom:10px;font-size:14px}.name-change-request>div h3{margin-bottom:15px}.name-change-request input[type=text]{width:350px;font-size:14px}.name-change-request .from-label,.name-change-request .to-label{display:inline-block;font-size:10px;text-transform:uppercase;width:40px}.name-change-request .buttons-container{padding-left:40px}.contact-frame{position:relative;margin-right:10px;cursor:pointer}.contact-frame>div:first-child{position:absolute;top:-8px;left:-8px;padding:3px;background-color:#fff;border-radius:3px}.contact-frame>div:first-child i{font-size:16px}.contact-frame em{font-weight:600;font-size:14px}.contact-frame .icon-plus-circle{color:#dee3e9}.contact-frame:hover .icon-plus-circle{color:#327BC1}.permission-listing{list-style:none;padding:0;margin:0}.permission-listing.indent-5>li{padding-left:5px}.permission-listing>li .flex-layout{width:500px}.permission-listing>li .flex-layout .perm-name{font-weight:600;padding:6px 15px}.permission-listing>li .flex-layout .access-level>a{display:inline-block;margin:6px;padding-left:5px;font-weight:600}.permission-listing>li .flex-layout .access-level>label{font-weight:400;margin:6px}.permission-item{background-color:#f6f8f9;padding:5px 10px;margin-bottom:2px;cursor:pointer}.permission-item .expander-component{vertical-align:middle;margin-right:3px}.permission-item>span{display:inline-block;vertical-align:middle}.permission-row{font-size:12px}.admin-options{list-style:none;padding:0;margin:0}.admin-options.indent-5>li{padding-left:5px}.admin-options>li{vertical-align:top;display:inline-block;width:200px;margin:0 25px 20px 0}.admin-options>li>a>label{cursor:pointer;font-size:14px;color:#6a809b;margin-bottom:0}.admin-options>li>a>label i{display:inline-block;margin-right:6px}.admin-options>li>small{display:inline-block;margin-left:20px}.admin-options>li>ul{padding:0;margin-left:40px}.admin-options>li>ul>li{padding:5px 0;font-size:12px}.module-edit-form label{float:left;margin-right:5px}.checkbox-list-horizontal{list-style:none;padding:0;margin:0}.checkbox-list-horizontal.indent-5>li{padding-left:5px}.checkbox-list-horizontal li{float:left;width:135px}.checkbox-list-horizontal li label{font-weight:400}.checkbox-list-horizontal:after{content:"";display:table;clear:both}.hover-show-children .hover-show-me{visibility:hidden}.hover-show-children:hover .hover-show-me{visibility:visible}.listing-button:hover{color:#1d6fa5}.listing-button{cursor:pointer;color:#3498db}.focusable:hover{background-color:#dee3e9}.col-group.listing-group,.listing-group{padding:10px;border-top:1px solid #dee3e9}.choice-list-item{padding:5px 15px}.choice-list-item .left-select{float:left;width:48px}.choice-list-item .left-select a,.choice-list-item .left-select i{display:inline-block;padding:3px}.choice-list-item .left-select a i,.choice-list-item .left-select i i{border-radius:3px;display:inline-block;font-size:12px}.choice-list-item .left-select a i:hover,.choice-list-item .left-select i i:hover{color:#fff;background-color:#3498db}.choice-list-item .choice-name-input{position:relative;margin-left:50px}.choice-list-item:after{content:"";display:table;clear:both}.widget-highlight{background-color:rgba(0,0,200,.3);color:#fff;text-shadow:2px 1px 2px #000}.widget-highlight:hover{background-color:rgba(0,0,200,.8)}.asterisk{display:inline-block;font-size:7px;color:#E8950C;line-height:10px;vertical-align:top}.decision-group-profile div.date-col{width:115px;min-width:115px}.decision-group-profile div.date-col>span{display:block}.decision-group-profile div.button-col{width:100px;min-width:100px;text-align:right;padding-right:0}@media only screen and (max-width:640px){.decision-group-profile div.button-col{text-align:left}}.process-status-display{display:inline-block}.process-status-display span:first-child{display:inline-block;min-width:80px}.status-marker{border-radius:50%;width:11px;height:11px;display:inline-block;font-size:10px;background-color:#f0f2f5;margin-right:3px}.status-marker.in-progress{background-color:#0288D1}.status-marker.complete{background-color:#4CAF50}.due-date-marker{display:inline-block;padding:0 6px;font-size:11px;border-radius:3px;font-weight:600;line-height:17px}.due-date-marker.coming-due{border:2px solid #FE9700;color:#FE9700}.due-date-marker.overdue{border:2px solid #FFA000;color:#FFA000}.stage-status-row{border-radius:3px;border:2px solid #fff}.stage-status-row>div:first-child{width:32px!important;text-align:center}.stage-status-row>div:first-child i{color:#eaedf1;font-size:16px;line-height:32px}.stage-status-row>div:nth-child(2){padding:5px 10px;width:100%;color:#6a809b}.stage-status-row>div:nth-child(3){padding:5px 10px;width:105px!important}.stage-status-row>div:nth-child(3)>span{display:inline-block;font-size:11px;background-color:#f0f2f5;min-width:95px;text-align:center;border-radius:2px}.stage-status-row.current{border:2px solid #3498db}.ss-artifacts-row,.ss-stage-row{border-bottom:1px solid #dee3e9}.stage-status-row.current>div:first-child i{color:#3498db}.stage-status-row.current>div:nth-child(2){font-weight:600}.stage-status-row.complete>div:first-child i{color:#8BC34A}.stage-status-row.complete>div:nth-child(3)>span{background-color:#8BC34A;color:#fff}.ss-stage-row>div:first-child{text-align:center;background-color:#f6f8f9;width:38px}.ss-stage-row>div:first-child i{margin-top:20px;display:inline-block;font-size:14px;color:#c6ced8}.ss-artifacts-row>div:first-child{width:36px;text-align:center;height:32px;cursor:pointer}.ss-artifacts-row>div:first-child i{display:inline-block;font-size:14px;color:#fff;line-height:32px}.ss-artifacts-row>div:nth-child(2){padding:0 10px}.ss-artifacts-row>div:nth-child(2) label{margin-bottom:0;font-size:12px;line-height:32px;text-transform:uppercase;color:#6a809b}.no-artifacts{padding:20px 15px 20px 46px;color:#899aaf}.stage-progress-list{list-style:none;padding:0;margin:0}.stage-progress-list.indent-5>li{padding-left:5px}.stage-progress-list>li{padding:6px 10px;border:2px solid #fff}.stage-progress-list>li>i{float:left;display:inline-block;width:32px;color:#eaedf1;font-size:16px}.stage-progress-list>li>span{position:relative;display:inline-block;font-size:14px;color:#899aaf}.stage-progress-list>li.complete>i{color:#8BC34A}.stage-progress-list>li.complete>span,.stage-progress-list>li.current>i{color:#6a809b}.stage-progress-list>li.current{border-radius:3px;border:2px solid #6a809b}.stage-progress-list>li.current>span{color:#6a809b;font-weight:600}.process-instance-grid .header-row>div.completion,.process-instance-grid .instance-row>div.completion{min-width:40px;max-width:40px;text-align:right}.run-dates{margin-top:5px;padding-left:10px;font-size:11px}.run-dates input[type=text]{font-size:11px;width:65px;border:none}.run-dates label{padding:1px;font-size:10px;background-color:#eaedf1;text-transform:uppercase}.run-dates span{display:inline-block;padding:1px}.run-dates>div{display:inline-block;min-width:75px;margin-right:8px;margin-bottom:5px;text-align:center;border:1px solid #dee3e9;border-radius:3px}.process-status-marker{display:inline-block;text-align:center;background-color:#eaedf1;border-radius:3px;margin-right:10px;font-size:11px;width:250px;padding:0;font-weight:600}.stage-placard-info{border-top:1px dotted #dee3e9;margin-top:10px;padding:10px 0}.stage-placard-info select{width:150px}.stage-placard-info input[type=text]{width:90px}.stage-placard-info>div{float:left;min-width:125px;text-align:center}.stage-placard-info:after{content:"";display:table;clear:both}.process-nav{list-style:none;margin:0;padding:5px 10px;text-align:right}.process-nav.indent-5>li{padding-left:5px}.process-nav>li{display:inline-block;cursor:pointer;text-align:center;padding:5px 10px;border-radius:3px;border:2px solid #c6ced8;min-width:50px;font-size:11px;text-transform:uppercase;color:#899aaf}.process-nav>li:hover,.process-nav>li:hover i{color:#6a809b}.process-nav>li.selected{background-color:#6a809b;color:#fff}.process-nav>li.selected i{color:#fff}.process-nav i{display:block;font-size:22px;color:#a7b4c4}.org-processes-due>li,.processes-due>li{font-size:12px;border-bottom:1px dotted #dee3e9}.processes-due{list-style:none;padding:0;margin:0}.processes-due.indent-5>li{padding-left:5px}.processes-due>li{padding:10px 15px;text-transform:uppercase}.processes-due>li:after{content:"";display:table;clear:both}.processes-due>li i{display:inline-block;color:#dee3e9;margin-right:4px}.processes-due>li.due-warning{font-weight:600}.processes-due>li.due-warning i{color:#6a809b}.org-processes-due{list-style:none;padding:0;margin:0}.org-processes-due.indent-5>li{padding-left:5px}.org-processes-due>li{padding:10px 15px}.org-processes-due>li>div:first-child{float:right}.org-processes-due>li>div:not(:first-child){position:relative;margin-right:80px}.outer-circle,.outer-circle .inner-2,.outer-circle .inner-circle{border-radius:50%;position:absolute}.org-processes-due>li:after{content:"";display:table;clear:both}.org-processes-due>li i{display:inline-block;color:#dee3e9;margin-right:4px}.org-processes-due>li .process-title{color:#888;display:inline-block;font-size:11px;font-weight:600;text-transform:uppercase;margin-left:20px}.org-processes-due>li .assignee{color:#888;font-size:11px;display:block;line-height:20px;text-align:right;padding-right:6px}header.process-summary{padding:5px 15px;border-bottom:1px dotted #dee3e9}.outer-circle{display:inline-block;line-height:10px;background-color:#c6ced8;width:16px;height:16px;vertical-align:middle}.outer-circle .inner-circle{background-color:#fff;width:10px;height:10px;margin:-5px 0 0 -5px;top:50%;left:50%}.outer-circle .inner-2{background-color:#6a809b;width:6px;height:6px;margin:-3px 0 0 -3px;top:50%;left:50%}.stage-item-listing{list-style:none;padding:0;margin:0;position:relative}.stage-item-listing.indent-5>li{padding-left:5px}.stage-item-listing>li .outer-circle.complete{background-color:#8BC34A}.stage-item-listing>li .outer-circle.overdue{background-color:#FE9700}.stage-item-listing>li .outer-circle.in-progress{background-color:#0288D1}.stage-artifacts-toolbar,.stage-info-artifacts>li.selected{background-color:#f0f2f5}.stage-info-details{list-style:none;padding:0;margin:0}.stage-info-details.indent-5>li{padding-left:5px}.stage-info-details>li{display:inline-block;margin-right:15px;margin-bottom:10px;min-width:80px}.stage-info-details>li label{margin-bottom:0;font-weight:600;text-transform:uppercase;font-size:10px}.stage-info-details>li input.date-picker{width:80px}.stage-info-artifacts{list-style:none;padding:0;margin:0}.stage-info-artifacts.indent-5>li{padding-left:5px}.stage-info-artifacts>li{display:inline-block;font-size:11px;text-transform:uppercase;color:#6a809b;margin-right:15px;padding:5px 12px;border-radius:3px 3px 0 0;cursor:pointer}.stage-info-artifacts>li i{font-size:13px;margin-right:2px}.stage-info-artifacts>li a{color:#6a809b}.stage-artifacts-toolbar{padding:5px 10px}.stage-artifacts-toolbar a{display:inline-block;font-size:12px;font-weight:600;line-height:24px}.stage-artifacts-comm-listing .not-viewed{font-weight:600}.stage-buttons{position:absolute;right:10px;top:0;min-width:80px;margin-top:10px}.stage-buttons button{color:#fff;background-color:#268fd5;font-size:10px;font-weight:600;text-transform:uppercase;padding:1px 10px;min-width:65px}.stage-buttons button:hover{background-color:#2383c4}.milestone-timeline{padding:10px}.milestone-timeline ul{list-style:none;padding:0;margin:0}.milestone-timeline ul.indent-5>li{padding-left:5px}.milestone-timeline ul>li .milesstone-row1{line-height:13px}.milestone-timeline ul>li .milesstone-row1>i{display:inline-block;font-size:16px;vertical-align:middle;color:#dee3e9}.milestone-timeline ul>li .milesstone-row1>i.achieved{color:#8BC34A}.milestone-timeline ul>li .milesstone-row1 .milestone-line-hz{display:inline-block;width:10px;margin-left:-2px;height:2px;border-top:2px dotted #c6ced8}.milestone-timeline ul>li .milesstone-row1 .milestone-text{display:inline-block;vertical-align:middle;color:#899aaf}.milestone-timeline ul>li .milesstone-row1 .milestone-text.achieved{color:#6a809b;font-weight:600}.milestone-timeline ul>li .milesstone-row2{position:relative;height:22px}.milestone-timeline ul>li .milesstone-row2 .milestone-line-vr{position:absolute;width:2px;border-left:2px solid #c6ced8;top:0;bottom:0;left:7px}a.top-right,button.top-right{top:10px;right:10px;z-index:500}.milestone-timeline ul>li:last-child .milesstone-row2{display:none}.pager-controls-container>span.pager-button{background-color:#eaedf1;color:#6a809b}.pager-controls-container>span.pager-button:hover{background-color:#c6ced8}.comm-facets .search-facets button:first-child.selected{background-color:#3F51B5;color:#fff}.comm-facets .search-facets button:nth-child(2).selected{background-color:#7986CB;color:#fff}.flex-layout .toolbar-row{padding-left:15px}.flex-layout .communication-item-row{border-bottom:1px solid #dee3e9;line-height:26px;font-size:12px}.flex-layout .communication-item-row .author{font-size:13px;font-weight:600;color:#6a809b}.flex-layout .communication-item-row .created{display:inline-block;padding-right:15px}.flex-layout .communication-item-row>div.row-selector{min-width:20px;width:20px;padding:8px 0 8px 20px}.flex-layout .communication-item-row>div.indicator-icon{font-size:16px;width:24px;min-width:24px;padding-top:8px;text-align:left}.flex-layout .communication-item-row>div.indicator-icon>i{font-size:14px;display:inline-block;text-align:center;padding:6px 0;width:24px;border-radius:4px}.flex-layout .communication-item-row>div.indicator-icon.email>i,.flex-layout .communication-item-row>div.indicator-icon.note>i{color:#899aaf}.flex-layout .communication-item-row>div:nth-child(3){padding:8px;width:100%}.flex-layout .communication-item-row>div:nth-child(4){font-size:11px;min-width:100px;padding:8px 0}.flex-layout.child>div{padding-left:45px}.email-composer .fr-toolbar{border-width:1px}.email-composer .fr-box.fr-basic.fr-top div.fr-wrapper{border:1px solid #dee3e9;border-top:none}.email-composer .email-form-layout>.item-row>div>span{display:inline-block;margin:5px 0;font-size:11px}.email-composer .email-form-layout>.item-row>div:first-child{width:70px;min-width:70px}.email-composer .email-form-layout>.item-row>div:first-child button{margin:5px 0;border:none;font-size:10px;padding:1px 6px;text-align:left;text-transform:uppercase;width:55px;font-weight:600}.email-composer .email-form-layout>.item-row>div:first-child>span{text-transform:uppercase}.email-composer .email-form-layout>.item-row>div:nth-child(2){width:100%}.email-composer .email-form-layout>.item-row>div:nth-child(2) input[type=text]{width:100%;box-sizing:border-box;margin:2px 0}.email-composer .email-form-layout>.item-row>div:nth-child(2)>span{font-size:13px;margin:3px 0}.email-composer .email-form-layout>.item-row.template-row>div:nth-child(2){width:100%}.email-composer .email-form-layout>.item-row.template-row>div:nth-child(2) select{width:100%;box-sizing:border-box;margin:2px 0}.email-composer .email-form-layout>.item-row.template-row>div:nth-child(3){min-width:175px;text-align:right}.email-composer .email-form-layout>.item-row.template-row>div:nth-child(3) ul{list-style:none;padding:0;margin:0}.email-composer .email-form-layout>.item-row.template-row>div:nth-child(3) ul.indent-5>li{padding-left:5px}.email-composer .email-form-layout>.item-row.template-row>div:nth-child(3) ul>li{line-height:32px;display:inline-block}.email-composer .email-form-layout>.item-row.template-row>div:nth-child(3) ul>li label{text-transform:uppercase;color:#6a809b;font-size:11px;font-weight:400;margin:0 5px 0 0}.email-composer .bottom-area{padding:5px 0;text-align:right}.address-selector{min-width:150px;font-size:11px;padding:5px 0}.address-selector button,.address-selector button.selected{font-size:10px;padding:1px;border:none;margin:1px;min-width:45px;line-height:16px}.address-selector button.selected{background-color:#2196f3;color:#fff}.audit-side-tile>div:first-child{float:left;background-color:#0288D1;min-height:60px;color:#fff;height:100%;width:60px;border-radius:3px 0 0 3px;text-align:center}.audit-side-tile>div:first-child>i{display:inline-block;line-height:60px;font-size:20px}.audit-side-tile>div:nth-child(2){position:relative;margin-left:60px}.audit-side-tile:after{content:"";display:table;clear:both}.audit-counts-layout .count-tile{padding-top:11px;border-right:1px solid #eaedf1}.audit-counts-layout .count-tile.totals{color:#0288D1;border-right:1px solid #dee3e9}.audit-counts-layout .count-tile.complete{color:#4CAF50}.audit-counts-layout .count-tile.complete:hover{color:#3d8b40}.audit-counts-layout .count-tile.complete.none{color:#666}.audit-counts-layout .count-tile.upcoming{color:#039BE5}.audit-counts-layout .count-tile.upcoming:hover{color:#0279b3}.audit-counts-layout .count-tile.upcoming.none{color:#666}.audit-counts-layout .count-tile.in-progress{color:#0288D1}.audit-counts-layout .count-tile.in-progress:hover{color:#02679e}.audit-counts-layout .count-tile.in-progress.none{color:#666}.audit-counts-layout .count-tile.overdue{color:#FE9700}.audit-counts-layout .count-tile.overdue:hover{color:#cb7900}.audit-counts-layout .count-tile.overdue.none{color:#666}@media only screen and (max-width:529px){.audit-counts-layout .count-tile{width:25%}.audit-counts-layout .count-tile.complete,.audit-counts-layout .count-tile.upcoming{display:none}}@media only screen and (max-width:390px){.audit-counts-layout .count-tile{width:33%}.audit-counts-layout .count-tile.in-progress{display:none}}.audit-target-container .status-count-labels>div{padding:1px 6px;font-size:11px;cursor:pointer}.audit-target-container .status-count-labels>div>span{display:inline-block;line-height:14px;padding-bottom:4px}.audit-target-container .status-count-labels>div>span:nth-child(2){font-weight:600;min-width:80px}.audit-target-container .status-count-labels>div>span:nth-child(1){font-size:9px;padding:0 5px;border-radius:2px;color:#fff;margin-right:5px}.audit-target-container .status-count-labels>div>span:nth-child(1).complete{background-color:#4CAF50}.audit-target-container .status-count-labels>div>span:nth-child(1).upcoming{background-color:#039BE5}.audit-target-container .status-count-labels>div>span:nth-child(1).in-progress{background-color:#0288D1}.audit-target-container .status-count-labels>div>span:nth-child(1).overdue{background-color:#FE9700}.invitation-display .invitation-detail{line-height:28px;padding:5px 15px}.invitation-display .team-detail{padding:5px 15px}.invitation-display .invitation-action-buttons{padding:5px 15px 10px}.invitation-display .invitation-action-buttons button{border:none;min-width:65px}.invitation-display .invitation-action-buttons button.accept{background-color:#8BC34A;color:#fff}.invitation-display .invitation-action-buttons button.accept:hover{background-color:#71a436}.catalog-select>.item-row i,.catalog-select>.item-row span{display:inline-block;line-height:34px}.catalog-select>.item-row i{color:#a7b4c4;text-align:center;min-width:25px}.findings-list .header-row>div:last-child{width:5px}.findings-list .header-row.sub-header{background-color:#fff}.findings-list>.item-row{border-bottom:1px solid #dee3e9}.findings-list>.item-row .criteria{padding-right:1px}.findings-list>.item-row .comment textarea{border:none;width:100%;height:100%;box-sizing:border-box;resize:none;padding:4px}.findings-list>.item-row .rating-col{cursor:pointer}.findings-list>.item-row .rating-col:hover{background-color:#f6f8f9}.findings-list .rating-col{width:60px;padding-top:8px;text-align:center}div.fr-toolbar{border:1px solid #c6ced8;border-top:3px solid #c6ced8}div.fr-toolbar.fr-top{box-shadow:none;-webkit-box-shadow:none;border-radius:0;-webkit-border-radius:0}div.fr-toolbar .fr-command.fr-btn{color:#666}div.fr-toolbar .fr-command.fr-btn:hover{background-color:#f0f2f5}.fr-box.fr-basic>div.fr-wrapper{border:1px solid #c6ced8;border-top:none}div.rd-container{border:1px solid #dee3e9;color:#666;-webkit-box-shadow:4px 4px 5px 0 #ccc;-moz-box-shadow:4px 4px 5px 0 #ccc;box-shadow:4px 4px 5px 0 #ccc}div.rd-container .year-input{border:none}div.rd-container .rd-month .rd-month-label,div.rd-container .rd-year .rd-month-label{font-weight:600;font-size:14px;display:inline-block}div.rd-container .rd-month button.rd-back,div.rd-container .rd-month button.rd-next,div.rd-container .rd-year button.rd-back,div.rd-container .rd-year button.rd-next{font-size:16px;padding:2px 5px}div.rd-container .rd-month button.rd-back:before,div.rd-container .rd-year button.rd-back:before{content:"\25c0"}div.rd-container .rd-month button.rd-next:before,div.rd-container .rd-year button.rd-next:before{content:"\25b6"}div.rd-container .rd-year{display:inline-block;margin-left:15px;border-radius:3px;margin-bottom:3px}div.rd-container .rd-year input{width:50px;text-align:center;background-color:transparent;font-size:14px}div.rd-container .rd-days .rd-day-body{padding:5px 8px;background-color:#f6f8f9}div.rd-container .rd-days .rd-day-body.rd-day-selected{font-weight:600;background-color:#327BC1}div.rd-container .rd-days .rd-day-body:hover{background-color:#899aaf;color:#fff}div.rd-container .rd-days .rd-day-next-month{background-color:#fff}.twitter-typeahead .tt-suggestion.tt-cursor,.twitter-typeahead .tt-suggestion:hover{background-color:#327BC1;cursor:pointer}.twitter-typeahead>input.tt-input,body,html{background-color:#f0f2f5}.twitter-typeahead .tt-menu{margin-top:2px;border:1px solid #c6ced8}.twitter-typeahead .tt-suggestion{font-weight:600;padding:4px 5px}body,html{margin:0;padding:0;font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:13px;line-height:24px;color:#666;height:100%}a{cursor:pointer}a.action-button{vertical-align:top;border:1px solid #268fd5;color:#fff;background-color:#3498db;font-size:10px;font-weight:600;line-height:22px;text-transform:uppercase;padding:0 6px;display:inline-block;border-radius:3px}a.action-button>i{display:inline-block}a.action-button:hover{background-color:#2383c4;color:#fff;text-decoration:none}a.action-button.inverse{background-color:#2489cc;color:#fff}a.action-button.inverse:hover{background-color:#2383c4}a.action-button.componentized{padding:0;border:none;text-align:left}a.action-button.componentized>i:first-child{display:inline-block;line-height:22px;padding:0 6px;background-color:#2489cc;border-radius:3px 0 0 3px;border-right:1px solid #8bc4ea}a.action-button.componentized>span{display:inline-block;line-height:22px;padding:0 6px 0 8px}a.action-button.icon-only{vertical-align:middle;padding:6px}a.cancel,a.primary{padding:2px 15px;border-radius:3px;display:inline-block}a.action-button.icon-only>i{margin:0}a.cancel{background-color:#dee3e9;color:#666}a.cancel:hover{background-color:#cfd6df}a.primary{font-size:11px;background-color:#3498db;border:none;color:#fff}a.primary:hover{background-color:#217dbb;text-decoration:none}a.primary:active,a.primary:focus{border:1px solid #217dbb}.element-focus,button:active,button:focus,input[type=date]:active,input[type=date]:focus,input[type=email]:active,input[type=email]:focus,input[type=number]:active,input[type=number]:focus,input[type=password]:active,input[type=password]:focus,input[type=search]:active,input[type=search]:focus,input[type=text]:active,input[type=text]:focus,select:active,select:focus,textarea:active,textarea:focus{border:1px solid #a1afc0}a.primary.small{font-size:10px;line-height:16px;padding:0 5px}a.primary.medium{font-size:11px;line-height:19px;padding:0 5px}a.inline-add-link,a.inline-remove-link{font-size:11px}a.inline-add-link i,a.inline-remove-link i{display:inline-block;margin-right:4px}a.inline-add-link span:hover,a.inline-remove-link span:hover{text-decoration:underline}a.inline-add-link:hover,a.inline-remove-link:hover{color:#217dbb}a.top-right{position:absolute}button,input[type=date],input[type=email],input[type=number],input[type=password],input[type=search],input[type=text],select,textarea{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;border:1px solid #dee3e9;color:#666;font-size:12px;padding:4px}button:focus,input[type=date]:focus,input[type=email]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=text]:focus,select:focus,textarea:focus{outline:0}button.date-picker,input[type=date].date-picker,input[type=email].date-picker,input[type=number].date-picker,input[type=password].date-picker,input[type=search].date-picker,input[type=text].date-picker,select.date-picker,textarea.date-picker{width:162px}button{cursor:pointer;background-color:#eaedf1;border-radius:3px;padding:2px 10px;line-height:24px}button:hover{background-color:#dbe0e7}button.cancel,button.primary{padding:2px 15px;min-width:70px}button.cancel.small,button.primary.small{min-width:50px;padding:0 6px;font-size:10px;font-weight:600;line-height:14px}button.cancel:active,button.cancel:focus,button.primary:active,button.primary:focus{border:1px solid #a1afc0}button.primary{background-color:#3498db;border:1px solid #3498db;color:#fff}button.primary:hover{background-color:#217dbb}button.primary:active,button.primary:focus{border:1px solid #217dbb}button.medium{padding:3px 12px;line-height:18px;font-size:12px}button.action-button,button.facet{vertical-align:top;font-size:10px;font-weight:600}button.facet{padding:0 10px;line-height:18px;border:none}button.facet.selected{background-color:#3498db;color:#fff}button.facet.selection-hilite{background-color:#fff;color:#8BC34A;border:1px solid #8BC34A}button.facet.selection-hilite:hover{background-color:#c8e3aa;color:#fff}button.facet.selection-toggle{background-color:#8BC34A;color:#fff}button[disabled],button[disabled]:hover{background-color:#f0f2f5}button[disabled]{border:1px solid #f0f2f5;color:#c6ced8;cursor:not-allowed}button.action-button{border:1px solid #268fd5;color:#fff;background-color:#3498db;padding:0 8px;line-height:22px;text-transform:uppercase}button.action-button>i{display:inline-block}button.action-button:hover{background-color:#2383c4;color:#fff;text-decoration:none}.btn-link:hover,button.link-button:hover{text-decoration:underline}button.action-button.inverse{background-color:#2489cc;color:#fff}button.action-button.inverse:hover{background-color:#2383c4}button.action-button.componentized{padding:0;border:none;text-align:left}button.action-button.componentized>i:first-child{display:inline-block;line-height:22px;padding:0 6px;background-color:#2489cc;border-radius:3px 0 0 3px;border-right:1px solid #8bc4ea}button.icon-button,button.link-button,button.no-look,button.selector{background:0 0;border:none;color:#3498db}button.action-button.componentized>span{display:inline-block;line-height:22px;padding:0 6px 0 8px}button.action-button.icon-only{vertical-align:middle;padding:6px}button.action-button.icon-only>i{margin:0}button.selector{padding:3px 5px 0 0;font-weight:600;font-size:12px}button.icon-button,button.no-look{margin:0;padding:4px}button.link-button{padding:0}button.link-button.small{font-size:12px}button.top-right{position:absolute}button i{display:inline-block}button.action-button.componentized.btn-icon,button.btn-icon{text-align:left;padding:0;width:auto;min-width:auto}button.action-button.componentized.btn-icon>i:first-child,button.action-button.componentized.btn-icon>span,button.btn-icon>i:first-child,button.btn-icon>span{display:inline-block;padding:2px 7px}button.action-button.componentized.btn-icon>i:first-child,button.btn-icon>i:first-child{padding:0 4px 2px 5px;vertical-align:middle;background-color:transparent;border:0}button.action-button.componentized.btn-icon>span,button.btn-icon>span{border-left:1px solid #fff}button.action-button.componentized.btn-icon>span>i:first-child,button.btn-icon>span>i:first-child{display:inline;padding:0 0 4px 4px}.btn-link{background-color:transparent;border:1px solid transparent;color:#3498db}.btn-link:hover{background-color:transparent}.btn-link:active,.btn-link:focus{background-color:transparent;border:1px solid #3498db}label{display:block;font-weight:600;margin-bottom:5px}label.small-caps{font-size:10px;text-transform:uppercase}.link-em{font-size:13px;font-weight:600}.splash{margin:50px auto;text-align:center}hr{border:none;height:1px;background-color:#dee3e9}i.shaded-icon{color:#c6ced8}.website-url-container{max-width:90%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.website-url-container.fixed-small{font-size:11px;max-width:240px}.radio-buttons>label{float:left;font-weight:400;margin-right:15px}.radio-buttons>label:after{content:"";display:table;clear:both}.success-text{color:#8BC34A}.info-text{color:#3498db}.required,.warning-text{color:#FE9700}.danger-text{color:#e74c3c}i.inline{display:inline-block;padding:0 5px}i.middle{vertical-align:middle}.soft{color:#a7b4c4;font-size:.8em}.clickable-text{cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.twitter-typeahead{width:100%}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.invisible{visibility:hidden} | |
| </style> | |
| </head> | |
| <body aurelia-app="main"> | |
| <h1>Loading...</h1> | |
| <script src="https://jdanyow.github.io/rjs-bundle/node_modules/requirejs/require.js"></script> | |
| <script src="https://jdanyow.github.io/rjs-bundle/config.js"></script> | |
| <script src="https://jdanyow.github.io/rjs-bundle/bundles/aurelia.js"></script> | |
| <script src="https://jdanyow.github.io/rjs-bundle/bundles/babel.js"></script> | |
| <script> | |
| require(['aurelia-bootstrapper']); | |
| </script> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| export function configure(aurelia) { | |
| aurelia.use | |
| .standardConfiguration() | |
| .developmentLogging() | |
| .plugin('aurelia-validation'); | |
| aurelia.start().then(() => aurelia.setRoot()); | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- | |
| Our new validation renderer requires some special class names | |
| on our markup in order to render properly as well as a binding | |
| parameter specifying that we want a component to be validated | |
| This stucture applies only to the default renderer | |
| (armature-form-renderer.js) | |
| - "form-group" class on a container for a single form component | |
| - "form-label" class on a label for the form component | |
| - "form-control" class on the form component input (or other) | |
| --> | |
| <template> | |
| <!-- The form itself no longer requires validate.bind --> | |
| <form submit.delegate="submit()"> | |
| <!-- FORM COMPONENT CONTAINER --> | |
| <div class="form-group"> | |
| <!-- FORM COMPONENT LABEL (OPTIONAL) --> | |
| <label class="form-label" for="first"> | |
| First Name | |
| </label> | |
| <!-- FORM COMPONENT INPUT --> | |
| <input | |
| class="form-control" | |
| type="text" | |
| id="first" | |
| placeholder="First Name" | |
| value.bind="person.firstName & validate"> | |
| <!-- | |
| We must add '& validate' to bindings we wish | |
| to perform validation on (see above) | |
| http://aurelia.io/hub.html#/doc/article/aurelia/validation/latest/validation-basics/6 | |
| --> | |
| </div> | |
| <div class="form-group"> | |
| <label class="form-label" for="last">Last Name</label> | |
| <input | |
| type="text" | |
| class="form-control" | |
| id="last" | |
| placeholder="Last Name" | |
| value.bind="person.lastName & validate"> | |
| </div> | |
| <div class="form-group"> | |
| <label class="form-label" for="email">Email</label> | |
| <input | |
| type="email" | |
| class="form-control" | |
| id="email" | |
| placeholder="Email" | |
| value.bind="person.email & validate"> | |
| </div> | |
| <button type="submit" class="btn btn-primary">Submit</button> | |
| </form> | |
| </template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import {inject} from 'aurelia-dependency-injection'; | |
| /* | |
| Wherever we previously imported Validation like so: | |
| import {Validation} from 'aurelia-validation'; | |
| We will now import ArmatureValidation | |
| */ | |
| import {ArmatureValidation} from './armature-validation'; | |
| /* | |
| ValidationRules is a new component we must now import | |
| when setting up validations from a view model | |
| */ | |
| import {ValidationRules} from 'aurelia-validation'; | |
| @inject(ArmatureValidation) | |
| export class NewStyleForm { | |
| constructor(validation) { | |
| this.validation = validation; | |
| this.person = { | |
| firstName: '', | |
| lastName: '', | |
| email: '' | |
| }; | |
| this.initValidation(); | |
| } | |
| /* | |
| Any string based validation rules should be replaced by | |
| a property access expression (see below) | |
| http://aurelia.io/hub.html#/doc/article/aurelia/validation/latest/validation-basics/2 | |
| */ | |
| initValidation() { | |
| ValidationRules | |
| .ensure(a => a.firstName).required() | |
| .ensure(a => a.lastName).required() | |
| .ensure(a => a.email).required().email() | |
| .on(this.person); | |
| } | |
| submit() { | |
| this.validation.validate() | |
| .then( valid => { | |
| console.log( 'valid', valid ); | |
| }, invalid => { | |
| console.log( 'invalid', invalid ); | |
| }) | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment