*,::before,::after{box-sizing:border-box}
::-webkit-scrollbar{height:8px;width:8px}
::-webkit-scrollbar-corner{background:transparent}
::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.26);background-clip:initial}

a{background-color:transparent;cursor:pointer;text-decoration:none}
a,button,input,label,select,textarea{touch-action:manipulation}
b,strong{font-weight:700}
body{background-color:rgb(241, 243, 244)}
body,html,input,button{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}
button{cursor:pointer;outline:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}
dialog{display:block}
dialog:not([open]){display:none}
hr{height:0}
html,body{font-family:'Roboto', sans-serif;height:100%;margin:0;padding:0;width:100%}
img{border-style:none}
table{border-collapse:collapse}
[type="checkbox"]{appearance:none;border:1px solid #bcf;background-color:#fff;caret-color:#567;font-weight:300;height:42px;outline:none;padding:8px;-webkit-appearance:none;-moz-appearance:none}
[type="checkbox"]:checked{border-color:#567;content:"\E919"} /* icon: check */

header{align-items:center;background-color:rgb(95, 99, 104);color:white;flex-direction:row;font-size:20px;font-weight:500;display:flex;height:64px;justify-content:space-between;letter-spacing:.15px;margin:0;padding:0;width:100%}
/* header{box-shadow:rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px, rgba(0, 0, 0, 0.2) 0px 2px 4px -1px;position:sticky;top:0} */
header a{color:#fff;font-size:13px;font-weight:400;margin-right:32px;white-space:nowrap}
header a:hover{text-decoration:underline}
header button{background-color:transparent;border:0;border-bottom:3px solid white;border-top:3px solid white;border-radius:2px;color:white;font-size:24px;height:24px;line-height:16px;margin:0 20px;width:24px}
header img{height:64px;width:168px}
header span{border-left:1px solid #9aa0a6;flex:1;height:32px;margin:0 8px;width:1px}

main{display:flex;flex-flow:row nowrap;height:100%;margin:0;padding:0;position:fixed;width:100%}

nav{border-right:1px solid rgb(218, 220, 224);display:flex;flex:0 0 200px;flex-direction:column;height:100%;margin:0;overflow:auto;padding:8px 0 64px 0;transition:margin-left 218ms cubic-bezier(.4,0,.2,1);width:200px}
nav h6{color:rgba(32, 33, 36, 0.86);font-size:12px;font-weight:500;line-height:16px;margin:0;padding:12px 12px 12px 32px;width:200px}
nav h6:first-of-type{margin-top:32px}
nav a{color:rgba(32,33,36,.86);display:block;font-size:13px;font-weight:400;height:40px;line-height:16px;padding:12px 12px 12px 32px;width:200px}
nav a:hover{background-color:rgb(218, 220, 224)}
nav a.active{background-color:rgb(218, 220, 224);box-shadow:rgb(24, 90, 188) 4px 0px 0px 0px inset;color:rgb(24, 90, 188);font-weight:500}
nav details{margin:0;padding:0;width:200px}
nav details summary{color:rgba(32, 33, 36, 0.86);cursor:pointer;font-size:13px;font-weight:400;height:40px;line-height:16px;padding:12px 12px 12px 32px;width:200px}
nav details summary:hover{background-color:rgb(218, 220, 224)}
nav details a{box-shadow:inset 4px 0 0 0 #dadce0;margin-left:34px;padding-left:12px}
.nav-separator{background-color:rgb(218,220,224);height:1px;margin:12px auto;width:112px}

@media screen and (max-width: 767px) {
    header{font-size:0}
    nav{background-color:#fff;height:100%;max-width:360px;overflow-y:scroll;position:fixed;right:0;top:0;visibility:hidden;width:calc(100% - 48px);z-index:2}
}

section{flex:1 1 auto;margin:0;overflow:auto;padding:0}

.toolbar{align-items:center;background-color:rgb(255,255,255);box-shadow:rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 3px 1px -2px, rgba(0, 0, 0, 0.2) 0px 1px 5px 0px;flex-direction:row;display:flex;height:48px;line-height:48px;;margin:0;padding:0 24px;width:100%}
.toolbar a{background-color:rgb(26,115,232);border-radius:2px;box-shadow:0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.12), 0 1px 5px 0 rgba(0,0,0,.2);color:rgb(255,255,255);font-size:14px;font-weight:500;height:36px;line-height:36px;letter-spacing:.14px;margin:0 0 0 16px;min-width:64px;padding:0 16px;text-align:center;text-decoration:none;text-transform:uppercase;transition:background-color .28s cubic-bezier(0.4,0,0.2,1)}
.toolbar a:hover{background-color:#5893f5;box-shadow:rgba(0, 0, 0, 0.14) 0px 6px 10px 0px, rgba(0, 0, 0, 0.12) 0px 1px 18px 0px, rgba(0, 0, 0, 0.2) 0px 3px 5px -1px}
.toolbar h1{color:rgb(0,0,0);flex:1 1 auto;font-size:20px;font-weight:500;margin:0;padding:0}
.toolbar input{height:36px;margin:0 16px}
.toolbar select{margin:0 16px}


/*****************************************************************************/
/*  Form elements                                                            */
/*****************************************************************************/
button,       .btn{background-color:rgb(26,115,232);border:0;border-radius:2px;box-shadow:0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.12), 0 1px 5px 0 rgba(0,0,0,.2);color:rgb(255,255,255);cursor:pointer;display:inline-block;font-size:14px;font-weight:500;height:32px;line-height:32px;letter-spacing:.14px;min-width:64px;outline:none;padding:0 16px;text-align:center;text-decoration:none;text-transform:uppercase}
button:hover, .btn:hover{box-shadow:rgba(0, 0, 0, 0.14) 0px 6px 10px 0px, rgba(0, 0, 0, 0.12) 0px 1px 18px 0px, rgba(0, 0, 0, 0.2) 0px 3px 5px -1px}

button[type="submit"], .btn-alert,.btn-cancel,.btn-submit{height:36px;transition:background-color .28s cubic-bezier(0.4,0,0.2,1)}
button[type="submit"], .btn-submit{background-color:rgb(26,115,232);box-shadow:rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 3px 1px -2px, rgba(0, 0, 0, 0.2) 0px 1px 5px 0px}
button[type="submit"]:hover, .btn-submit:hover{background-color:#5893f5}

button.btn-alert{background-color:#ea4335}
button.btn-alert:hover{background-color:#db4437}

.btn-cancel{background-color:initial;box-shadow:none;color:rgba(0,0,0,0.87)}
.btn-cancel:hover{background-color:#dcdcdc;box-shadow:none;}

input{border:0;border-bottom:1px solid rgba(0,0,0,.12);font-size:14px;font-weight:400;height:24px;line-height:24px;padding:0;outline:none}
input:focus{border-bottom-color:rgb(66,133,244)}
input.error, input.ng-dirty.ng-invalid{border-bottom-color:rgb(197,57,41)}
input.ng-dirty.ng-valid{border-bottom-color:rgb(15, 157, 88)}

input[type="checkbox"],               input[type="radio"]{align-items:center;appearance:none;border:2px solid rgba(0,0,0,.47);cursor:pointer;display:flex;justify-content:center;height:18px;line-height:18px;outline:none;padding:0;text-align:center;width:18px;-webkit-appearance:none}
input[type="checkbox"]:checked,       input[type="radio"]:checked{border:none}
input[type="checkbox"]:checked:after, input[type="radio"]:checked:after{color:rgb(66,133,244);font-family:MaterialIcons;font-size:24px}

input[type="checkbox"]{border-radius:2px}
input[type="radio"]{border-radius:50%}

input[type="checkbox"]:checked:after{content:"check_box"}
input[type="radio"]:checked:after{content:"radio_button_checked"}


/**
 * @see https://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/
 * /
input[type="file"]{height:0.1px;opacity:0;overflow:hidden;position:absolute;width:0.1px;z-index:-1}
input[type="file"] + label{background-color:#26A69A;border-radius:2px;box-shadow:0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);color:#FFF;cursor:pointer;display:inline-block;font-size:15px;height:36px;letter-spacing:.5px;line-height:36px;padding:0 6px;text-align:center;width:80%}
input[type="file"] + label:hover{background-color:#2BBBAD;box-shadow:0 3px 3px 0 rgba(0,0,0,0.14), 0 1px 7px 0 rgba(0,0,0,0.12), 0 3px 1px -1px rgba(0,0,0,0.2)}
input[type="file"]:focus + label, #modal-content input[type="file"] + label:hover{outline:1px dotted #000;outline:-webkit-focus-ring-color auto 5px}
input[type="file"] + label *{pointer-events:none}
input[type="file"] + label svg{fill:currentColor;height:1em;margin:-0.25em 0.25em 0 0;vertical-align:middle;width:1em}

<label for="doc" style="clear:both;float:left" >
    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="17" viewBox="0 0 20 17">
        <path d="M10 0l-5.2 4.9h3.3v5.1h3.8v-5.1h3.3l-5.2-4.9zm9.3 11.5l-3.2-2.1h-2l3.4 2.6h-3.5c-.1 0-.2.1-.2.1l-.8 2.3h-6l-.8-2.2c-.1-.1-.1-.2-.2-.2h-3.6l3.4-2.6h-2l-3.2 2.1c-.4.3-.7 1-.6 1.5l.6 3.1c.1.5.7.9 1.2.9h16.3c.6 0 1.1-.4 1.3-.9l.6-3.1c.1-.5-.2-1.2-.7-1.5z"></path>
    </svg>
    SELECTEER DOCUMENT(EN)
</label>

<script>
document.querySelectorAll('#modal-content input[type="file"]').forEach(function(input){
    var label       = input.nextElementSibling
      , originalTxt = label.innerHTML;

    input.addEventListener('change', function(e){
        if (e.target.value) {
            label.innerHTML = "GESELECTEERD: " + e.target.value.split('\\').pop();
        } else {
            label.innerHTML = originalTxt;
        }
    });
});
</script>
*/

label{cursor:pointer;font-size:14px;font-weight:400;line-height:16px}

select{border:0;border-bottom:1px solid rgba(0,0,0,.12);cursor:pointer;font-size:14px;font-weight:400;height:24px;line-height:24px;padding:0;outline:none}
select:focus{border-bottom-color:rgb(66,133,244)}
select.error, select.ng-invalid{border-bottom-color:rgb(197,57,41)}

textarea{border:0;border-bottom:1px solid rgba(0,0,0,.12);font-size:14px;font-weight:400;height:72px;line-height:16px;padding:0;outline:none}
textarea:focus{border-bottom-color:rgb(66,133,244)}
textarea.error, textarea.ng-invalid{border-bottom-color:rgb(197,57,41)}

td input{margin:0;width:100%}
td select{margin:0;width:100%}


/** Form (specific) **/
form{border:0;display:flex;flex-flow:column nowrap;margin:0 0 24px 0;padding:0 0 24px 0;width:100%}
form .toolbar h1{margin:0 auto;max-width:1024px}
form .card{max-width:1024px}

#submit{border:0;display:flex;margin:16px auto;max-width:1024px;padding:16px 24px;transition:margin 436ms cubic-bezier(0.4,0,0.2,1);width:100%}

.fieldset-row{align-items:center;display:flex;font-size:14px;font-weight:400;justify-content:flex-end;margin:0 0 16px 0;text-align:right;max-width:840px;width:100%}

.fieldset-row-column          {display:inline-block;margin:0 8px;max-width:640px;vertical-align:top;width:100%}
.fieldset-row input           {display:inline-block;margin:0 8px;max-width:640px;                   width:100%}
.fieldset-row label{align-items:center;display:flex;margin:0 8px;max-width:640px;text-align:left;   width:100%}
.fieldset-row p               {display:inline-block;margin:0 8px;max-width:640px;vertical-align:top;width:100%}
.fieldset-row select          {display:inline-block;margin:0 8px;max-width:640px;                   width:100%}
.fieldset-row textarea        {display:inline-block;margin:0 8px;max-width:640px;vertical-align:top;width:100%}

.tox-tinymce{margin:0 8px;max-width:640px;width:100%}

.fieldset-row input[type="checkbox"]{display:flex;width:18px}
.fieldset-row input[type="radio"]{display:flex;width:18px}
.fieldset-row p{line-height:16px;padding:0;text-align:left}
.fieldset-row textarea{resize:vertical}

.fieldset-row-column label{margin-bottom:8px}

.fieldset-row-inline{display:flex;margin:0 8px;max-width:640px;width:100%}
.fieldset-row-inline input{margin:0 16px 0 0}
.fieldset-row-inline input:last-of-type{margin:0}

.multiselect{display:flex;flex-flow:row wrap;margin:0 0 16px 0}
.multiselect label{align-items:center;display:flex;margin:0 0 8px 0;width:50%}
.multiselect label:hover{text-decoration:underline}

.table-group button{display:inline-block;margin:0 16px;outline:none;width:175px}
.table-group td{text-align:center}
.table-group-delete{color:red;cursor:pointer;font-size:14px;font-weight:500;height:32px;line-height:32px;letter-spacing:.14px;margin:0 16px;min-width:64px;padding:0 16px;text-decoration:none;text-align:center;text-transform:uppercase}
.table-group-delete:hover{text-decoration:underline}

@media screen and (max-width:1023px) {
    .fieldset-row{padding:0}
}

@media screen and (min-width:1024px) {
    .fieldset-row{padding:8px 0 0 0}
}

#form-and-sticky{display:flex;flex-flow:row;flex-wrap:nowrap}
#form-and-sticky form{flex:0 0 840px;margin:0 24px;width:840px}
#form-and-sticky #sticky{flex:1 1 640px;margin:16px 24px 16px 52px;min-width:640px}


/** Typeahead **/
.typeahead__filter-button{box-shadow:1px 1px #EDEDED;border-radius:0 2px 2px 0;height:38px;width:150px}
.searchresult{display:inline-block;width:100%}
.searchresult img{display:inline-block;width:96px}
.searchresult-txt{display:inline-block;font-size:13px;padding:14px;vertical-align:top;width:380px}
.searchresult-txt-header i{float:right}
.searchresult-txt ul{margin:0;padding:0}
.searchresult-txt li{font-size:12px;line-height:18px;margin:0;padding:0}
.searchresult-txt dl{margin:7px 0 0 0;padding:0;width:575px}
.searchresult-txt dd, .searchresult-txt dt{float:left;font-size:12px;;height:18px;line-height:18px;margin:0;padding:0}
.searchresult-txt dd{width:375px}
.searchresult-txt dt{width:200px}


/** Card **/
.card, .card-warning{display:inline-block;margin:16px auto 0 auto;transition:margin 436ms cubic-bezier(0.4,0,0.2,1);width:100%}

.card{background-color:#fff;box-shadow:0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);color:rgba(0,0,0,0.87);display:flex;flex-direction:column}

.card-warning{background-color:rgb(254,247,224);box-shadow:rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;          color:rgb(60,64,67)   ;padding:14px 12px 14px 56px}
.card-warning{font-size:15px;line-height:20px;position:relative}
.card-warning svg{fill:#d93025;font-size:15px;height:24px;left:16px;line-height:20px;position:absolute;top:12px;width:24px}
/*
<div class="card-warning">
    <svg viewBox="0 0 48 48"><path d="M2 42h44L24 4 2 42zm24-6h-4v-4h4v4zm0-8h-4v-8h4v8z"></path></svg>
    This is a warning!
</div>
*/

.alert{border-radius:8px;color:#3c4043;padding:12px 0 20px 56px}
.alert:before{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CiAgICA8cGF0aCBkPSJNMiA0Mmg0NEwyNCA0IDIgNDJ6bTI0LTZoLTR2LTRoNHY0em0wLThoLTR2LThoNHY4eiIgZmlsbD0iI2VhODYwMCIvPgo8L3N2Zz4=)}
.alert:before{background-repeat:no-repeat;content:'';height:24px;margin-left:-40px;margin-top:6px;position:absolute;width:24px}

/*
<div class="card">
    <div class="alert">This is an alert!</div>
</div> */


.card-header{align-items:center;background-color:rgb(255,255,255);border-radius:2px 2px 0 0;flex-direction:row;display:flex;height:48px;line-height:48px;;margin:0;padding:0;width:100%}
/*
.card-header a{border-radius:2px;color:rgb(66,133,244);display:inline-block;font-size:14px;font-weight:500;letter-spacing:0.14px;line-height:17px;margin-left:12px;padding:10px 8px;text-align:center;text-decoration:none;text-transform:uppercase;white-space:nowrap}
.card-header a:hover{background-color:#e9f1fe} */
.card-header h2{color:rgba(0, 0, 0, 0.87);flex:1 1 auto;font-size:18px;font-weight:400;margin:0;padding:20px 8px 0 16px}
.card-header h2 a{color:rgba(0, 0, 0, 0.87);text-decoration:none}
.card-header h2 a:hover{color:rgb(25, 103, 210)}
.card-header h3{flex:1 1 auto;font-size:15px;font-weight:500;line-height:20px;margin:0;padding:0}

.card-content{border:0;flex:1}

.card dl{color:rgb(32,33,36);display:flex;flex-flow:row wrap;font-size:12px;font-weight:400;line-height:24px;margin:0;padding:0;width:100%}
.card dt{flex:1 1 30%;margin:0;padding:0;width:30%}
.card dd{flex:1 1 70%;margin:0;padding:0;width:70%}
.card h3{color:rgb(32,33,36);font-size:15px;font-weight:500;height:48px;line-height:64px;margin:0;padding:0;width:100%}
.card table{border:1px solid rgb(218,220,224);box-shadow:none;margin-bottom:16px}

.card-footer{align-items:center;background-color:rgb(255,255,255);border-radius:0 0 2px 2px;box-shadow:rgb(218, 220, 224) 0px 1px 0px 0px inset;flex-flow:row nowrap;display:flex;justify-content:space-between;height:48px;line-height:48px;;margin:0;padding:8px;width:100%}
.card-footer a{border-radius:2px;color:rgb(66,133,244);display:inline-block;font-size:14px;font-weight:500;letter-spacing:0.14px;line-height:17px;margin-left:12px;padding:10px 8px;text-align:center;text-decoration:none;text-transform:uppercase;white-space:nowrap}
.card-footer a:hover{background-color:#e9f1fe}


/** Modal **/
#modal{background-color:rgb(241,243,244);border-radius:2px;box-shadow:0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.3);display:flex;flex-flow:column nowrap;left:0;margin:0 auto;max-height:90%;max-width:1089px;overflow-y:auto;position:fixed;right:0;top:5%;width:90%;z-index:1300}
#modal-header{align-items:center;background-color:rgb(255,255,255);box-shadow:rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 3px 1px -2px, rgba(0, 0, 0, 0.2) 0px 1px 5px 0px;flex-direction:row;display:flex;height:48px;line-height:48px;;margin:0;padding:0 24px;width:100%;z-index:1299}
#modal-header h1{color:rgb(0,0,0,.87);flex:1 1 auto;font-size:20px;font-weight:500;margin:0 auto;max-width:1024px;padding:0}
#modal-content{overflow-y:auto;padding:16px 24px 76px 24px}
#modal-overlay{background:rgba(0,0,0,0.5);bottom:0;height:100%;left:0;position:fixed;right:0;top:0;width:100%;z-index:1298}
#modal-footer{background-color:#FFF;border-radius:0 0 2px 2px;border-top:1px solid rgba(0,0,0,0.12);bottom:0;line-height:56px;padding-right:24px;position:absolute;text-align:right;width:100%}



/*****************************************************************************/
/* Table                                                                     */
/*****************************************************************************/
table{background-color:rgb(255,255,255);border-collapse:collapse;box-shadow:rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;margin:0;padding:0;width:100%}

table thead tr th{background-color:#fff;border-bottom:2px solid rgb(128,134,139);border-left:1px solid rgb(218,220,224);color:rgb(95,99,104);font-size:12px;font-weight:500;height:44px;line-height:44px;padding:0 24px;position:sticky;text-align:center;top:0}

/*table thead tr th{box-shadow:inset 0 2px 0 rgb(128,134,139), inset 0 -2px 0 rgb(128,134,139)} */

table thead tr th:first-of-type{border-left:0}
table thead tr th a{color:rgb(95,99,104);display:inline-block;text-decoration:none}
table thead tr th b a{color:rgb(32,33,36);font-weight:700}
table thead tr th b:after{height:14px;left:2px;opacity:0.6;position:relative;top:4px;width:14px}
table thead tr th b:after{content:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNnB4IiBoZWlnaHQ9IjE2cHgiIHZpZXdCb3g9IjAgMCA0OCA0OCI+CjxwYXRoIGZpbGw9Im5vbmUiIGQ9Ik0wIDBoNDh2NDhIMFYweiIvPgo8cGF0aCBmaWxsPSJjdXJyZW50Q29sb3IiIGQ9Ik00MCAyNGwtMi44Mi0yLjgyTDI2IDMyLjM0VjhoLTR2MjQuMzRMMTAuODQgMjEuMTYgOCAyNGwxNiAxNiAxNi0xNnoiLz4KPC9zdmc+Cg==)}

table tbody tr:hover{background:#f1f3f4}

table tbody tr.selected{background-color:#e8f0fe}

table tbody tr td{border-bottom:1px solid rgb(218,220,224);border-left:1px solid rgb(218,220,224);color:rgb(32,33,36);font-size:12px;font-weight:400;padding:13px;text-align:left;vertical-align:middle;white-space:nowrap}
table tbody tr td:first-of-type{border-left:0}
table tbody tr td.actions{text-align:center;white-space:nowrap}
table tbody tr td.actions a{margin:0 6px;text-transform:uppercase}
table tbody tr td.money{text-align:right}

table tbody tr td a{color:#1a73e8;display:inline-block;font-weight:500;letter-spacing:.14px;margin:0 auto;text-decoration:none}
table tbody tr td a:hover{text-decoration:underline}

table tbody tr td.action{padding:0;text-align:center}
table tbody tr td.action a{background-position:center center;background-repeat:no-repeat;background-size:20px;border-radius:50%;cursor:pointer;display:inline-block;height:36px;margin:0 auto;opacity:.54;transition:opacity .15s cubic-bezier(0.4,0.0,0.2,1);vertical-align:middle;width:36px}
table tbody tr td.action a:hover{background-color:#fff;box-shadow:0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.12), 0 1px 5px 0 rgba(0,0,0,.2);opacity:1}
table tbody tr td.action a.action-delete{background-image:url('https://travelyard.s3.eu-central-1.amazonaws.com/icon/delete.png')}
table tbody tr td.action a.action-edit{background-image:url('https://travelyard.s3.eu-central-1.amazonaws.com/icon/edit.png')}

table tbody tr td.icons{padding:0;text-align:center}
table tbody tr td.icons a{background-position:center center;background-repeat:no-repeat;background-size:20px;border-radius:50%;cursor:pointer;display:inline-block;height:36px;margin:0 auto;opacity:.54;transition:opacity .15s cubic-bezier(0.4,0.0,0.2,1);vertical-align:middle;width:36px}
table tbody tr td.icons a:hover{background-color:#fff;box-shadow:0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.12), 0 1px 5px 0 rgba(0,0,0,.2);opacity:1}
table tbody tr td.icons a.icon-email{background-image:url('https://travelyard.s3.eu-central-1.amazonaws.com/icon/email.png')}
table tbody tr td.icons a.icon-phone{background-image:url('https://travelyard.s3.eu-central-1.amazonaws.com/icon/phone.png')}

/*
Original icons
https://www.gstatic.com/images/icons/material/system/1x/delete_black_20dp.png
https://www.gstatic.com/images/icons/material/system/1x/edit_black_20dp.png
*/

table tbody tr td a.switch_0{background:red;   border-radius:5px;display:block;height:17px;margin:0 auto;width:17px}
table tbody tr td a.switch_1{background:green; border-radius:5px;display:block;height:17px;margin:0 auto;width:17px}
table tbody tr td a.switch_2{background:orange;border-radius:5px;display:block;height:17px;margin:0 auto;width:17px}

table tbody tr td img{margin:-12px 0 -15px -12px}

table tbody tr td .status{border-radius:2px;color:#fff;font-weight:500;display:block;letter-spacing:.14px;margin:-4px auto;padding:4px;text-align:center;text-transform:uppercase;min-width:30px}

table tbody tr td .status-01{background-color:#4285f4}
table tbody tr td .status-02{background-color:#db4437}
table tbody tr td .status-03{background-color:#fbc02d}
table tbody tr td .status-04{background-color:#0f9d58}
table tbody tr td .status-05{background-color:#ab47bc}
table tbody tr td .status-06{background-color:#00acc1}
table tbody tr td .status-07{background-color:#ff7043}
table tbody tr td .status-08{background-color:#9e9d24}
table tbody tr td .status-09{background-color:#5c6bc0}
table tbody tr td .status-10{background-color:#f06292}
table tbody tr td .status-11{background-color:#00796b}

table tbody tr td .status-brom{background-color:yellow;border:1px solid #000;color:#000}
table tbody tr td .status-brom a{color:#000}
table tbody tr td .status-brom a:hover{text-decoration:none}

table tbody tr td .status-snor{background-color:blue;  border:1px solid #000;color:#fff}
table tbody tr td .status-snor a{color:#fff}
table tbody tr td .status-snor a:hover{text-decoration:none}

table tbody tr td .status-blue{background-color:#4285f4}
table tbody tr td .status-red{background-color:#db4437}
table tbody tr td .status-orange{background-color:#fbc02d}
table tbody tr td .status-green{background-color:#0f9d58}
table tbody tr td .status-purple{background-color:#ab47bc}

/* Inline Edit*/
table tbody tr td textarea.inline-edit{background:transparent;border:0;cursor:pointer;font-size:12px;height:15px;margin-bottom:-3px;overflow:hidden;padding:0;resize:none;width:80%}
table tbody tr td textarea.inline-edit:focus{background:#FFF;border:1px solid #888;cursor:text;height:65px;overflow-y:scroll;resize:both;padding:2px 4px}


/* table tbody tr.total td{background-color:rgb(248,249,250);border-bottom:1px solid rgb(218, 220, 224);color:rgb(32,33,36);font-size:12px;padding:13px;text-align:right} */

table tfoot tr td{height:52px}
table tfoot tr td form{float:right}
table tfoot tr td input{border-bottom:1px solid #ccc;border-left:1px solid #a3a3a3;border-right:1px solid #ccc;border-top:1px solid #a3a3a3;box-shadow:inset 0 1px 0 #d6d6d6;height:20px;margin:0;padding-left:5px;vertical-align:middle;width:25px}
table tfoot tr td p{color:#666;float:right;font-size:11px;margin:5px 9px 0 5px}
table tfoot tr td ul{background-color:#e8e8e8;;border:1px solid #bbb;border-radius:3px;float:right;list-style:none;margin:0 2px;padding:0;vertical-align:middle}
table tfoot tr td li{border-bottom:1px solid transparent;border-left:1px solid #fff;border-right:1px solid #bbb;border-top:1px solid transparent;color:#222;cursor:pointer;display:block;float:left;font-size:11px;height:19px;line-height:20px;padding:0 8px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #eee}
table tfoot tr td li:hover{border:1px solid #999;margin:-1px 0 -1px -1px;padding:1px 8px 1px 9px}
table tfoot tr td li:active{background-color:#c8c8c8;border:1px solid #999;text-shadow:0 1px 0 #eee}
table tfoot tr td li:first-of-type{border-left:0;border-radius:3px 0 0 3px;box-shadow:inset 1px 0 #fff}
table tfoot tr td li:last-of-type{border-radius:0 3px 3px 0;border-right:0}
table tfoot tr td li:hover:first-of-type{border-color:#999;border-left:1px solid transparent;box-shadow:none}
table tfoot tr td li:hover:last-of-type{border-color:#999;border-right:1px solid #999;margin:-1px;padding:1px 8px 1px 9px}
table tfoot tr td a{display:inline-block;height:100%;width:10px}
table tfoot tr td #vorige{background:url('//orangebite-img-admin.s3.eu-central-1.amazonaws.com/prevArrow_ltr.gif') 50% 50% no-repeat}
table tfoot tr td #volgende{background:url('//orangebite-img-admin.s3.eu-central-1.amazonaws.com/nextArrow_ltr.gif') 50% 50% no-repeat}

table tfoot tr th{border-top:2px solid rgb(128,134,139);border-left:1px solid rgb(218,220,224);color:rgb(32,33,36);font-size:12px;font-weight:500;height:44px;line-height:44px;padding:0 13px}
table tfoot tr th:first-of-type{border-left:0}

table.layout-fixed{table-layout:fixed}
table.layout-fixed thead tr th{box-sizing:border-box}

/*
td#overview_pagination{padding:5px 8px 2px 8px}

#datatable table thead th{border-bottom:1px solid #BBB;border-top:1px solid #BBB;font-weight:normal;padding:8px 8px 7px 8px;text-align:left}
#datatable table thead th b{background:url('//orangebite-img-admin.s3.eu-central-1.amazonaws.com/sort_desc.gif') no-repeat center right;display:block}

#datatable-separator{background:#EFEFEF;border-top:2px solid #666;height:25px;padding:2px 5px 7px 5px}

*/


.dashboard{display:flex;flex-wrap:wrap;justify-content:flex-start;margin:16px auto;min-width:504px;max-width:1512px;width:100%}

.scorecards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));grid-gap:16px;margin-top:16px;width:100%}
.scorecard{background-color:rgb(255,255,255);border-radius:2px;box-shadow:0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);display:inline-block;text-align:center}
.scorecard:hover{transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.3s;transition-property:box-shadow}
.scorecard-header{border-radius:2px 2px 0 0;color:rgba(0, 0, 0, 0.87);font-size:18px;font-weight:400;height:48px;line-height:48px;margin:16px;text-align:center;padding:0}
.scorecard-content-negative, .scorecard-content-neutral, .scorecard-content-positive{border-radius:50%;font-size:32px;font-weight:500;height:120px;line-height:120px;margin:0 auto;text-align:center;width:120px}

.scorecard-content-negative {background-color:rgb(254, 239, 227);border:1px solid rgb(194, 100,   1);color:rgb(194, 100,   1)}
.scorecard-content-neutral  {background-color:rgb(232, 240, 254);border:1px solid rgb( 25, 103, 210);color:rgb( 25, 103, 210)}
.scorecard-content-positive {background-color:#e6f4ea;border:1px solid #188038;color:#188038}

.scorecard-txt{color:rgba(0, 0, 0, 0.87);font-size:18px;font-weight:400;height:48px;line-height:48px;margin:16px;text-align:center;padding:0}
.scorecard-footer{align-items:center;background-color:rgb(255,255,255);border-radius:0 0 2px 2px;box-shadow:rgb(218, 220, 224) 0px 1px 0px 0px inset;flex-flow:row nowrap;display:flex;justify-content:space-between;height:64px;line-height:64px;;margin:0;padding:8px;width:100%}
.scorecard-footer a{border-radius:2px;color:rgb(66,133,244);display:inline-block;font-size:14px;font-weight:500;letter-spacing:0.14px;line-height:17px;margin:0 auto;padding:10px 8px;text-align:center;text-decoration:none;text-transform:uppercase;white-space:nowrap}
.scorecard-footer a:hover{background-color:#e9f1fe}


.time-series-card{background-color:#fff;border-radius:2px;box-shadow:0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 12%), 0 1px 5px 0 rgb(0 0 0 / 20%);flex-grow:1;height:328px;min-width:992px}

.time-series-stats{border-top-left-radius:2px;border-top-right-radius:2px;display:flex;flex-grow:1;width:100%}
.time-series-stat{align-items:flex-start;flex-direction:column;height:80px;margin-bottom:16px;min-width:184px;width:184px}
.time-series-stat-1{background-color:rgb( 66, 133, 244);color:rgb(255,255,255)}  /*  */
.time-series-stat-2{background-color:rgb(219,  68,  55);color:rgb(255,255,255)}  /* #d93025 */
.time-series-stat-3{background-color:rgb(244, 180,   0);color:rgb( 60, 64, 67)}  /* #f29900 */
.time-series-stat-4{background-color:rgb( 15, 157,  88);color:rgb(255,255,255)}  /* #1e8e3e */
.time-series-stat-5{background-color:rgb(171,  71, 188);color:rgb(255,255,255)}
.time-series-stat-6{background-color:rgb(  0, 172, 193);color:rgb(255,255,255)}
.time-series-stat-7{background-color:rgb(255, 112,  67);color:#3c4043}
.time-series-stat-8{background-color:rgb(255, 255, 255);color:rgb( 60, 64, 67)}

.time-series-stat-label{display:block;font-size:13px;font-weight:400;margin:16px 8px 0 12px;padding:0 4px 2px 4px}
.time-series-stat-metric{display:block;font-size:24px;font-weight:400;line-height:29px;padding:8px 16px 0 16px}

.time-series-card svg{height:216px;width:100%}
.time-series-card svg rect{fill:rgb( 66, 133, 244)}

.card-row{display:flex;flex-wrap:wrap;margin:16px auto;width:100%}

.summarycard{align-items:center;background-color:#fff;border-radius:2px;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2);display:flex;flex-direction:column;height:328px;justify-content:space-evenly;margin-left:16px;text-align:center;width:240px}
.summarycard-header{color:rgba(0,0,0,.87);font-size:18px;font-weight:400;margin:0;padding:0;text-align:center}
.summarycard-negative,.summarycard-positive{border-radius:50%;font-size:32px;font-weight:500;height:120px;line-height:120px;text-align:center;width:120px}
.summarycard-negative{background-color:#feefe3;border:1px solid #c26401;color:#c26401}
.summarycard-positive{background-color:#e6f4ea;border:1px solid #188038;color:#188038}
.summarycard-txt{font-size:16px;font-weight:400;margin:0;padding:0;text-align:center}