input[readonly] { color: #333 !important; }
textarea[readonly] { color: #333 !important; }
div.disabled label { color: #999 !important; }
.label-default { background-color: #EEE; color: #666 !important; }

.b-darker { border-color: #CCC; }

.text-master-lighter { color: #828282 !important; }

.text-master-lightest { color: #C2C2C2 !important; }

li.dropdown { padding: 0 !important; }

a.dropdown-toggle:hover, .navbar-form > .form-group > input:hover, .navbar-form > .form-group > button:hover { background-color: #F8F8F8 !important; }

.navbar-form { height: 60px; align: center; padding: 5px !important; margin: 0 !important; display: flex; align-items: center; justify-content: center;}

.pace .pace-activity
{
    display: none !important;
}

.login-container
{
    overflow-y: auto;
}

.plain-content
{
    padding: 15px 25px;
}

.btnx
{
    position: relative;
    display: inline-block;
    padding: 5px;
    text-align: center;
    vertical-align: middle;
}

.uppercase
{
    text-transform: uppercase;
}

.thin
{
    font-weight: 200;
}

.label-block
{
    max-width: unset !important;
    width: 100%;
}

.label-auto
{
    max-width: unset !important;
}

@media (max-width: 799px)
{
    .plain-content
    {
        padding: 0px;
    }
}

.mouse-pointer, .filter-hover
{
    cursor: pointer;
}

.calculation-table
{
    width: 100%;
}

.calculation-table th
{
    padding: 0px 5px 5px 5px;
}

.calculation-table td
{
    padding: 2px 5px;
    vertical-align: baseline;
}

.calculation-table td.number
{
    text-align: right;
    -font-family: Consolas, Lucida Console, monospace !important;
    -font-size: 110%;
}

.calculation-table td.number::after
{
    padding-left: 0.2em;
    content: "€";
    -font-family: serif;
}

.calculation-table td.times
{
    text-align: right;
    -font-family: Consolas, Lucida Console, monospace !important;
}

.calculation-table td.times::after
{
    padding-left: 0.2em;
    content: "\002715";
    -font-family: serif;
}

.calculation-table td.number-important
{
    text-align: right;
    font-size: 120%;
    font-weight: bold;
}

.calculation-table h5
{
    margin: 0px;
}

.calculation-table tr.subsum td
{
    padding: 0;
    margin: 0;
}

.calculation-table tr.subsum div
{
    width: 60%;
    border-top: 1px dotted #CCC;
    margin-top: 10px;
    float: right;
}

.calculation-table tr.deductions div
{
    border-top: 1px dotted #999;
    margin-top: 15px;
    padding-bottom: 5px;
}

.calculation-table tr.sum div
{
    border-top: 1px solid #999;
    margin-top: 15px;
    padding-bottom: 5px;
}

.calculation-table tr.heading div
{
    border-top: 1px solid #999;
    padding-bottom: 5px;
}

.th-fix
{
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.code, .code textarea 
{
    font-family: Consolas, Lucida Console, monospace !important;
}

.formatted-note
{
    font-family: Consolas, Lucida Console, monospace !important;
    white-space: pre-wrap;    
}

.formatted-address
{
    white-space: pre-wrap;    
}

.inputfield-warning
{
    border-color: #F00 !important;
}

.mandatory .form-group-default
{
    border-color: #2ab27b !important;
}

/*
.table tbody tr td, .table-condensed tbody tr td, .table.table-condensed thead tr th
{
    padding-left: 8px;
}

.table tbody tr td:first-child, .table-condensed tbody tr td:first-child
{
    padding-left: 18px;
}
*/

.filter-menu-active
{
    color: #2ab27b !important;
}

/*
.filter-menu-active::after
{
    content: '';
    position: absolute;
    z-index: 300;
    bottom: 0px;
    left: 1px;
    right: 1px;
    height: 4px;
    background-color: #666;
}
*/

.filter-hover:hover
{
    background-color: #F8F8F8;
}

tr.filter-hover:hover > td
{
    background-color: #F8F8F8 !important;
}

.btn-warning
{
    background-color: #fab233;
}

.vh100
{
    height: 100vh;
    height: calc(100vh - var(--vh-offset, 0px));
}

.max-modal-height
{
    max-height: calc(99vh - 3px);
    max-height: calc(99vh - 3px - var(--vh-offset, 0px));
    overflow-y: scroll;
}

.input-danger, .input-danger .form-group
{
    border-color: #F00 !important;
    border-size: 2px;
    color: #F00;
}

.no-min-height
{
    min-height: 0px !important;
}

h1, h2, h3, h4, h5, h6 
{
    font-weight: 400 !important;
}

.d32.circular span
{
    font-size: 14px !important;
    font-weight: bold !important;
}

/* inner shadow for map */
.map
{
    position: relative;
    z-index: 0;
}

.map > .map-wrapper
{
    position: relative;
    z-index: 5;
}

.map:before
{
    content: '';
    position: absolute;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    z-index: 10;
    pointer-events: none;
    box-shadow: inset 0px 0px 6px 3px rgba(0,0,0,0.15);
}

@media (max-width: 1023px)
{
    .map:before
    {
        box-shadow: inset 0px 0px 12px 1px rgba(0,0,0,0.1);        
    }
}

.scrollable-menu
{
    height: auto;
    max-height: 50vh;
    overflow-x: hidden;
}

.drop-shadow-1
{
    box-shadow: 0 1px 3px rgba(0,0,0,0.25), 0 1px 3px rgba(0,0,0,0.25) !important;
}

.drop-shadow-1:hover
{
    box-shadow: 0 3px 6px rgba(0,0,0,0.25), 0 3px 6px rgba(0,0,0,0.25) !important;
}

.drop-shadow-2
{
    box-shadow: 0 6px 6px 0px rgba(0,0,0,0.25) !important;
}

.drop-shadow-xl
{
    box-shadow: 0 6px 18px 0px rgba(0,0,0,0.25) !important;
}

.tab-content-scrolling
{
    max-height: calc(100vh - 260px) !important;
    max-height: calc(100vh - 260px - var(--vh-offset, 0px));
    overflow-y: scroll !important;
    padding-right: 15px;
}

.panel-scrolling-body
{
    padding-right: 5px !important;
}

.tab-content-scrolling-no-buttonbar
{
    max-height: calc(100vh - 160px) !important;
    max-height: calc(100vh - 160px - var(--vh-offset, 0px));
    overflow-y: scroll !important;
}

.dialog-1
{
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important;
    padding: 25px;
    background-color: rgba(250, 250, 250, 0.95);
}

.header-inner
{
    display: flex !important;
    align-items: center !important;
    white-space: nowrap !important;
}

.xmodal-xl { width: 100vw; height: 100vh; height: calc(100vh - var(--vh-offset, 0px));  margin: 0px !important; pointer-events: all; }

.modal-xl { width: 100%; height: 100%; margin: 0px auto auto auto !important; }
.modal-content { border-radius: 0x !important; }

@media (min-width: 1024px)
{
    .modal-xl { width: 1024px; height: 99vh; height: calc(99vh - var(--vh-offset, 0px)); margin: -5px auto auto auto !important; }
    .modal-content { border-radius: 4px !important; }
}

.expanded .modal-xl
{
    width: 100%;
    height: 100%;
    margin: 0px auto auto auto !important;
}

/*
.expanded .modal-dialog, .expanded .modal-content
{
    margin: 0px auto auto auto !important;
}
*/

.expanded .modal-content
{
    border-radius: 0px !important;
}

#task-footer
{
    position: absolute;
    z-index: 2;
    left: 0; right: 0; bottom: 0;
    border-top: 1px solid #CCC !important; text-align: center !important; padding: 0px 30px 0px 30px !important;
}

@media (max-width: 767px)
{
    .modal-header { padding: 5px 0 5px 0 !important; }
    .modal-body, .modal-footer { padding: 0 !important; }

    .nav-tabs > li > a { padding: 10px 10px !important; min-width: unset !important; }

    .task-nav-tabs { width: 100%; overflow: scroll; }

    .tab-content { padding-top: 0 !important; }
}

@media (max-width: 479px)
{
    .nav-tabs > li > a { padding: 5px 8px !important; min-width: unset !important; }
}

.layout-filter { position: absolute; top: 60px; z-index: 100; width: 100% !important; height: 60px !important; border: none !important; background: none !important; }
.layout-below-filter { padding-top: 60px !important; }

@media (max-width: 767px)
{
    .layout-below-filter { padding-top: 0px !important; }

    .layout-filter
    {
        top: 45px;
        left: unset !important;
        right: 0;
        width: 300px !important;
    }

    .layout-filter > .navbar-collapse
    {
        background-color: #FFF !important; overflow-y: scroll;
        box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important;
        max-height: calc(100vh - 60px) !important;
        max-height: calc(100vh - 60px - var(--vh-offset, 0px));
    }
}

html
{
    overflow: hidden;
}
.page-content-wrapper
{
    position: fixed !important;
    width: 100% !important;
    overflow-y: auto;
}

@media (min-width: 992px)
{
    .page-content-wrapper
    {
        width: calc(100% - 70px) !important;
    }
}

.hide-map { display: block; }
.show-list { display: block; }

.map-layout-map     { position: relative; float: left; width: calc(100% - 360px); height: 100%; }
.map-layout-list    { position: relative; float: left; width: 360px !important; height: 100%; overflow-y: scroll; }

.map-layout-toggle  { position: absolute; z-index: 999; width: 100%; left: 0px; right: 0px; bottom: 0px; display: none; }

.map-layout-list-datebox    { width: 70px; padding: 10px 10px; }
.map-layout-list-title-text { width: 230px !important; }

.assignment .map-layout-map     { width: calc(100% - 420px); }
.assignment .map-layout-list    { width: 420px !important; }

@media (min-width: 1400px)
{
    .map-layout-map     { position: relative; float: left; width: calc(100% - 420px); height: 100%; }
    .map-layout-list    { position: relative; float: left; width: 420px !important; height: 100%; }    

    .map-layout-list-title-text { width: 320px !important; }
}

/* V1 */
@media (max-width: 799px)
{
    .dashboard .map-layout-map     { width: 100%; height: calc(100% - 50px); }
    .dashboard .map-layout-list    { width: 100% !important; height: calc(100% - 50px); display: none; border: none !important; background-color: #F7F7F7 !important; }

    .dashboard .hide-map { display: none; }
    .dashboard .show-list { display: block; }

    .map-layout-toggle  { display: block; height: 50px; }
}

/* NEW MODAL! */

.new-modal
{
    max-height: calc(100vh);
    max-height: calc(100vh - var(--vh-offset, 0px));

    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.new-modal .tab-pane
{
    padding-bottom: 25px;
}

@media (min-width: 1024px)
{
    .new-modal
    {
        max-height: calc(99vh - 3px);
        max-height: calc(99vh - 3px - var(--vh-offset, 0px));
    }
}

.modal-top-bar
{
    /*
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    left: 0px;
    right: 0px;
    */

    background-color: rgba(248,248,248,0.90);
    z-index: 5;
    padding: 15px 25px;
}

.modal-center-body
{
    /*
    max-height: calc(100vh) !important;
    max-height: calc(100vh - var(--vh-offset, 0px)) !important;
    */
    /*
    flex: 1 100% 0;
    */

    flex-grow: 1;
    flex-basis: 50rem;
    padding: 15px 25px;
    overflow-y: scroll;
}

.modal-bottom-bar
{
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 5;
    background-color: rgba(248,248,248,0.90);
    padding: 15px 25px;
    box-shadow: 0px -2px 20px 2px rgba(0,0,0,0.05);
}

/*
.modal-bottom-bar::before
{
    content: '';
    left: 0;
    top: 5px;
    right: 0px;
    height: 3px;
    display: block;
    margin-bottom: 5px;
    background-color: #CCC;
}
*/

@media (min-width: 1024px)
{
    .modal-top-bar, .modal-center-body, .modal-bottom-bar
    {
        padding: 15px 45px;
    }
}

@media (max-width: 599px)
{
    .modal-top-bar, .modal-center-body, .modal-bottom-bar
    {
        padding: 5px 15px;
    }
}

.modal-top-bar .nav-tabs-simple::after
{
    border: none;
}

.modal-top-bar ul a
{
    -font-family: Arial, sans-serif;
    font-weight: bold;
}

@media (orientation: landscapeX)
{
    .modal-top-bar-header, .modal-top-bar-menu
    {
        text-align: left;
    }

    .modal-top-bar-header *
    {
        font-size: 14pt;
    }

    .modal-top-bar ul a
    {
        font-weight: bold;
    }

    .nav-tabs-simple > li:after
    {
        height: 3px;
        background-color: unset;
    }

    .modal-top-bar-menu li.active
    {
        border-bottom: 0px solid #999;
        background-color: #fff !important;
        display: block;
        width: 100%;
    }

    .new-modal
    {
        flex-direction: row;
        -display: block;
    }

    .modal-top-bar
    {
        padding-right: 0px;
        float: left;
        display: inline-block;
        position: relative;
        width: 20%;
        height: 100vh !important;
        z-index: 100;
    }

    .modal-center-body
    {
        float: left;
        display: inline-block;
        width: 80%;
    }
}

@media (max-width: 799px)
{
    .new-modal .tab-content, .modal-top-bar ul
    {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .modal-top-bar h3
    {
        font-size: 14pt;
        line-height: 14pt;
    }

    .modal-top-bar, .modal-bottom-bar
    {
        padding: 15px 15px;        
    }
}

/* V2 */
/*
@media (max-width: 799px)
{
    .map-layout-map     { width: 100%; height: 80vh; height: calc(80vh - var(--vh-offset, 0px)); }
    .map-layout-list    { width: 100%; height: 100%; -display: none; }

    .hide-map { display: none; }
    .show-list { display: block; }

    .map-layout-toggle  { display: block; }
}
*/

#route-buttons-wrapper
{
    position: absolute;
    vertical-align: top;
    z-index: 2;
    left: 15px;
    right: 15px;
    bottom: 5px;
}

#route-buttons
{
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
}

@media (max-width: 799px)
{
    #route-buttons
    {
        left: 3px !important;
        bottom: 3px !important;
    }

    .route-button-day, .route-button-day:hover
    {
        background-color: #FFF !important;
        margin: 0px 3px 0px 0px !important;
        -border-radius: 0;
        -box-shadow: unset !important;
        -border: 1px solid #DDD !important;
    }

    .route-button-day-indicator 
    {
        position: absolute;
        margin: 0px 4px 0px 1px !important;
        bottom: 0px;
        left: 0px;
        right: 0px;
        height: 10px;
        z-index: 3;
    }
}

.fc-list-table td
{
  border-width: 1px 0 0;
  padding: 8px 14px !important;
}

.fc-time-grid-event
{    
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important;
    padding: 25px;
    margin: 3px;
    background-color: #FFF;
    border-left: 4px solid #666;
}

.fc-day-grid-event
{    
    box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.1) !important;
    -padding: 25px;
    padding-left: 4px;
    padding-right: 4px;
    margin: 1px;
    background-color: #FFF;
    border-left: 4px solid #333;
}

.fc-time-grid .fc-slats td
{
    -height: 5px !important;
    padding-top: 0px;
    padding-bottom: 0px;
}

.fc-bgevent
{
    opacity: 1 !important;
    padding-left: 4px;
    padding-right: 4px;
    border-top: 2px dotted #D0D0D0 !important;
    border-bottom: 2px dotted #D0D0D0 !important;
    -text-shadow: 0 0 3px #FFF !important;
    vertical-align: bottom !important;
}

.fc-bottom
{
    position: absolute;
    bottom: 2px;
}

.fc-addToCalendar-button
{
    background-color: #e95555 !important;
    border-color: #e95555 !important;
    color: #FFFFFF !important;
}

a.fc-event:hover
{
    color: #333 !important;
}

/* DataTables ... */

.dataTables_scrollBody
{
    background: repeating-linear-gradient(45deg, #F8F8F8, #F8F8F8 10px, #fff 10px, #fff 20px) !important;
}

.filter_toolbar
{
    padding: 0 !important;
    border: none;
}

.table.dataTable
{
    border-collapse: collapse !important;
}

table.dataTable.table-condensed .sorting::after, table.dataTable.table-condensed .sorting_asc::after, table.dataTable.table-condensed .sorting_desc::after
{
    top: unset;
}

/* Menu */

.page-sidebar .sidebar-header
{
    padding: 0 20px !important;
}

.page-sidebar a,
.page-sidebar button,
.page-sidebar a:visited,
.page-sidebar button:visited,
.page-sidebar a:focus,
.page-sidebar button:focus
{
  color: #C0C8CF !important;
}

.page-sidebar a:hover,
.page-sidebar button:hover,
.page-sidebar a:active,
.page-sidebar button:active
{
  color: #FFF !important;
}

/* Pages Quick-Fix */
@media only screen and (min-width: 980px) body.menu-pin .page-container .page-content-wrapper .content
{
    padding-left: 180px;
}

body.menu-pin .page-container .header
{    
    padding-left: 180px;
}

body.mobile .sidebar-menu
{
    overflow-x: hidden;
    overflow-y: auto;
}

/* ... */

.equal-height
{
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}

/* Dyna-Form */

.btn-success .fa-circle-o.dyna-form-select-marker:before
{
    content: "\f111" !important;
    color: #2ab27b;
}

.fa-square-o.dyna-form-select-marker:before
{
    color: #CCC;
    content: "\f00c" !important;
}

.btn-success .fa-square-o.dyna-form-select-marker:before
{
    content: "\f00c" !important;
    color: #2ab27b;
}

.dyna-form-edit .form-group-default
{
    border-color: #CCC;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.125), 0 1px 2px rgba(0,0,0,0.125) !important;
}

.dyna-form-fill .form-group-default
{
    border-color: #e7e7e7 !important;
    border-radius: 2px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.02), 0 4px 12px rgba(0,0,0,0.01) !important;
}

/* .dyna-form-fill */ .form-group-default:focus-within
{
    background-color: #FEFEFE;
    border-color: #2ab27b !important;
    box-shadow: 0 0px 12px rgba(42,178,123,0.2), 0 0px 12px rgba(42,178,123,0.1) !important;
}

.form-group:focus-within label
{
    opacity: 0.6;
}

/*.dyna-form-edit*/ .dyna-form-hidden .form-group-default
{
    border-color: #999;
    border-style: dashed !important;
}

/*
.dyna-form-fill .dyna-form-question.dyna-form-hidden 
{
    border-left: 15px solid #2ab27b;
}
*/

.dyna-form-fill .dyna-form-question
{
    margin-bottom: 5px !important;
}

.dyna-form-add-new
{
    max-height: 15px; overflow: hidden;
    opacity: 0;
    transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
}

.dyna-form-add-new-container
{
    margin: 10px 0px;
    padding: 5px;
    overflow: auto;
    display: block;
    position: relative;
    border-radius: 3px;
    border: 1px dotted #999;
}

.dyna-form-add-new:hover
{
    max-height: 100px;
    overflow: auto;
    opacity: 1;
    transition: max-height 0.3s ease-out 0.5s, opacity 0.3s ease-out 0.6s;
}

.dyna-form-add-new a
{
    color: #999;
    padding: 10px 10px;
    border-radius: 3px;
}

.dyna-form-add-new a:hover
{
    border-color: #2ab27b;
    background-color: #2ab27b;
    color: #fff;
}

.dyna-form .form-group-default:focus-within
{
    background-color: #FFF !important;
}

.dyna-form-label
{
    border-radius: 3px; border: 1px solid #FFF; padding: 0px 2px 0px 0px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 16px;
}

.dyna-form-select .dyna-form-label
{
    font-size: 14px;    
    color: #666;
}

input.dyna-form-label::placeholder
{
    color: #666;
}

.dyna-form-delete, .dyna-form-delete-select
{
    color: #CCC;
    cursor: pointer;
}

.dyna-form-delete:hover, .dyna-form-delete-select:hover
{
    color: #C00;
    cursor: pointer;
}

.ui-sortable-handlexxx
{
    cursor: move;
}

.dyna-form-label:focus
{
    color: #2ab27b;
}

.dyna-form-placeholder
{
    border: 1px dotted #CCC;
    border-radius: 2px;
    min-height: 60px !important;
    margin-bottom: 10px;
}

.dyna-form-select-placeholder
{
    border: 1px dotted #CCC;
    border-radius: 2px;
    min-height: 30px !important;
    margin-bottom: 10px;
}

/*
.dyna-form-connect.selecting .label
{
    color: #FFF !important;
    background-color: #2ab27b !important;
}
*/

.dyna-form-connection
{
    -color: #F7f7f7;
    -opacity: 0.1;
}

.dyna-form-hidden .dyna-form-connection
{
    opacity: 1;
}

.dyna-form-connection > .label, .label.dyna-form-connect
{
    display: inline-block;
    padding: 5px 5px;
    -min-width: 40px;
    text-transform: uppercase;
}

.dyna-form-mandatory.label, .dyna-form-hidden.label
{
    padding: 5px 10px;
    -color: #666;
    -background-color: #CCC;
    text-transform: uppercase;
    cursor: pointer;
}

.dyna-form-mandatory.label.selected, .dyna-form-hidden.label.selected
{
    color: #FFF !important;
    background-color: #2ab27b !important;
}

.label.dyna-form-connect
{
    margin-right: 15px;
}

.dyna-form-connection i
{
    color: #CCC;
}

.dyna-form-connection.selecting i
{
    color: #333;
}

.dyna-form-connection.selected i
{
    color: #2ab27b;
}

.dyna-form-connection.selected span
{
    color: #FFF !important;
    background-color: #2ab27b !important;
}

.dyna-form-connection.selecting span
{
    color: #666;
    background-color: #EEE;
}

.connecting .btn, .dyna-form-question.disabled label, .connecting .label, .dyna-form-question.disabled input, .connecting .dyna-form-layout-handle, .connecting .dyna-form-header
{
    opacity: 0.3;
    transition: opacity 0.3s ease-out;
}

.dyna-form-select.selecting *, .connecting .dyna-form-connection .label
{
    opacity: 1.0 !important;
}

.dyna-form-edit .dyna-form-select.selecting .btn
{
    border-color: #2ab27b !important;
}

.dyna-form-edit .dyna-form-select .btn, .dyna-form-fill .btn:hover
{
    background-color: #FFF !important;    
}

.dyna-form-connect:hover, .btn.dyna-form-connect:hover
{
    color: #FFF !important;
    background-color: #2ab27b !important;
}

.connecting .dyna-form-add-new
{
}

.dyna-form-fill .dyna-form-add-new
{
    display: none;
}

.dyna-form-edit .dyna-form-select
{
    display: block;
    border-top: 1px solid #EEE;
    -background-color: #FFF;
    -border-radius: 3px;
    padding: 5px; -margin: 5px;
}

.dyna-form-edit .dyna-form-select-parent
{
    padding-top: 15px !important;
}

.dyna-form-select xinput
{
    border-color: #F7F7F7;
    background-color: #FFF !important;    
}

.dyna-form-edit .dyna-form-select div.btn
{
    -border: 1px solid #CCC !important;
    -border-radius: 3px;
    padding: 5px;
    border: none;
}

.dyna-form-fill .dyna-form-select
{
    position: relative; float: left;
    -margin-left: 10px;
    margin-right: 10px;
}

.dyna-form-select-parent
{
    overflow: hidden;   /* because it contains "float: left;" children only and hence would have zero height! */
}

.dyna-form-fill .dyna-form-select div.btn
{
    text-transform: uppercase;
    font-weight: 600 !important;
    font-size: 12px;
    color: #999;

    border-width: 2px;
    border-color: #FEFEFE;
    background-color: #FEFEFE;
}

.dyna-form-fill .btn[disabled]
{
    opacity: 1;
}

.dyna-form-select
{
    border: 1px solid #FFF;
    padding: 0px !important;
    margin: 5px !important;
}

.dyna-form-select:focus
{
    outline: unset !important;
    border: 1px dotted #999 !important;
    border-radius: 3px;
}

.dyna-form-select:focus div.btn
{
}

.dyna-form-select .btn-success, .btn-success .dyna-form-select-marker
{
    background-color: unset !important;
    color: #2ab27b !important;
    border-color: #2ab27b !important;
}

.dyna-form-edit .dyna-form-input
{
    color: #999;
    opacity: 0.7 !important;
}

.dyna-form-fill .dyna-form-input
{
    font-weight: 600 !important;
    font-size: 16px;
    color: #2ab27b;    
    margin-top: 5px;
    margin-bottom: 5px;
    padding-left: 15px;
    white-space: pre-wrap;
    line-height: 26px;
}

.dyna-form-edit .dyna-form-layout-prefix
{
    width: 60px;
    position: relative; float: left;
    background-color: #F0F0F0;
    padding: 5px;
    text-align: right;
    font-size: 24px;
    color: #999;
    font-weight: 400;
}

.dyna-form-layout-prefix.selected
{
    background-color: #2ab27b;
    color: #FFF;    
}

.dyna-form-fill .form-group label
{
    -padding: 3px;
    font-size: 12px !important;
}

.dyna-form-edit .dyna-form-layout-main
{
    width: calc(100% - 110px);
    position: relative; float: left;
}

.dyna-form-edit .dyna-form-layout-handle
{
    width: 48px;
    position: relative; float: left;
    padding: 5px;
    -margin-left: 2px;
    background-color: #F0F0F0;
}

.dyna-form-fill .dyna-form-layout-main
{
    width: 100%;
}

.dyna-form-fill .dyna-form-layout-handle, .dyna-form-fill .dyna-form-layout-prefix
{
    display: none;
}

.dyna-form-fill .btn:disabled
{
    cursor: not-allowed;
}

.dyna-form-fill .dyna-form-layout-main .form-group:before
{
    content: "";
    width: 10px;
    height: 100%;
    background-color: #666;
}

.dyna-form-edit .dyna-form-header
{
    border: 1px solid #CCC;
    border-radius: 2px;
    background-color: #FFF;
    width: 100%;
    -font-family: "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 20px;
    font-weight: 400;
    display: flex;
    align-items: center;
    box-shadow: 0 1px 2px rgba(0,0,0,0.125), 0 1px 2px rgba(0,0,0,0.125) !important;
}

.dyna-form-fill .dyna-form-header
{
    margin: 15px 0 5px 0;
    font-weight: 400 !important;
    font-size: 24px;
    line-height: 25.88px;
    color: #666;
}

.dyna-form-header-number
{
    display: inline-block;
    width: 46px;
    height: 46px;
    border-radius: 2px;
    color: #666;
    background-color: #E7E7E7;
    font-weight: 600;
    line-height: 43px;
    margin-right: 15px;
    text-align: center;
}

.dyna-form-edit .dyna-form-header-number
{
    width: 46px;
    height: 46px;    
    line-height: 43px;
    background-color: #E7E7E7 !important;
    border-radius: 0px;
}

.dyna-form-connect-settings
{
    margin: 10px 0px 10px 25px;
    border: 1px solid #CCC;
    border-radius: 3px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05), 0 2px 5px rgba(0,0,0,0.05) !important;
}

.dyna-form-connect-settings-header
{
    padding: 2px 5px;
    text-align: center;
    background-color: #F7F7F7;
    color: #666;
    text-transform: uppercase;
    border-radius: 3px 3px 0 0;
    font-size: 80%;
    font-weight: bold;
}

.dyna-form-connections
{
    overflow-y: scroll;    
    max-height: 250px;
    border-top: 1px solid #E7E7E7;
    border-bottom: 1px solid #E7E7E7;
}

.dyna-form-connection-line
{
    cursor: pointer;
    padding: 5px 10px;
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
}

.dyna-form-connection-line .btnx
{
    min-width: 50px;
    font-weight: bold;
}

.dyna-form-connection-line.selected .btnx
{
    color: #2ab27b;
}

.dyna-form-connection-line:hover
{
    border-radius: 3px;
    background-color: #F7F7F7 !important;
}

.dyna-form-connection-line .fa-circle-o:before
{
    content: "\f096" !important;
    color: #ccc;
}

.dyna-form-connection-line.selected .fa-circle-o:before
{
    content: "\f14a" !important;
    color: #2ab27b;
}

/* Dyna-Calc */

table.dyna-calc
{
    width: 100%;
    table-layout: auto !important;
}

.dyna-calc input
{
    -display: inline-block;
}

.dyna-calc td
{
    padding: 5px;
    border-bottom: 1px dashed #E7E7E7;
}

.dyna-calc-header td
{
    padding: 5px;
    border-bottom: 1px solid #E7E7E7;
    text-align: right;
    font-size: 75%;
    color: #2ab27b;
    text-transform: uppercase;
    font-weight: bold;
}

.dyna-calc-header td:first-child
{
    text-align: left;
    opacity: 0;
}

.dyna-calc-category input
{
    border-color: #FFF;
    font-size: 20px;
    font-weight: bold;
    margin-top: 10px !important;
}

.dyna-calc-category td
{
    border-bottom: 1px solid #CCC;
}

.dyna-calc-number
{
    width: 60px;
    white-space: nowrap;
}

.dyna-calc-currency
{
    width: 120px;
    white-space: nowrap;
}

.dyna-calc-delete-row
{
    width: 20px;
    color: #EEE;
}

.dyna-calc-delete-row:hover
{
    color: #F00;
}

.dyna-calc-craft input::placeholder
{
    color: #999 !important;
    opacity: 1 !important;
}

.dyna-calc-category input::placeholder
{
    color: #CCC !important;
    opacity: 1 !important;
}

.dyna-calc-empty .dyna-calc-number input, .dyna-calc-empty .dyna-calc-currency input
{
    color: #EEE !important;
}

.dyna-calc-empty .dyna-calc-delete-row i
{
    display: none;
}

.dyna-calc-category-sum input
{
    font-weight: bold;
}

.dyna-calc-deduction input
{
    color: #F00 !important;
}

.dyna-calc-deduction.dyna-calc-empty input::placeholder
{
    color: #999 !important;
    opacity: 1 !important;
}

.category-overall td
{
    border-bottom: unset !important;
    border-top: 1px solid #666;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.category-overall, .category-overall input
{
    font-size: 20px !important;
    font-weight: bold;
}