@font-face {
    font-family: 'Roboto Condensed';
    src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Light.ttf');
    font-weight: 300;
}

@font-face {
    font-family: 'Roboto Condensed';
    src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf');
    font-weight: Normal;
}

@font-face {
    font-family: 'Roboto Condensed';
    src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Bold.ttf');
    font-weight: Bold;
}


@font-face {
    font-family: 'Averia Libre';
    src: url('../assets/fonts/Averia_Libre/AveriaLibre-Light.ttf');
    font-weight: 300;
}

@font-face {
    font-family: 'Averia Libre';
    src: url('../assets/fonts/Averia_Libre/AveriaLibre-Regular.ttf');
    font-weight: Normal;
}

@font-face {
    font-family: 'Averia Libre';
    src: url('../assets/fonts/Averia_Libre/AveriaLibre-Bold.ttf');
    font-weight: Bold;
}

@font-face {
    font-family: 'Alegreya Sans';
    src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Light.ttf');
    font-weight: 300;
}

@font-face {
    font-family: 'Alegreya Sans';
    src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Regular.ttf');
    font-weight: Normal;
}

@font-face {
    font-family: 'Alegreya Sans';
    src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Bold.ttf');
    font-weight: Bold;
}

.joint-app {
    position: relative;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    top: 63px !important;
}

.appMaps{
    position: absolute;
    top: 65px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}

.appMaps .box{
    display: none !important;
}

.appMaps .joint-free-transform.joint-theme-dark {
    border: none;
}

.appMaps .joint-free-transform.joint-theme-dark .resize {
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: #33334F;
    border: 2px solid #fff
}

.appMaps .joint-tool.joint-theme-dark[data-tool-name="button"] {
    display: none;
}


.appMaps .source-arrowhead.joint-tool.joint-theme-dark {
    display: none !important;
}

.appMaps .target-arrowhead.joint-tool.joint-theme-dark {
    display: none !important;
}

.appMaps .joint-halo.surrounding .handle.ne {
    top: -26px;
    right: -28px;
}

.appMaps .joint-halo.surrounding .handle.n {
    top: -26px;
    right: -28px;
}

.appMaps .joint-halo.surrounding .handle.nw {
    top: -26px;
    right: -28px;
}

.appMaps .list {
    position: inherit;
}


.app-header {
    position: relative;
    width: 100%;
}

.app-body {
    position: relative;
    height: -moz-calc(100% - 60px);
    height: -webkit-calc(100% - 60px);
    height: calc(100% - 60px);
    top: 5px !important;
}

.app-title {
    display: inline-block;
    width: 0px;
    height: 100%;
    padding: 0;
}


.appMaps .joint-stencil.joint-theme-dark, .joint-stencil.joint-theme-dark .joint-paper {
    color: #feffff;
    background: #252525 !important;
}

.appMaps .joint-inspector.joint-theme-dark {
    color: #dddfde;
    background: #252525 !important;
}

.appMaps .joint-select-box-options.joint-theme-dark {
    font-size: 14px !important;
    border: 2px solid #383c3f !important;
    border-radius: 2px !important; 
    background-color: #252525 !important;
}

/*  Paper  */
.paper-container {
    position: absolute;
    top: 0;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
    left: 0px;
    right: 0px;
    display: block;
}

/*  Inspector  */
.inspector-container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 120px; /* navigator height */
    width: 240px !important;
    box-sizing: border-box;
    background-color: #252525;
    z-index: -50;
}
.object-property[data-property$="/fill"],
.object-property[data-property$="/stroke"],
.field[data-field$="/fill"],
.field[data-field$="/stroke"] {
    display: inline-block;
    vertical-align: top;
    width: 50%;
}

.joint-select-box.joint-color-palette .select-box-option:nth-child(2):not(.hover) {
    border: inset;
    border-width: 1px;
}

.joint-inspector-select-box-options {
    width: 190px;
}

/*  Navigator  */
.navigator-container {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 240px;
    height: 120px;
}

/*  Stencil  */
.stencil-container {
    position: absolute;
    left: 0px;
    top: 0;
    width: 240px;
    height: 100%;
}

.search-wrap {
    display: none;
}

.joint-stencil .joint-element[data-type="standard.Image"] text,
.joint-stencil .joint-element[data-type="standard.Cylinder"] text,
.joint-stencil .joint-element[data-type="standard.InscribedImage"] text,
.joint-stencil .joint-element[data-type="devs.Atomic"] .inPorts text,
.joint-stencil .joint-element[data-type="devs.Atomic"] .outPorts text,
.joint-stencil .joint-element[data-type="pn.Transition"] text,
.joint-stencil .joint-element .joint-port text {
    display: none;
}

.joint-stencil .joint-element.joint-type-uml rect,
.joint-stencil .joint-element.joint-type-uml path {
    stroke: #4a4d6e;
}


/*  Toolbar  */
.toolbar-container {
    display: inline-block;
    position: absolute;
    height: 100%;
    left: -10px;
    right: 0;
    box-sizing: border-box;
    top: -10px !important;
}

.toolbar-container .joint-toolbar {
    width: 100%;
    height: 100%;
    background-color: #252525;
}

.toolbar-container label {
    white-space: nowrap;
}

.toolbar-container button:not(:empty) {
    padding: 0 4px;
}

/*.toolbar-container button.joint-widget[data-type="zoomIn"],
.toolbar-container button.joint-widget[data-type="zoomOut"] {
    display: none;
}*/

.joint-dialog.joint-lightbox .fg {
    background-color: #F6F6F6;
}