﻿@charset "UTF-8";
/* ==========================================================================
   Base

   Default settings
========================================================================== */
body {
    /* Styles here */
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 13px;
}

a {
    /* Styles here */
}

    a:hover {
        /* Styles here */
    }

    a:focus {
        /* Styles here */
    }

    a:active,
    a:hover {
        /* Styles here */
    }

/* cyrillic-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: local("Open Sans Light"), local("OpenSans-Light"), url(/fonts/DXI1ORHCpsQm3Vp6mXoaTa-j2U0lmluP9RWlSytm3ho.woff2) format("woff2");
    unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}

/* cyrillic */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: local("Open Sans Light"), local("OpenSans-Light"), url(/fonts/DXI1ORHCpsQm3Vp6mXoaTZX5f-9o1vgP2EXwfjgl7AY.woff2) format("woff2");
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: local("Open Sans Light"), local("OpenSans-Light"), url(/fonts/DXI1ORHCpsQm3Vp6mXoaTRWV49_lSm1NYrwo-zkhivY.woff2) format("woff2");
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: local("Open Sans Light"), local("OpenSans-Light"), url(/fonts/DXI1ORHCpsQm3Vp6mXoaTaaRobkAwv3vxw3jMhVENGA.woff2) format("woff2");
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: local("Open Sans Light"), local("OpenSans-Light"), url(/fonts/DXI1ORHCpsQm3Vp6mXoaTf8zf_FOSsgRmwsS7Aa9k2w.woff2) format("woff2");
    unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: local("Open Sans Light"), local("OpenSans-Light"), url(/fonts/DXI1ORHCpsQm3Vp6mXoaTT0LW-43aMEzIO6XUTLjad8.woff2) format("woff2");
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 300;
    src: local("Open Sans Light"), local("OpenSans-Light"), url(/fonts/DXI1ORHCpsQm3Vp6mXoaTegdm0LZdjqr5-oayXSOefg.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local("Open Sans"), local("OpenSans"), url(/fonts/K88pR3goAWT7BTt32Z01mxJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}

/* cyrillic */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local("Open Sans"), local("OpenSans"), url(/fonts/RjgO7rYTmqiVp7vzi-Q5URJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local("Open Sans"), local("OpenSans"), url(/fonts/LWCjsQkB6EMdfHrEVqA1KRJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local("Open Sans"), local("OpenSans"), url(/fonts/xozscpT2726on7jbcb_pAhJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local("Open Sans"), local("OpenSans"), url(/fonts/59ZRklaO5bWGqF5A9baEERJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local("Open Sans"), local("OpenSans"), url(/fonts/u-WUoqrET9fUeobQW7jkRRJtnKITppOI_IvcXXDNrsc.woff2) format("woff2");
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local("Open Sans"), local("OpenSans"), url(/fonts/cJZKeOuBrn4kERxqtaUH3VtXRa8TVwTICgirnJhmVJw.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url(/fonts/MTP_ySUJH_bn48VBG8sNSq-j2U0lmluP9RWlSytm3ho.woff2) format("woff2");
    unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}

/* cyrillic */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url(/fonts/MTP_ySUJH_bn48VBG8sNSpX5f-9o1vgP2EXwfjgl7AY.woff2) format("woff2");
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url(/fonts/MTP_ySUJH_bn48VBG8sNShWV49_lSm1NYrwo-zkhivY.woff2) format("woff2");
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url(/fonts/MTP_ySUJH_bn48VBG8sNSqaRobkAwv3vxw3jMhVENGA.woff2) format("woff2");
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url(/fonts/MTP_ySUJH_bn48VBG8sNSv8zf_FOSsgRmwsS7Aa9k2w.woff2) format("woff2");
    unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url(/fonts/MTP_ySUJH_bn48VBG8sNSj0LW-43aMEzIO6XUTLjad8.woff2) format("woff2");
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url(/fonts/MTP_ySUJH_bn48VBG8sNSugdm0LZdjqr5-oayXSOefg.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* cyrillic-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local("Open Sans Bold"), local("OpenSans-Bold"), url(/fonts/k3k702ZOKiLJc3WVjuplzK-j2U0lmluP9RWlSytm3ho.woff2) format("woff2");
    unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}

/* cyrillic */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local("Open Sans Bold"), local("OpenSans-Bold"), url(/fonts/k3k702ZOKiLJc3WVjuplzJX5f-9o1vgP2EXwfjgl7AY.woff2) format("woff2");
    unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* greek-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local("Open Sans Bold"), local("OpenSans-Bold"), url(/fonts/k3k702ZOKiLJc3WVjuplzBWV49_lSm1NYrwo-zkhivY.woff2) format("woff2");
    unicode-range: U+1F00-1FFF;
}

/* greek */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local("Open Sans Bold"), local("OpenSans-Bold"), url(/fonts/k3k702ZOKiLJc3WVjuplzKaRobkAwv3vxw3jMhVENGA.woff2) format("woff2");
    unicode-range: U+0370-03FF;
}

/* vietnamese */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local("Open Sans Bold"), local("OpenSans-Bold"), url(/fonts/k3k702ZOKiLJc3WVjuplzP8zf_FOSsgRmwsS7Aa9k2w.woff2) format("woff2");
    unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local("Open Sans Bold"), local("OpenSans-Bold"), url(/fonts/k3k702ZOKiLJc3WVjuplzD0LW-43aMEzIO6XUTLjad8.woff2) format("woff2");
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    src: local("Open Sans Bold"), local("OpenSans-Bold"), url(/fonts/k3k702ZOKiLJc3WVjuplzOgdm0LZdjqr5-oayXSOefg.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* ==========================================================================
   Buttons

   Default Bootstrap and Mendix Buttons
========================================================================== */
.btn,
.mx-button {
    /* Styles here */
}

    .btn.mx-dateinput-select-button,
    .mx-button.mx-dateinput-select-button,
    .mx-button.mx-referencesetselector-select-button {
        font-size: 16px !important;
        /*  padding: 9px 14px 6px;*/
        padding: 6px 14px 6px;
        background: #fff;
        color: #1969c0;
        border: 1px #ddf0f7 solid;
    }

    .btn:hover, .btn:focus, .btn:active,
    .mx-button:hover,
    .mx-button:focus,
    .mx-button:active {
        /* Styles here */
    }

.mx-link {
    /* Styles here */
}

.btn-default {
    /* Styles here */
    background-color: #dfe4ed;
    border-color: #dfe4ed;
    box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
}

    .btn-default:hover, .btn-default:focus {
        box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
        background-color: #dfe4ed;
        border-color: #dfe4ed;
        opacity: 0.75;
    }

.btn-primary {
    /* Styles here */
    box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
    background-color: #01a8fe;
    border-color: #01a8fe;
}

    .btn-primary:hover, .btn-primary:focus {
        box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
        background-color: #01a8fe;
        border-color: #01a8fe;
        opacity: 0.75;
    }

.btn-inverse {
    /* Styles here */
    box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
}

    .btn-inverse:hover, .btn-inverse:focus {
        box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
    }

.btn-success {
    /* Styles here */
    box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
    background-color: #46be8a;
    border-color: #46be8a;
}

    .btn-success:hover, .btn-success:focus {
        box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
        background-color: #46be8a;
        border-color: #46be8a;
        opacity: 0.75;
    }

.btn-info {
    /* Styles here */
    box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
}

    .btn-info:hover, .btn-info:focus {
        box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
    }

.btn-warning {
    /* Styles here */
    box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
    background-color: #f39834;
    border-color: #f39834;
}

    .btn-warning:hover, .btn-warning:focus {
        box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
        background-color: #f39834;
        border-color: #f39834;
        opacity: 0.75;
    }

.btn-danger {
    /* Styles here */
    box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
    background-color: #fb434a;
    border-color: #fb434a;
}

    .btn-danger:hover, .btn-danger:focus {
        box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
        background-color: #fb434a;
        border-color: #fb434a;
        opacity: 0.75;
    }

/* ==========================================================================
   Datagrid Default

   Default Mendix Datagrid Widget. The datagrid shows a list of objects in a grid
========================================================================== */
.mx-datagrid {
    /* Styles here */
}

    .mx-datagrid .mx-grid-controlbar .mx-button {
        margin: 0 .3em 8px 0;
    }

    .mx-datagrid .mx-datagrid-head-table {
        /* Styles here */
    }

        .mx-datagrid .mx-datagrid-head-table .mx-datagrid-head-wrapper {
            /* Styles here */
        }

    .mx-datagrid .mx-datagrid-body-table {
        /* Styles here */
    }

        .mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr {
            /* Styles here */
            background-color: transparent;
        }

            .mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td {
                /* Styles here */
                background-color: transparent;
            }

            .mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr:hover td {
                background-color: #dfe4ed !important;
            }

            .mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr.selected td,
            .mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr.selected:hover td {
                background-color: #cacdde !important; /*#97d3f3*/
                color: #000;
            }

/* ==========================================================================
   Dataview

   Default Mendix Dataview Widget. The data view is used for showing the contents of exactly one object
========================================================================== */
.mx-dataview {
    /* Styles here */
}

    .mx-dataview .mx-dataview-controls {
        /* Styles here */
        border-top: none;
    }

        .mx-dataview .mx-dataview-controls .mx-button {
            min-width: 10rem;
        }

/* ==========================================================================
   Grid

   Default Mendix Grid
========================================================================== */
.mx-grid {
    /* Styles here */
}

    .mx-grid .mx-grid-controlbar {
        /* Styles here */
    }

        .mx-grid .mx-grid-controlbar .mx-grid-pagingbar {
            /* Styles here */
        }

            .mx-grid .mx-grid-controlbar .mx-grid-pagingbar .mx-button {
                /* Styles here */
            }

                .mx-grid .mx-grid-controlbar .mx-grid-pagingbar .mx-button:hover {
                    /* Styles here */
                }

            .mx-grid .mx-grid-controlbar .mx-grid-pagingbar .mx-grid-paging-status {
                /* Styles here */
            }

        .mx-grid .mx-grid-controlbar .mx-grid-searchbar {
            /* Styles here */
        }

            .mx-grid .mx-grid-controlbar .mx-grid-searchbar .mx-grid-search-item {
                /* Styles here */
            }

                .mx-grid .mx-grid-controlbar .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-label {
                    /* Styles here */
                }

            .mx-grid .mx-grid-controlbar .mx-grid-searchbar .mx-grid-search-input {
                /* Styles here */
            }

                .mx-grid .mx-grid-controlbar .mx-grid-searchbar .mx-grid-search-input .form-control {
                    /* Styles here */
                }

                .mx-grid .mx-grid-controlbar .mx-grid-searchbar .mx-grid-search-input .mx-button {
                    /* Styles here */
                }

/* ==========================================================================
   Groupbox

   Default Mendix Groupboxes
========================================================================== */
.mx-groupbox {
    /* Styles here */
    padding-bottom: 6px;
}

    .mx-groupbox > .mx-groupbox-header {
        /*
    border-bottom: solid 2px #135592;
    color: #0069ca;
    font-weight: 400;
    font-size: 20px;
    background: none;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    padding: 5px 0 !important;
    margin-bottom: 20px;
*/
    }

    .mx-groupbox > .mx-groupbox-body {
        /* Styles here */
    }

    .mx-groupbox .mx-groupbox-header + .mx-groupbox-body {
        /* Styles here */
    }

    .mx-groupbox.collapsed > .mx-groupbox-header {
        /* Styles here */
    }

/* ==========================================================================
   Inputs
========================================================================== */
.form-control {
    background-color: #f4fcff;
}

    .form-control:focus {
        /* Styles here */
    }

.form-group .control-label {
    /* Styles here */
    font-size: 13px;
    font-weight: 600;
}

input[type=radio] {
    margin-top: 2px;
}

.form-control[disabled],
fieldset[disabled] .form-control {
    cursor: auto;
    border: 1px solid #ddd;
    background: #eee;
}

.form-group.input-right .form-control {
    text-align: right;
}

/* ==========================================================================
   Listview

   Default Mendix Listview Widget. The list view shows a list of objects arranged vertically. Each object is shown using a template
========================================================================== */
.mx-listview {
    /* Styles here */
}

    .mx-listview .mx-button.mx-listview-clear-button {
        /* Styles here */
    }

    .mx-listview > .mx-button {
        /* Load more button */
    }

    .mx-listview .mx-listview-item {
        /* Styles here */
    }

        .mx-listview .mx-listview-item:hover {
            background-color: #d7ecf3;
        }

        .mx-listview .mx-listview-item.selected {
            /* Styles here */
        }

            .mx-listview .mx-listview-item.selected:hover {
                background-color: #d7ecf3;
            }

        .mx-listview .mx-listview-item:nth-child(2n+1) {
            /* Styles here */
        }

/* ==========================================================================
   Modals

   Default Mendix Modals. Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults
========================================================================== */
.modal-dialog {
    /* Styles here */
}

    .modal-dialog .modal-content {
        /* Styles here */
    }

        .modal-dialog .modal-content .modal-header {
            /* Styles here */
        }

            .modal-dialog .modal-content .modal-header h4 {
                /* Styles here */
            }

            .modal-dialog .modal-content .modal-header .close {
                /* Styles here */
            }

        .modal-dialog .modal-content .modal-body {
            /* Styles here */
        }

        .modal-dialog .modal-content .modal-footer {
            /* Styles here */
        }

            .modal-dialog .modal-content .modal-footer button {
                min-width: 10rem;
            }

/* Default Mendix Window Modal */
/* Default Mendix Login Modal */
.mx-login {
    /* Styles here */
}

    .mx-login .modal-body {
        /* Styles here */
    }

    .mx-login .modal-content {
        /* Styles here */
    }

    .mx-login .modal-header,
    .mx-login .modal-footer {
        /* Styles here */
    }

    .mx-login button {
        /* Styles here */
    }

    .mx-login h4 {
        /* Styles here */
    }

/* ==========================================================================
   Navigation

   Default Mendix Navigation Bar
========================================================================== */
.mx-navbar {
    /* Styles here */
}

    .mx-navbar ul.nav {
        /* Styles here */
    }

        .mx-navbar ul.nav > li.mx-navbar-item > a {
            /* Styles here */
        }

            .mx-navbar ul.nav > li.mx-navbar-item > a:hover, .mx-navbar ul.nav > li.mx-navbar-item > a:focus, .mx-navbar ul.nav > li.mx-navbar-item > a.active {
                /* Styles here */
            }

            .mx-navbar ul.nav > li.mx-navbar-item > a.active {
                /* Styles here */
            }

            .mx-navbar ul.nav > li.mx-navbar-item > a .mx-navbar-submenu:before {
                /* Dropdown Menu */
            }

        .mx-navbar ul.nav > .mx-navbar-item > a:hover,
        .mx-navbar ul.nav > .mx-navbar-item > a:focus,
        .mx-navbar ul.nav > .mx-navbar-item.active a,
        .mx-navbar ul.nav > .mx-navbar-item.open > a,
        .mx-navbar ul.nav > .mx-navbar-item.open > a:hover,
        .mx-navbar ul.nav > .mx-navbar-item.open > a:focus {
            /* When hovering or the dropdown is open */
        }

        .mx-navbar ul.nav > .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem.active a {
            /* Styles here */
        }

/* ==========================================================================
   Navigation

   Default Mendix Navigation Tree
========================================================================== */
.mx-navigationtree {
    background-color: #222A4E;
}

    .mx-navigationtree .navbar-inner ul {
        /* Styles here */
    }

        .mx-navigationtree .navbar-inner ul li {
            position: relative;
        }

            .mx-navigationtree .navbar-inner ul li a {
                background-color: #222A4E;
                border: none;
                color: #D8D6D7;
                font-size: 14px;
                font-weight: 600;
                outline: 0;
                padding: 10px 15px 10px 40px;
            }

                .mx-navigationtree .navbar-inner ul li a:hover,
                .mx-navigationtree .navbar-inner ul li a:focus,
                .mx-navigationtree .navbar-inner ul li a.active {
                    background: inherit;
                }

                .mx-navigationtree .navbar-inner ul li a.active {
                    background-color: #4d5370;
                    color: #5cc6ee;
                    border-left: solid 4px #5cc6ee;
                }

    .mx-navigationtree li.mx-navigationtree-has-items {
    }

    .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-has-items > a {
        background-color: #2d3657;
        border-top: solid 1px #666;
        border-bottom: solid 1px #666;
        color: #ffffff;
    }

    .mx-navigationtree li.mx-navigationtree-has-items > ul li a.active {
        color: #5cc6ee;
        border-left: solid 4px #5cc6ee;
        background-color: #3b4567;
    }

/* ==========================================================================
   Navigation

   Default Mendix Simple Menu Bar
========================================================================== */
.mx-menubar {
    /* Styles here */
}

    .mx-menubar ul.mx-menubar-list {
        /* Styles here */
    }

        .mx-menubar ul.mx-menubar-list li.mx-menubar-item {
            /* Styles here */
        }

            .mx-menubar ul.mx-menubar-list li.mx-menubar-item a {
                /* Styles here */
            }

            .mx-menubar ul.mx-menubar-list li.mx-menubar-item:hover a,
            .mx-menubar ul.mx-menubar-list li.mx-menubar-item:focus a,
            .mx-menubar ul.mx-menubar-list li.mx-menubar-item.active a {
                /* Styles here */
            }

            .mx-menubar ul.mx-menubar-list li.mx-menubar-item.active a {
                /* Styles here */
            }

/* ==========================================================================
   Navigation List

   Default Mendix Navigation List Widget. A navigation list can be used to attach an action to an entire row. Such a row is called a navigation list item
========================================================================== */
.mx-navigationlist {
    /* Styles here */
}

    .mx-navigationlist .mx-navigationlist-item {
        /* Styles here */
    }

        .mx-navigationlist .mx-navigationlist-item:hover {
            /* Styles here */
        }

/* ==========================================================================
   Tab Container

   Default Mendix Tab Container Widget. Tab containers are used to show information categorized into multiple tab pages. 
   This can be very useful if the amount of information that has to be displayed is larger than the amount of space on the screen
========================================================================== */
.mx-tabcontainer {
    /* Styles here */
}

    .mx-tabcontainer .mx-tabcontainer-tabs {
        /* Styles here */
        border-bottom: 2px solid #dfe4ed;
        margin-bottom: 0;
    }

        .mx-tabcontainer .mx-tabcontainer-tabs > li {
            margin-bottom: -2px;
        }

            .mx-tabcontainer .mx-tabcontainer-tabs > li > a {
                /* Styles here */
                padding: 1rem 0;
                margin-right: 1rem;
                border-top: transparent;
                border-left: transparent;
                border-right: transparent;
                border-bottom: 2px solid transparent;
                color: #747577;
                font-weight: 600;
            }

                .mx-tabcontainer .mx-tabcontainer-tabs > li > a:hover, .mx-tabcontainer .mx-tabcontainer-tabs > li > a:focus {
                    /* Styles here */
                    background-color: transparent;
                    border-top: transparent;
                    border-left: transparent;
                    border-right: transparent;
                    border-bottom: 2px solid #DD191D;
                    color: #000;
                    outline: 0;
                }

                .mx-tabcontainer .mx-tabcontainer-tabs > li > a:before {
                    content: "• ";
                    font-size: 20px;
                    vertical-align: middle;
                }

            .mx-tabcontainer .mx-tabcontainer-tabs > li.active > a,
            .mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:hover,
            .mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:focus {
                /* Styles here */
                background-color: transparent;
                border-top: transparent;
                border-left: transparent;
                border-right: transparent;
                border-bottom: 2px solid #DD191D;
                color: #000;
            }

            .mx-tabcontainer .mx-tabcontainer-tabs > li.active a:before {
                color: #DD191D;
            }

    .mx-tabcontainer .mx-tabcontainer-content {
        /* Styles here */
        background: #fff;
        border: solid 1px #dfe4ed;
        border-top: transparent;
        border-radius: 0 0 4px 4px;
        padding: 15px;
    }

.profile-phone .mx-tabcontainer .mx-tabcontainer-content {
    padding: 0px;
}

.mx-grid, .mx-tabcontainer, .mx-listview, .mx-templategrid, .mx-groupbox {
    margin-bottom: auto; /*initial*/
}

/* ==========================================================================
   Tabcontainer

   Default Mendix Tabcontainer for Mobile 
========================================================================== */
.profile-phone .mx-tabcontainer .mx-listview .mx-listview-searchbar {
    padding-top: 0;
}

.profile-phone .mx-tabcontainer .mx-listview .mx-listview-searchbar {
    padding-top: 0;
}

.profile-phone .mx-tabcontainer .mx-tabcontainer-tabs {
    margin: 0;
}

/* ==========================================================================
   Tables

   Default Mendix Table Widget. Tables can be used to lend structure to a page. They contain a number of rows (tr) and columns, the intersection of which is called a cell (td). Each cell can contain widgets
========================================================================== */
table.mx-table {
    /* Styles here */
}

    table.mx-table > tbody > tr {
        /* Styles here */
    }

        table.mx-table > tbody > tr > th {
            /* Styles here */
        }

            table.mx-table > tbody > tr > th > label {
                /* Styles here */
            }

        table.mx-table > tbody > tr > td {
            /* Styles here */
        }

/* ==========================================================================
   Templategrid

   Default Mendix Templategrid Widget. The template grid shows a list of objects in a tile view. For example, a template grid can show a list of products. The template grid has a lot in common with the data grid. The main difference is that the objects are shown in templates (a sort of small data view) instead of rows
========================================================================== */
.mx-templategrid {
    /* Styles here */
}

    .mx-templategrid .mx-templategrid-item {
        border: none;
        vertical-align: top;
        /* Styles here */
    }

        .mx-templategrid .mx-templategrid-item:hover {
            /* Styles here */
        }

        .mx-templategrid .mx-templategrid-item.selected {
            /* Styles here */
        }

            .mx-templategrid .mx-templategrid-item.selected:hover {
                /* Styles here */
            }

/* ==========================================================================
   Typography
========================================================================== */
p {
    /* Styles here */
}

label {
    /* Styles here */
}

.mx-title {
    /* Styles here */
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    /* Styles here */
}

/* ==========================================================================
   Regions

   Used for navigation layouts
========================================================================== */
.region-topbar {
    /* Styles here */
}

    .region-topbar > .mx-layoutcontainer-wrapper {
        /* Styles here */
    }

    .region-topbar .toggle-btn {
        /* Styles here */
    }

    .region-topbar .navbar-right {
        /* SSO widgets */
    }

        .region-topbar .navbar-right .mx-appswitcher-button-placeholder,
        .region-topbar .navbar-right .mx-profilemenu-button-placeholder {
            /* Styles here */
        }

            .region-topbar .navbar-right .mx-appswitcher-button-placeholder iframe,
            .region-topbar .navbar-right .mx-profilemenu-button-placeholder iframe {
                /* Styles here */
            }

        .region-topbar .navbar-right .mx-profilemenu-button-placeholder {
            /* Styles here */
        }

.region-sidebar {
    background-color: #222A4E;
}

.layout-sidebar-responsive .region-sidebar-fixed {
    background-color: #222A4E;
}

.region-sidebar > .mx-layoutcontainer-wrapper {
    /* Styles here */
}

.region-content {
    /* Styles here */
}

    .region-content > .mx-layoutcontainer-wrapper {
        /* Styles here */
    }

/* ==========================================================================
   Navbar Brand

   Used to style your app brand and logo
========================================================================== */
.navbar-brand {
    /* Styles here */
}

    .navbar-brand img {
        /* Styles here */
    }

    .navbar-brand a {
        /* Styles here */
    }

        .navbar-brand a:hover, .navbar-brand a:focus {
            /* Styles here */
        }

/* Mixin { */
/* } Mixin */
/* Flexbox Mixin { */
/* } Flexbox Mixin */
/* Layout { */
/* Topbar { */
.top-menu {
    height: 50px;
    background: #FFF;
    border-bottom: 1px solid #dfe4ed;
    z-index: 100; /*110*/
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    position: relative;
    /*  justify-content: space-between;*/
}

    .top-menu h1 {
        color: #135592;
        font-size: 26px;
        padding: 6px;
        font-weight: 600;
    }

    .top-menu > div {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        position: absolute;
        right: 0;
        bottom: 0;
    }

        .top-menu > div > button {
            padding: 20px 20px 15px 20px;
        }

    .top-menu button, .top-menu .toggle-btn {
        background-color: #FFF;
        border-color: #FFF;
        border-radius: 0;
        color: #827ca1;
        font-size: 15px;
        outline: 0;
        padding: 0 20px;
        box-shadow: none;
    }

        .top-menu button span, .top-menu .toggle-btn span {
            -webkit-transition: all 0.1s ease-in-out;
            -o-transition: all 0.1s ease-in-out;
            transition: all 0.1s ease-in-out;
        }

        .top-menu button:hover, .top-menu button:focus, .top-menu .toggle-btn:hover, .top-menu .toggle-btn:focus {
            background-color: #f2f4f8;
            border-color: #f2f4f8;
            box-shadow: none;
            color: #24222f;
            outline: 0;
        }

            .top-menu button:hover span, .top-menu button:focus span, .top-menu .toggle-btn:hover span, .top-menu .toggle-btn:focus span {
                -ms-transform: rotate(360deg);
                -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
            }

    .top-menu .logout-btn,
    .top-menu > div > button.logout-btn {
        background-color: #FFF;
        border-color: #FFF;
        border-radius: 0;
        color: #827ca1;
        font-size: 15px;
        outline: 0;
        padding: 15px 20px 12px 20px;
        box-shadow: none;
    }

        .top-menu .logout-btn span,
        .top-menu > div > button.logout-btn span {
            -webkit-transition: all 0.1s ease-in-out;
            -o-transition: all 0.1s ease-in-out;
            transition: all 0.1s ease-in-out;
        }

        .top-menu .logout-btn:hover,
        .top-menu > div > button.logout-btn:hover {
            background-color: #fb434a;
            border-color: #fb434a;
            box-shadow: none;
            color: #FFF;
            outline: 0;
        }

            .top-menu .logout-btn:hover span, .top-menu .logout-btn:focus span {
                -ms-transform: scale(1);
                -webkit-transform: scale(1);
                transform: scale(1);
            }

/* } Topbar*/
/* Sidebar { */
.mx-scrollcontainer-toggleable {
    -webkit-box-shadow: 0px 0px 25px rgba(36, 34, 47, 0.3);
    box-shadow: 0px 0px 25px rgba(36, 34, 47, 0.3);
    outline: none;
}

    .mx-scrollcontainer-toggleable .mx-layoutcontainer-wrapper {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        flex-direction: column;
    }

        .mx-scrollcontainer-toggleable .mx-layoutcontainer-wrapper > div:not(:first-child) {
            -webkit-box-flex: 1;
            -moz-box-flex: 1;
            -webkit-flex: 1;
            -ms-flex: 1;
            flex: 1;
        }

    .mx-scrollcontainer-toggleable .logo-container {
        background-color: #fff;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        border-bottom: 1px solid #dfe4ed;
        height: 50px;
        padding-left: 0;
    }

        .mx-scrollcontainer-toggleable .logo-container img {
            display: block;
            height: 80%;
            width: auto;
            margin-left: 20px;
        }

    .mx-scrollcontainer-toggleable .mx-navigationtree, .mx-navigationtree {
        background-color: #222A4E;
        /*
            background-color:   $sidebar-bg;
            .navbar-inner {
                & > ul {
                    & > li {
                        position: relative;
                        & > a {
                            background-color:       $sidebar-bg;
                            border:                 none;
                            color:                  $sidebar-menu-link-color;
                            font-size:              $sidebar-menu-font-size;
                            font-weight:            $sidebar-menu-font-weight;
                            outline:                0;
                            padding:                $sidebar-menu-link-padding;
                            webkit-transition:      all 0.1s ease-in-out;
                            -o-transition:          all 0.1s ease-in-out;
                            transition:             all 0.1s ease-in-out;
                            &::before {
                                webkit-transition:  all 0.1s ease-in-out;
                                -o-transition:      all 0.1s ease-in-out;
                                transition:         all 0.1s ease-in-out;
                            }
                            &::after {
                                -webkit-transition: all 0.1s ease-in-out;
                                -o-transition:      all 0.1s ease-in-out;
                                transition:         all 0.1s ease-in-out;
                                display:            none;
                                content:            '';
                                width:              0px;
                                height:             0px;
                                border-width:       5px 0px 5px 5px;
                                border-color:       transparent transparent transparent #d2d9e5;
                                border-style:       solid;
                                position:           absolute;
                                top:                $sidebar-menu-link-caret-position-y;
                                right:              20px;
                            }
                            &.active ,
                            &:hover {
                                background-color:   $sidebar-menu-link-bgcolor-hover;
                                color:              $sidebar-menu-link-color-hover;
                                &::before {
                                    @include sidebar-menu-frontbar();
                                    background-color: $brand-primary;
                                }
                            }
                            .glyphicon {
                                font-size:      $sidebar-menu-font-size+1;
                                letter-spacing: 10px;
                            }
                            .caret {
                                display:        none;
                            }
                        }
                        &.mx-navigationtree-has-items {
                            & > a {
                                background-color:   $sidebar-menu-link-bgcolor-hover;
                                color:              $sidebar-menu-link-color-hover;
                                font-size:          $sidebar-menu-font-size;
                                &::before {
                                    @include sidebar-menu-frontbar();
                                    background-color: $brand-success;
                                }
                                &::after {
                                    display:        block;
                                    border-color:   transparent transparent transparent $sidebar-menu-link-caret-active-color;
                                    transform:      rotate(90deg);
                                }
                            }
                            & > ul {
                                background-color:   $sidebar-menu-link-bgcolor-hover;
                                li {
                                    a {
                                        background-color:   $sidebar-menu-link-bgcolor-hover;
                                        font-size:          $sidebar-menu-font-size;
                                        padding:            $sidebar-menu-link-padding;
                                        &::before {
                                            @include sidebar-menu-frontbar();
                                            background-color: $brand-success;
                                        }
                                        &.active ,
                                        &:hover {
                                            color:          $sidebar-menu-link-color-hover;
                                            font-weight:    $sidebar-menu-font-weight;
                                        }
                                    }
                                }
                            }
                        }
                        &.mx-navigationtree-collapsed {
                            & > a {
                                background-color:   $sidebar-bg;
                                color:              $sidebar-menu-link-color;
                                outline:            0;
                                padding:            $sidebar-menu-link-padding;
                                &::before {
                                    @extend .sidebar-menu-frontbar;
                                    background-color: transparent;
                                }
                                &::after {
                                    display:        block;
                                    border-color:   transparent transparent transparent $sidebar-menu-link-caret-color;
                                    transform:      rotate(0);
                                }
                                &.active ,
                                &:hover {
                                    background-color:   $sidebar-menu-link-bgcolor-hover;
                                    color:              $sidebar-menu-link-color-hover;
                                    &::before {
                                        @extend .sidebar-menu-frontbar;
                                        background-color: $brand-primary;
                                    }
                                }
                            }
                        }
//                        margin-top: 1px;
                        &:not(:first-child) {
                            margin-top: 1px;
                        }
                    }
                }
            }
            */
    }

        .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li,
        .mx-navigationtree .navbar-inner > ul > li {
            position: relative;
        }

            .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li > a,
            .mx-navigationtree .navbar-inner > ul > li > a {
                background-color: inherit;
                border: none;
                color: #D8D6D7;
                font-size: 14px;
                font-weight: 600;
                outline: 0;
                padding: 10px 15px 10px 40px;
            }

                .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li > a.active,
                .mx-navigationtree .navbar-inner > ul > li > a.active {
                    background-color: #4d5370;
                    color: #5cc6ee;
                    border-left: solid 4px #5cc6ee;
                }


                .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li > a.mx-focus.active,
                .mx-navigationtree .navbar-inner > ul > li > a.mx-focus.active {
                    background-color: #4d5370;
                    color: #5cc6ee;
                    border-left: solid 4px #5cc6ee;
                }

                .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li > a .glyphicon,
                .mx-navigationtree .navbar-inner > ul > li > a .glyphicon {
                    font-size: 15px;
                    position: absolute;
                    left: 15px;
                    top: 13px;
                }

                .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li > a .caret,
                .mx-navigationtree .navbar-inner > ul > li > a .caret {
                    display: none;
                }

            /*
.mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-has-items {
  border-left: solid 4px #5cc6ee;
}
*/
            .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-has-items > a,
            .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-has-items > a {
                background-color: #2d3657;
                border-top: solid 1px #666;
                border-bottom: solid 1px #666;
                color: #ffffff;
            }

                .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-has-items > a::after,
                .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-has-items > a::after {
                    -webkit-transition: all 0.1s ease-in-out;
                    -o-transition: all 0.1s ease-in-out;
                    transition: all 0.1s ease-in-out;
                    content: '';
                    width: 0px;
                    height: 0px;
                    border-width: 5px 0px 5px 5px;
                    border-color: transparent transparent transparent #d2d9e5;
                    border-style: solid;
                    position: absolute;
                    top: 15px;
                    right: 20px;
                    transform: rotate(90deg);
                    color: #ffffff;
                }

            .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-collapsed > a,
            .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-collapsed > a {
                background-color: transparent;
                color: #D8D6D7;
                border-bottom: transparent;
                border-left: transparent;
            }

                .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-collapsed > a::after,
                .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-collapsed > a::after {
                    transform: rotate(0);
                }

            .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li ul,
            .mx-navigationtree .navbar-inner > ul > li ul {
                background-color: transparent;
            }

                .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li ul li a,
                .mx-navigationtree .navbar-inner > ul > li ul li a {
                    background-color: #222A4E;
                    font-size: 14px;
                    padding: 7px 15px 7px 40px;
                    color: #d8d5d5;
                }

                    .mx-navigationtree .navbar-inner > ul > li ul li a:focus,
                    .mx-navigationtree .navbar-inner > ul > li ul li a:hover {
                        background-color: #424863;
                    }

                    .mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li ul li a.active,
                    .mx-navigationtree .navbar-inner > ul > li ul li a.active {
                        background-color: #4d5370;
                        color: #5cc6ee;
                    }

/* } Sidebar */
/* Content { */
.mx-scrollcontainer-center {
    background-color: rgba(239, 239, 239, 0.5);
}

/* } Content */
/* } Layout */
/* Button & Link { */
a, button {
    outline: 0;
}

    a:hover, a:focus, button:hover, button:focus {
        outline: 0;
    }

/* } Button */
/* Text { */
h1, h2, h3, h4 {
    margin: 0 0 15px 0;
    padding: 5px 0;
}

    h1.mx-title {
        background-color: #135592;
        color: #fff;
        font-size: 24px;
        font-weight: 600;
        padding: 15px 30px;
    }

        h1.mx-title:empty {
            display: none;
        }

h2 {
    font-size: 22px;
}

h3 {
    /*    border-bottom: solid 2px #135592;*/
    color: #0069ca;
}

.bd-bottom {
    border-bottom: solid 2px #135592;
}

.bd-primary {
    border-bottom: solid 2px #49a8e4;
}

.bd-success {
    border-bottom: solid 2px #8ec373;
}

.bd-warning {
    border-bottom: solid 2px #ecb351;
}

.bd-danger {
    border-bottom: solid 2px #de8b8b;
}

.wells {
    display: block;
    padding: 1rem;
    background-color: rgba(221, 221, 221, 0.25);
    border: solid 1px #ddd;
    border-radius: 2px;
    margin: 1rem 0;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

/* } Text */
/* Form { */
.form-control {
    display: block;
    width: 100%;
    padding: 7px 5px;
    font-size: 13px;
    line-height: 1.5;
    min-height: 36px;
    color: #55595c;
    background-color: #f4fcff;
    background-image: none;
    border: 1px solid #ddf0f7;
    border-radius: 2px;
}

    .form-control:focus {
        border-color: #01a8fe;
        background-color: #FFF;
        box-shadow: none;
        outline: 0;
    }

/* } Form */
/* Table { */
td {
    outline: 0 !important;
}

/* } Table */
/* Thumbnail { */
.thumbnail {
    animation-name: fadeIn;
    animation-duration: 1s;
    opacity: 1;
}

    .thumbnail.center {
        margin: auto;
    }

    .thumbnail.right {
        float: right;
    }

    .thumbnail.gallery {
        height: 190px;
    }

@media (min-width: 500px) {
    .thumbnail.right {
        float: none;
        margin: auto;
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/* } Thumbnail */
/* File Input { */
.mx-fileinput {
    text-align: center;
}

    .mx-fileinput .mx-wrapped-label {
        display: none;
    }

    .mx-fileinput .mx-wrapped-form button {
        display: block;
        padding: 7px 14px;
        margin: 10px 0;
        box-shadow: 0 2px 4px -2px rgba(55, 58, 60, 0.6);
        color: white;
        min-width: 100px;
        font-weight: 600;
        background-color: #46be8a; /* org #01a8fe */
        border-color: #46be8a;
    }

        .mx-fileinput .mx-wrapped-form button:hover, .mx-fileinput .mx-wrapped-form button:focus {
            display: none;
            background-color: #46be8a;
            border-color: #46be8a;
            opacity: 0.75;
        }

/* } File Input */
.profile-phone .actionblock[class*="fa-"]:before,
.profile-tablet .actionblock[class*="fa-"]:before {
    font: normal normal normal 14px/1 FontAwesome;
    display: block;
    margin: auto auto 20px auto;
    font-size: 72px;
}

.profile-phone .region-topbar,
.profile-tablet .region-topbar {
    min-height: initial !important;
    background-color: #135592;
    border: none;
    box-shadow: 0px 2px 2px #999;
    z-index: 999;
    position: relative;
}

    .profile-phone .region-topbar .mx-link, .profile-phone .region-topbar button,
    .profile-tablet .region-topbar .mx-link,
    .profile-tablet .region-topbar button {
        outline: 0;
        padding: 0 15px;
        min-width: 50px;
    }

    .profile-phone .region-topbar .mx-link {
        padding: 15px 15px;
    }

        .profile-phone .region-topbar .mx-link:hover, .profile-phone .region-topbar .mx-link:focus, .profile-phone .region-topbar .mx-link:active, .profile-phone .region-topbar button:hover, .profile-phone .region-topbar button:focus, .profile-phone .region-topbar button:active,
        .profile-tablet .region-topbar .mx-link:hover,
        .profile-tablet .region-topbar .mx-link:focus,
        .profile-tablet .region-topbar .mx-link:active,
        .profile-tablet .region-topbar button:hover,
        .profile-tablet .region-topbar button:focus,
        .profile-tablet .region-topbar button:active {
            outline: 0;
        }

        .profile-phone .region-topbar .mx-link.text-left, .profile-phone .region-topbar button.text-left,
        .profile-tablet .region-topbar .mx-link.text-left,
        .profile-tablet .region-topbar button.text-left {
            display: flex;
            flex-direction: row-reverse;
        }

            .profile-phone .region-topbar .mx-link.text-left .glyphicon, .profile-phone .region-topbar button.text-left .glyphicon,
            .profile-tablet .region-topbar .mx-link.text-left .glyphicon,
            .profile-tablet .region-topbar button.text-left .glyphicon {
                margin-left: 5px;
                margin-top: 1px;
            }

    .profile-phone .region-topbar table tr,
    .profile-tablet .region-topbar table tr {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
    }

        .profile-phone .region-topbar table tr td,
        .profile-tablet .region-topbar table tr td {
            display: -webkit-box;
            display: -moz-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            align-items: center;
            height: 50px;
            padding: 0;
        }

            .profile-phone .region-topbar table tr td:nth-child(2),
            .profile-tablet .region-topbar table tr td:nth-child(2) {
                flex-grow: 1;
            }

    .profile-phone .region-topbar h1,
    .profile-tablet .region-topbar h1 {
        color: #fff;
        font-size: 18px;
        font-weight: 600;
        line-height: initial;
        padding: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        background: none;
    }

    .profile-phone .region-topbar button,
    .profile-tablet .region-topbar button {
        background: transparent;
        border: none;
        border-radius: 0;
        box-shadow: none;
        color: #fff;
        margin: 0;
        opacity: 1;
        outline: 0;
        -webkit-transition: all 0.1s ease-in-out;
        -o-transition: all 0.1s ease-in-out;
        transition: all 0.1s ease-in-out;
    }

        .profile-phone .region-topbar button:hover, .profile-phone .region-topbar button:focus, .profile-phone .region-topbar button:active,
        .profile-tablet .region-topbar button:hover,
        .profile-tablet .region-topbar button:focus,
        .profile-tablet .region-topbar button:active {
            opacity: 1;
            outline: 0;
            color: #fff;
        }

        .profile-phone .region-topbar button.mx-sidebartoggle,
        .profile-tablet .region-topbar button.mx-sidebartoggle {
            font-size: 18px;
            padding: 16px;
        }

    .profile-phone .region-topbar .mx-placeholder,
    .profile-tablet .region-topbar .mx-placeholder {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        height: auto; /*100%*/
    }

.profile-phone .region-sidebar,
.profile-tablet .region-sidebar {
    background-color: #3D3F41;
    box-shadow: 2px 0 2px #999;
    z-index: 100;
    position: relative;
}

    .profile-phone .region-sidebar .sidebarheader,
    .profile-tablet .region-sidebar .sidebarheader {
        /*  background-image: url(https://image.freepik.com/free-vector/3d-cubes-shapes_1017-95.jpg);*/
        background-color: #fff;
        border-bottom: 1px solid #e0e0e0;
    }

        .profile-phone .region-sidebar .sidebarheader img,
        .profile-tablet .region-sidebar .sidebarheader img {
            margin-top: 15px;
        }

    /*
.profile-phone .region-sidebar .sidebarheader .sidebarheader-title,
.profile-tablet .region-sidebar .sidebarheader .sidebarheader-title {
  color: #000;
  margin-top: 15px;
}
*/

    .profile-phone .region-sidebar .mx-navigationtree,
    .profile-tablet .region-sidebar .mx-navigationtree {
        background-color: transparent;
    }

        .profile-phone .region-sidebar .mx-navigationtree .navbar-inner > ul > li > a.active,
        .profile-tablet .region-sidebar .mx-navigationtree .navbar-inner > ul > li > a.active {
            background-color: #fff;
            color: #000;
        }

.profile-phone .mx-listview .mx-listview-searchbar,
.profile-tablet .mx-listview .mx-listview-searchbar {
    background-color: #dedede;
    padding: 10px 50px 10px 15px;
}

    .profile-phone .mx-listview .mx-listview-searchbar .mx-listview-clear-button,
    .profile-tablet .mx-listview .mx-listview-searchbar .mx-listview-clear-button {
        margin: 0;
        outline: 0;
        right: 0;
        width: 50px;
    }

.modal-body .mx-listview-clear-button {
    top: 0;
}

.profile-phone .mx-listview .mx-listview-searchbar .mx-listview-clear-button .glyphicon-refresh:before,
.profile-tablet .mx-listview .mx-listview-searchbar .mx-listview-clear-button .glyphicon-refresh:before {
    content: "\e003";
    font-size: 14px;
}

.profile-phone .mx-listview .mx-listview-searchbar input,
.profile-tablet .mx-listview .mx-listview-searchbar input {
    font-size: 15px;
}

.profile-phone .mx-listview .mx-listview-empty,
.profile-tablet .mx-listview .mx-listview-empty {
    background-color: transparent;
    border-bottom: none;
    padding: 15px;
    border-radius: 0;
}

.profile-phone .mx-tabcontainer .mx-tabcontainer-tabs > li > a,
.profile-tablet .mx-tabcontainer .mx-tabcontainer-tabs > li > a {
    padding: 15px;
    margin-right: 0;
}

.profile-phone .control-label,
.profile-tablet .control-label {
    margin: 0;
}

.profile-phone img,
.profile-tablet img {
    margin: auto;
}

.profile-phone input[type=radio],
.profile-phone input[type=checkbox],
.profile-tablet input[type=radio],
.profile-tablet input[type=checkbox] {
    margin-top: 3px;
}

.profile-phone .form-group:last-child,
.profile-tablet .form-group:last-child {
    margin-bottom: 5px;
}

.profile-phone .mx-groupbox > .mx-groupbox-header,
.profile-tablet .mx-groupbox > .mx-groupbox-header {
    padding: 15px;
}

.profile-phone .mx-groupbox > .mx-groupbox-body,
.profile-tablet .mx-groupbox > .mx-groupbox-body {
    border: none;
}

.modal-dialog .modal-header {
    padding: 15px 20px;
}

    .modal-dialog .modal-header h4 {
        padding: 0;
    }

    .modal-dialog .modal-header .close {
        margin-top: 0px !important;
    }

.modal-dialog .mx-listview-searchbar input {
    padding: 10px;
}

.modal-dialog .mx-listview-searchbar button {
    height: 100%;
}

.modal-dialog .mx-list {
    margin-top: 15px;
}

    .modal-dialog .mx-list .mx-listview-item {
        padding: 9px 0 5px;
    }

        .modal-dialog .mx-list .mx-listview-item .mx-listview-selection {
            padding: 4px 15px 0 5px;
        }

        .modal-dialog .mx-list .mx-listview-item.selected, .modal-dialog .mx-list .mx-listview-item.selected:hover {
            background-color: #d7ecf3 !important;
        }

    .modal-dialog .mx-list .mx-listview-empty {
        background-color: transparent;
        border-radius: 0;
        padding: 10px;
    }

.modal-dialog .btn-block {
    margin-top: 15px;
    padding: 12px 15px;
}

/* ==========================================================================
   Layout

   Default Mendix Layout
========================================================================== */
.profile-phone .mx-layoutcontainer-wrapper button,
.profile-tablet .mx-layoutcontainer-wrapper button {
    font-size: 13px; /*change back to 13px*/
    /* removed by p Tum
  padding: 4px 12px;
  */
}

/* ==========================================================================
   Listview for phone and tablet
========================================================================== */
.profile-phone,
.profile-tablet {
    /* Listview Load More button */
}

    .profile-phone .mx-listview .mx-listview-searchbar,
    .profile-tablet .mx-listview .mx-listview-searchbar {
        /* Reset Search Button - default hidden */
        /* Search Field */
    }

/* ==========================================================================
   Header

   Default Mendix Header for Mobile 
========================================================================== */
/* ==========================================================================
   Tabcontainer

   Default Mendix Tabcontainer for Mobile 
========================================================================== */
/* ==========================================================================
   Special styles for presenting Page Template Dashboard
========================================================================== */
.page-dashboard {
    /* Styles here */
}

.page-dashboard-default {
    /* Styles here */
}

    .page-dashboard-default .card {
        /* Styles here */
    }

.page-dashboard-mytasks {
    /* Styles here */
}

    .page-dashboard-mytasks .card {
        /* Styles here */
    }

.page-dashboard-actions {
    /* Styles here */
}

.page-dashboard-actions-tasks {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Form
========================================================================== */
.page-form {
    /* Styles here */
}

.page-form-default {
    /* Styles here */
}

.page-form-imagemap {
    /* Styles here */
}

.page-form-tabs {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Login
========================================================================== */
/* ==========================================================================
   Special styles for presenting Page Template Master Detail
========================================================================== */
.page-masterdetail {
    /* Styles here */
}

.page-masterdetail-basic {
    /* Styles here */
}

.page-masterdetail-big {
    /* Styles here */
}

.page-masterdetail-imagemap {
    /* Styles here */
}

.page-masterdetail-multilevel {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Tabs
========================================================================== */
.page-tabs {
    /* Styles here */
}

    .page-tabs .tabsfullwidth {
        /* Styles here */
    }

.page-tabs-default {
    /* Styles here */
}

.page-tabs-fullwidth {
    /* Styles here */
}

    .page-tabs-fullwidth .pageheader.pageheader-fullwidth {
        /* Styles here */
    }

/* ==========================================================================
   Special styles for presenting Page Template Website
========================================================================== */
.page-website {
    /* Styles here */
}

.page-website-actions {
    /* Styles here */
}

.page-website-items {
    /* Styles here */
}

.page-website-items-detail {
    /* Styles here */
}

.page-website-presentation {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Wizard
========================================================================== */
.page-wizard {
    /* Styles here */
}

.page-wizard-default {
    /* Styles here */
}

.page-wizard-titlecentered {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Phone
========================================================================== */
.phone-page-dashboard {
    /* Styles here */
}

.phone-page-dashboard-default {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Phone Form
========================================================================== */
.phone-page-form {
    /* Styles here */
}

.phone-page-form-default {
    /* Styles here */
}

.phone-page-form-edit {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Phone Listview
========================================================================== */
.phone-page-listview {
    /* Styles here */
}

.phone-page-listview-default {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Phone Wizard
========================================================================== */
.phone-page-wizard {
    /* Styles here */
}

.phone-page-wizard-default {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Tablet Dashboard
========================================================================== */
.tablet-page-dashboard {
    /* Styles here */
}

.tablet-page-dashboard-default {
    /* Styles here */
}

.tablet-page-dashboard-big {
    /* Styles here */
}

.tablet-page-dashboard-mytasks {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Tablet Form
========================================================================== */
.tablet-page-form {
    /* Styles here */
}

.tablet-page-form-default {
    /* Styles here */
}

.tablet-page-form-edit {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Tablet Master Detail
========================================================================== */
.tablet-page-masterdetail {
    /* Styles here */
}

.tablet-page-masterdetail-default {
    /* Styles here */
}

.tablet-page-masterdetail-leftright {
    /* Styles here */
}

/* ==========================================================================
   Special styles for presenting Page Template Tablet Wizard
========================================================================== */
.tablet-page-wizard {
    /* Styles here */
}

.tablet-page-wizard-default {
    /* Styles here */
}

/* ==========================================================================
   Card
========================================================================== */
.card {
    /* Styles here */
}

.card-header-action {
    /* Title + button + border below title and button */
}

    .card-header-action .card-title {
        /* Styles here */
    }

    .card-header-action .btn {
        /* Styles here */
    }

.card-details {
    /* Styles here */
}

.card-title {
    /* Styles here */
}

.card-subtitle {
    /* Styles here */
}

.card-annotation {
    /* Styles here */
}

.card-icon {
    /* Styles here */
}

    .card-icon .glyphicon {
        /* Styles here */
    }

.card-image {
    /* Styles here */
}

.card-link {
    /* Styles here */
}

/* ==========================================================================
   Dashboard Card
========================================================================== */
.dashboardcard {
    /* Styles here */
}

.dashboardcard-title {
    /* Styles here */
}

.dashboardcard-subtitle {
    /* Styles here */
}

.dashboardcard-link {
    /* Styles here */
}

/* ==========================================================================
   Dashboard Stats

   Used in dashboard
========================================================================== */
.dashboardstat {
    /* Styles here */
}

    .dashboardstat .dashboardstat-left,
    .dashboardstat .dashboardstat-right {
        /* Styles here */
    }

.dashboardstat-icon {
    /* Styles here */
}

.dashboardstat-title {
    /* Styles here */
}

.dashboardstat-number {
    /* Styles here */
}

/* ==========================================================================
   Form

   To extend the default form
========================================================================== */
.form {
    /* Styles here */
}

.form-footer {
    /* Styles here */
}

/* ==========================================================================
   Form Block

   Used in default forms
========================================================================== */
.formblock {
    /* Styles here */
}

.formblock-header {
    /* Styles here */
}

/* ==========================================================================
   Page Header
========================================================================== */
.pageheader {
    /* Styles here */
}

    .pageheader.section {
        /* Styles here */
    }

.pageheader-title {
    /* Styles here */
}

.pageheader-subtitle {
    /* Styles here */
}

/* ==========================================================================
   Section Header
========================================================================== */
/* ==========================================================================
   Profile Card
========================================================================== */
.profilecard {
    /* Styles here */
}

    .profilecard .profilecard-contentwrapper {
        /* Styles here */
    }

    .profilecard .profilecard-imgwrapper {
        /* Styles here */
    }

    .profilecard .profilecard-actionwrapper {
        /* Styles here */
    }

    .profilecard .profilecard-contentwrapper,
    .profilecard .profilecard-imgwrapper,
    .profilecard .profilecard-actionwrapper {
        /* Styles here */
    }

.profilecard-btn {
    /* Styles here */
}

.profilecard-img {
    /* Styles here */
}

.profilecard-title {
    /* Styles here */
}

.profilecard-subtitle {
    /* Styles here */
}

.pageheader .profilecard {
    /* Styles here */
}

/* ==========================================================================
   Profile Header
========================================================================== */
.profileheader {
    /* Styles here */
}

    .profileheader .profileheader-content {
        /* Styles here */
    }

    .profileheader .profileheader-image {
        /* Styles here */
    }

/* ==========================================================================
   Products

   Used in Website page templates
========================================================================== */
.product-header {
    /* Styles here */
}

.product-content {
    /* Styles here */
}

.product-title {
    /* Styles here */
}

.product-subtitle {
    /* Styles here */
}

.product-btn {
    /* Styles here */
}

.section {
    /* Styles here */
}

.profile-phone .section {
    /* Styles here */
}

.profile-tablet .section {
    /* Styles here */
}

/* ==========================================================================
   Sidebar Header
========================================================================== */
.sidebarheader {
    /* Styles here */
}

.sidebarheader-content {
    /* Styles here */
}

.sidebarheader-img {
    /* Styles here */
}

.sidebarheader-title {
    /* Styles here */
}

.sidebarheader-subtitle {
    /* Styles here */
}

/* ==========================================================================
   Tabs full width
========================================================================== */
.tabsfullwidth {
    /* Styles here */
}

    .tabsfullwidth > .mx-tabcontainer-tabs {
        /* Styles here */
    }

    .tabsfullwidth > .mx-tabcontainer-content {
        /* Styles here */
    }

/* ==========================================================================
   Wizard

   Styling for Wizard (Steps/Numbers)
========================================================================== */
.wizard {
    /* Wizard line between steps */
}

    .wizard:before {
        /* Styles here */
    }

.wizard-step {
    /* Styles here */
}

.wizard-step-number {
    background-color: #ffffff;
    color: #76b99c;
    border-color: #76b99c;
}

.wizard-step-number-active {
    color: #ffffff;
    background-color: #46be8a;
    border-color: #46be8a;
}

.wizard-step-number-visited {
    background-color: #dfe4ed;
    color: #76b99c;
    border-color: #dfe4ed;
}

.wizard-step-title {
    /* Styles here */
}

/* Phone Specific Styling */
.profile-phone .wizard:before {
    /* Styles here */
}

.profile-phone .wizard .wizard-step-number {
    /* Styles here */
}

/* ==========================================================================
   Templategrid Profile Card

   Profile card styled for templategrid
========================================================================== */
.templategrid-profilecard {
    /* Styles here */
}

    .templategrid-profilecard .templategrid-profilecard-contentwrapper {
        /* Styles here */
    }

    .templategrid-profilecard .templategrid-profilecard-imgwrapper {
        /* Styles here */
    }

    .templategrid-profilecard .templategrid-profilecard-contentwrapper,
    .templategrid-profilecard .templategrid-profilecard-imgwrapper {
        /* Styles here */
    }

    .templategrid-profilecard .templategrid-profilecard-btn {
        /* Styles here */
    }

    .templategrid-profilecard .templategrid-profilecard-img {
        /* Styles here */
    }

    .templategrid-profilecard .templategrid-profilecard-title {
        /* Styles here */
    }

    .templategrid-profilecard .templategrid-profilecard-subtitle {
        /* Styles here */
    }

/*
======================================================================
============================ CUSTOM ==================================
======================================================================
*/

.mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li > a,
.mx-navigationtree .navbar-inner > ul > li > a {
    background-color: #222A4E;
    border-top: solid 1px #475079;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    outline: 0;
    padding: 10px 15px 10px 40px;
}

.mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-has-items > a,
.mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-has-items > a {
    /*    background-color: #3b4567;*/
    border-color: #475079;
    border-left-color: inherit;
}

.mx-scrollcontainer-toggleable .mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-collapsed > a,
.mx-navigationtree .navbar-inner > ul > li.mx-navigationtree-collapsed > a {
    background-color: #222A4E;
    border-bottom: transparent;
    color: #ffffff;
}

.profile-phone .region-sidebar .mx-navigationtree,
.profile-tablet .region-sidebar .mx-navigationtree {
    background-color: #222A4E;
}

.profile-phone .region-topbar, .profile-tablet .region-topbar {
    background-color: #135592;
}

.profile-phone .region-sidebar .mx-navigationtree .navbar-inner > ul > li > a.active, .profile-tablet .region-sidebar .mx-navigationtree .navbar-inner > ul > li > a.active {
    background-color: #646983;
    color: #5cc6ee;
    border-left: solid 4px #5cc6ee;
}

.sidebarheader .sidebarheader-content {
    padding: 7px 30px;
    margin: 15px -35px -10px -35px;
    background-color: #f5f5f5;
    border-top: dashed 1px #ccc;
    min-height: 62px;
}

    .sidebarheader .sidebarheader-content .sidebarheader-title.fa:first-letter, .sidebarheader .sidebarheader-content .sidebarheader-subtitle.fa:first-letter {
        color: deepskyblue;
        padding-right: 0.75em;
    }

.sidebarheader-content > div > div > div {
    float: left;
}

.sidebarheader-subtitle.fa {
    vertical-align: text-top;
    color: deepskyblue;
    padding: 2px 0px 2px 0px;
    margin: 0 -10px 0 5px; /* adjust from 20px to 5px by P Tum */
}

.sidebarheader-subtitle label {
    display: inline-block;
    padding: 0;
    color: #666;
}

.mx-referencesetselector-input-wrapper .form-control[readonly] {
    background-color: #f4fcff;
}

.mx-referencesetselector-input-wrapper .form-control[disabled] {
    background-color: #eee;
}

.profile-phone .mx-listview .mx-listview-searchbar .mx-listview-search-input input, .profile-tablet .mx-listview .mx-listview-searchbar .mx-listview-search-input input {
    background-color: #fff;
}

.mx-scrollcontainer-shrink .mx-scrollcontainer-toggleable {
    box-shadow: 2px 0 2px #999;
}

.dropdown-div-converter.btn-group.mx-name-dropdownDivConverter1 > .btn.dropdown-toggle.dropdown-button.btn-default {
    min-height: 48px;
}

.mx-name-dropdownDivConverter1.open > .dropdown-menu {
    min-width: 305px;
}

input[type=checkbox] {
    margin-right: 5px;
}

.dropdown-div-converter.mx-name-dropdownDivConverter1.open .dropdown-toggle.dropdown-button {
    background-color: #f2f4f8;
    border: none;
    box-shadow: none;
}

.file-attachment .mx-fileinput .mx-wrapped-label {
    display: inline-block;
    width: 200px;
}

.file-attachment .mx-fileinput {
    text-align: left;
}

.file-attachment .form-control {
    display: inline-block;
    width: 200px;
}

.file-attachment{
    text-align: left;
}

/* menuhomepage */
.btnmenuHome {
    font-size: 11px !important;
    padding: 5px 0px;
    margin: 5px 0;
    height: 70px;
  }

.btnmenuphone {
    font-size: 11px !important;
    padding: 20px 0px;
    margin: 5px 0;
    height: 150px;
  }
  
  .btnmenuphone img {
        margin-bottom: 0px;
  }
  
  .boxmenuphone {
    text-align: center;
  }
  
  .textmenu {
    color: #707070;
    font-size: 16px;
  }
  
  .boxmenuborder {
    padding: 0 5px;
    background-color: #fff;
    border: 1px solid #eaeaea;
    border-radius: 5px;
    margin-bottom: 5px;
  }
  
  table.mx-table > tbody > tr.tblMenu > td {
    padding: 20px 8px;
  }

  /* phone */
  .btnmenuphone1 {
    font-size: 11px !important;
    padding: 20px 0px;
    margin: 5px 0;
  }
.btnmenuphone1 img {
    margin-bottom: 0px;
    height: 50px;
  }

    .textmenu1 {
    color: #707070;
    font-size: 13px;
  }

    .boxmenuborder1 {
    padding: 0 5px;
    background-color: #fff;
    border: 1px solid #eaeaea;
    border-radius: 5px;
  }

  .textmenu a{
    text-decoration: none;
  }
  
  .textmenu1 a{
    text-decoration: none;
  } .mx-name-tabRed{color:red !important;}

  .btnmenuphone2 {
    font-size: 11px !important;
    padding: 20px 0px;
    margin: 5px 0;
    height: 150px;
  }
  
  .btnmenuphone2 img {
        margin-bottom: 0px;
        width: 150px;
  }
  
  .boxmenuphone2 {
    text-align: center;
  }
  
     /* CKEditor only Print Preview */
.Preview .cke_button__source{
display: none;
}

.Preview .cke_button__save{
display: none;
}

.Preview .cke_button__newpage{
display: none;
}

.Preview .cke_button__print{
display: none;
}

.Preview .cke_button__templates{
display: none;
}

.Preview .cke_toolbar_separator{
display: none;
}

.Preview .cke_contents .cke_reset {
pointer-events: none;
}

.Preview .cke_reset {
height: auto !important;
}

.Preview .cke_button__source {
display: none;
}

.Preview .cke_button__bold{
display: none;    
}

.Preview .cke_button__italic{
display: none;    
}

.Preview .cke_button__underline{
display: none;    
}

.Preview .cke_button__strike{
display: none;    
}

.Preview .cke_button__subscript{
display: none;    
}

.Preview .cke_button__superscript{
display: none;    
}

.Preview .cke_button__removeformat{
display: none;    
}

.Preview .cke_button__image{
display: none;    
}

.Preview .cke_button__oembed{
display: none;    
}

.Preview .cke_button__flash{
display: none;    
}

.Preview .cke_button__table{
display: none;    
}

.Preview .cke_button__horizontalrule{
display: none;    
}

.Preview .cke_button__smiley{
display: none;    
}

.Preview .cke_button__specialchar{
display: none;    
}

.Preview .cke_button__pagebreak{
display: none;    
}

.Preview .cke_button__iframe{
display: none;    
}

.Preview .cke_combo_button{
display: none;  
}

.Preview .cke_button__textcolor{
display: none;  
}

.Preview .cke_button__bgcolor{
display: none;  
}

.Preview .cke_button__numberedlist{
display: none;
}

.Preview .cke_button__bulletedlist{
display: none;    
}

.Preview .cke_button__outdent{
display: none;    
}

.Preview .cke_button__indent{
display: none;    
}

.Preview .cke_button__blockquote{
display: none;    
}

.Preview .cke_button__creatediv{
display: none;    
}

.Preview .cke_button__justifyleft{
display: none;    
}

.Preview .cke_button__justifycenter{
display: none;    
}

.Preview .cke_button__justifyright{
display: none;    
}

.Preview .cke_button__justifyblock{
display: none;   
}

.Preview .cke_button__bidiltr{
display: none;    
}

.Preview .cke_button__bidirtl{
display: none;    
}

.Preview .cke_button__language{
display: none;    
}