front_end/css/wanaplan.min.css

#colorPopup .window-content {
    overflow: auto;
    text-align: center;
    border-bottom: #ccc solid 1px
}

.window p {
    margin: 0 0 10px
}

.window a {
    color: #01585F
}

.window a:hover {
    color: #0D8893
}

.window {
    position: absolute;
    border: 1px solid #aaa;
    border-radius: 2px;
    background: #f1f1f1;
    box-shadow: 0 0 10px rgba(0, 0, 0, .3);
    font-family: Arial, sans-serif;
    z-index: 1337
}

.window .window-title {
    border-radius: 2px 2px 0 0;
    background: #383838;
    border-bottom: #000 solid 1px;
    margin: -1px -1px 0;
    height: 35px;
    overflow: hidden
}

.window .window-title h1 {
    margin: 0;
    padding: 8px 0 8px 10px;
    font-size: 12pt;
    color: #fff;
    text-shadow: -1px -1px 0 #000;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 90%;
    width: -moz-calc(100% - 50px);
    width: -webkit-calc(100% - 50px);
    width: calc(100% - 50px);
    cursor: default
}

.window .window-title h1:active,
.window .window-title:active {
    cursor: move
}

.window .window-title h1 img {
    width: 25px;
    height: 25px;
    float: left;
    margin: -3px 5px 0 -5px
}

.window .window-title .window-close {
    float: right;
    margin: 5px 5px 0 0;
    width: 26px;
    height: 26px;
    font-size: 12pt;
    color: #fff;
    text-shadow: -1px -1px 0 #000;
    background: url(../images/close.png) center no-repeat #555;
    border-radius: 2px;
    position: relative;
    cursor: pointer
}

.window .window-title .window-close:hover {
    background-color: #777
}

.window .window-content {
    margin: 0 -1px -1px;
    padding: 10px;
    overflow: hidden;
    height: calc(100% - 20px - 35px)
}

.window .window-content.scrollable {
    overflow: auto
}

.window.window-with-button .window-content {
    height: calc(100% - 20px - 35px - 36px)
}

.window .window-action-bar {
    margin-top: -11px;
    text-align: right;
    padding: 9px
}

.tabbed {
    height: 100%
}

.tabbed .tabbed-tabs {
    background: #fff;
    list-style-type: none;
    margin: 0;
    padding: 1px;
    box-shadow: inset 0 0 8px rgba(0, 0, 0, .2), 1px 1px 0 #fff, inset 1px 1px 0 #bbb, inset -1px -1px 0 #bbb
}

.tabbed .tabbed-tabs li {
    font-size: 10pt;
    padding: 10px 13px;
    color: #222;
    cursor: pointer
}

.tabbed .tabbed-tabs li:hover {
    text-shadow: 0 0 3px rgba(0, 0, 0, .2)
}

.tabbed .tabbed-tabs li.active {
    background: #89B808;
    color: #fff;
    text-shadow: -1px -1px 0 #6E910F;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3), 1px 0 #6E910F, -1px 0 #6E910F, 0 -1px 0 #6E910F, 0 1px 0 #6E910F
}

#edit2Dcontent li label {
    width: 200px;
}

#edit2Dcontent li .field input[type=number] {
    width: 40px;
    min-width: 40px;
    margin-left: 5px;
    margin-right: 5px;
}

.tabbed-tabcontent {
    padding: 5px;
    width: auto;
    height: auto;
}

.tabbed .tabbed-tabcontent {
    margin-top: 9px;
    overflow: auto
}

.tabbed .tabbed-tabcontent section {
    display: none
}

.tabbed .tabbed-tabcontent section.active {
    display: block
}

.tabbed.horizontal .tabbed-tabs {
    text-align: center
}

.tabbed.horizontal .tabbed-tabs li {
    display: inline-block
}

.tabbed.horizontal .tabbed-tabs li.active {
    border-bottom: none;
    border-top: none
}

.tabbed.horizontal .tabbed-tabcontent {
    height: calc(100% - 47px);
    overflow-x: hidden
}

.tabbed.vertical .tabbed-tabs {
    text-align: left;
    width: 170px;
    height: 100%;
    height: calc(100% - 2px);
    overflow: auto
}

.tabbed.vertical .tabbed-tabs li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.tabbed.vertical .tabbed-tabs li.active {
    border: none
}

.tabbed.vertical .tabbed-tabcontent {
    position: absolute;
    top: 36px;
    height: 90%;
    height: calc(100% - 55px);
    width: calc(100% - 197px);
    margin-left: 179px
}

.window.window-with-button .tabbed-tabcontent {
    height: calc(100% - 55px)
}

.tabbed.notab .tabbed-tabs {
    display: none
}

.tabbed.notab .tabbed-tabcontent {
    margin: 0;
    height: 100%
}

.window button::-moz-focus-inner,
.window input[type=submit]::-moz-focus-inner {
    border: 0;
    padding: 0
}

.window .param-item button,
.window .param-item input[type=submit] {
    border: 1px solid #999;
    background: #ddd;
    background: -moz-linear-gradient(top, #ddd 0, #bbb 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ddd), color-stop(100%, #bbb));
    background: -webkit-linear-gradient(top, #ddd 0, #bbb 100%);
    background: -o-linear-gradient(top, #ddd 0, #bbb 100%);
    background: -ms-linear-gradient(top, #ddd 0, #bbb 100%);
    background: linear-gradient(to bottom, #ddd 0, #bbb 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dddddd', endColorstr='#bbbbbb', GradientType=0);
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3), 1px 1px 1px rgba(0, 0, 0, .1);
    border-radius: 2px;
    color: #424242;
    text-shadow: 1px 1px 0 #ddd;
    padding: 4px 7px;
    cursor: pointer;
    font-height: 16px;
    line-height: 1em
}

.window .param-item button:active,
.window .param-item input[type=submit]:active {
    background: #bbb;
    background: -moz-linear-gradient(top, #bbb 0, #ddd 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #bbb), color-stop(100%, #ddd));
    background: -webkit-linear-gradient(top, #bbb 0, #ddd 100%);
    background: -o-linear-gradient(top, #bbb 0, #ddd 100%);
    background: -ms-linear-gradient(top, #bbb 0, #ddd 100%);
    background: linear-gradient(to bottom, #bbb 0, #ddd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bbbbbb', endColorstr='#dddddd', GradientType=0)
}

.window .window-action-bar button,
.window .window-action-bar input[type=submit] {
    border: 1px solid #6E910F;
    background: #89B808;
    background: -moz-linear-gradient(top, #89b808 0, #6e910f 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #89b808), color-stop(100%, #6e910f));
    background: -webkit-linear-gradient(top, #89b808 0, #6e910f 100%);
    background: -o-linear-gradient(top, #89b808 0, #6e910f 100%);
    background: -ms-linear-gradient(top, #89b808 0, #6e910f 100%);
    background: linear-gradient(to bottom, #89b808 0, #6e910f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#89b808', endColorstr='#6e910f', GradientType=0);
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3), 1px 1px 1px rgba(0, 0, 0, .1);
    border-radius: 2px;
    color: #fff;
    text-shadow: -1px -1px 0 #6e910f;
    padding: 6px 10px;
    cursor: pointer;
    font-height: 16px;
    line-height: 1em;
    margin-left: 10px
}

.window .window-action-bar button:active,
.window .window-action-bar input[type=submit]:active {
    background: #6e910f;
    background: -moz-linear-gradient(top, #6e910f 0, #89b808 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6e910f), color-stop(100%, #89b808));
    background: -webkit-linear-gradient(top, #6e910f 0, #89b808 100%);
    background: -o-linear-gradient(top, #6e910f 0, #89b808 100%);
    background: -ms-linear-gradient(top, #6e910f 0, #89b808 100%);
    background: linear-gradient(to bottom, #6e910f 0, #89b808 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6e910f', endColorstr='#89b808', GradientType=0)
}

.window .window-action-bar button.remove {
    float: left;
    margin-left: 0;
    border: 1px solid #999;
    background: #ddd;
    background: -moz-linear-gradient(top, #ddd 0, #bbb 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ddd), color-stop(100%, #bbb));
    background: -webkit-linear-gradient(top, #ddd 0, #bbb 100%);
    background: -o-linear-gradient(top, #ddd 0, #bbb 100%);
    background: -ms-linear-gradient(top, #ddd 0, #bbb 100%);
    background: linear-gradient(to bottom, #ddd 0, #bbb 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dddddd', endColorstr='#bbbbbb', GradientType=0);
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3), 1px 1px 1px rgba(0, 0, 0, .1);
    color: #424242;
    text-shadow: 1px 1px 0 #ddd
}

.window .window-action-bar button.remove:active {
    background: #bbb;
    background: -moz-linear-gradient(top, #bbb 0, #ddd 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #bbb), color-stop(100%, #ddd));
    background: -webkit-linear-gradient(top, #bbb 0, #ddd 100%);
    background: -o-linear-gradient(top, #bbb 0, #ddd 100%);
    background: -ms-linear-gradient(top, #bbb 0, #ddd 100%);
    background: linear-gradient(to bottom, #bbb 0, #ddd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bbbbbb', endColorstr='#dddddd', GradientType=0)
}

.window .lockedParams :disabled {
    background: #aaa !important
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.window input[type=text],
.window input[type=number],
.window input[type=email],
.window input[type=password],
.window input[type=tel],
.window input[type=url] {
    border: 1px solid #bbb;
    margin: 0;
    border-radius: 2px;
    outline: 0;
    box-shadow: inset 0 0 8px rgba(0, 0, 0, .1);
    padding: 2px 5px;
    -webkit-appearance: textfield;
    min-width: 100px;
    line-height: 1.3em;
    font-size: 14px;
    background: #fff
}

.window input[type=number].unit {
    padding-right: 27px
}

.window input[type=text]:focus,
.window input[type=number]:focus,
.window input[type=email]:focus,
.window input[type=password]:focus,
.window input[type=tel]:focus,
.window input[type=url]:focus {
    border-color: #6E910F;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .1), inset 0 0 8px rgba(0, 0, 0, .1)
}

.window input[type=checkbox].cb-switch {
    display: inline-block;
    width: 52px;
    height: 24px;
    opacity: 0;
    cursor: pointer;
    -moz-appearance: none;
    -webkit-appearance: none;
    margin: 2px 0 0;
    z-index: 40;
    position: relative
}

.window input[type=checkbox].cb-switch+span {
    position: relative;
    display: block;
    width: 50px;
    height: 20px;
    margin-top: -26px;
    margin-left: calc(100% - 52px);
    background: url(../images/ui/switch-bg.png) center no-repeat #fff;
    border: 1px solid #aaa;
    border-radius: 3px;
    outline: 0;
    box-shadow: inset 0 0 8px rgba(0, 0, 0, .2);
    -webkit-transition: all .3s;
    transition: all .3s
}

.window input[type=checkbox].cb-switch+span:after {
    content: "";
    position: relative;
    display: block;
    width: 22px;
    height: 16px;
    border: 1px solid #aaa;
    margin-top: 1px;
    margin-left: 1px;
    border-radius: 3px;
    background: url(../images/ui/switch-btn-bg.png) center no-repeat #ddd;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    -webkit-transition: all .2s;
    transition: all .2s
}

.window input[type=checkbox].cb-switch:checked+span {
    background-color: #89B808;
    border-color: #5D7814;
    box-shadow: inset 0 0 8px rgba(0, 0, 0, .2), 0 0 7px rgba(137, 184, 8, .5)
}

.window input[type=checkbox].cb-switch:checked+span:after {
    border-color: #5D7814 #5D7814 #5D7814 #637F17;
    margin-left: 25px
}

.window hr {
    border: none;
    border-top: #bbb solid 1px;
    border-bottom: #fff solid 1px
}

.window .separator {
    border-bottom: #bbb solid 1px;
    box-shadow: 0 1px 0 #fff
}

.window .separator hr {
    margin-top: 0;
    display: none
}

.window .separator label {
    color: #888;
    text-shadow: 1px 1px 0 #fff;
    cursor: default
}

.window .separator label:after {
    content: ""
}

.window label {
    color: #222;
    text-shadow: 1px 1px 0 #fff
}

.window label:after {
    //content:" :"
}

.window label:empty:after {
    content: ""
}

.window .product-item {
    display: inline-block;
    width: 130px;
    margin: 1px 6px 8px 7px;
    box-shadow: -1px 0 0 #aaa, 1px 0 0 #aaa, 0 -1px 0 #aaa, 0 1px 0 #aaa;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .3), -1px 0 0 #aaa, 1px 0 0 #aaa, 0 -1px 0 #aaa, 0 1px 0 #aaa;
    cursor: pointer;
    transition: box-shadow .2s;
    -webkit-transition: box-shadow .2s
}

.window .product-item:hover {
    box-shadow: 0 0 5px rgba(0, 0, 0, .4), -1px 0 0 #555, 1px 0 0 #555, 0 -1px 0 #555, 0 1px 0 #555
}

.window .product-item span {
    display: block;
    margin: 0;
    padding: 0
}

.window .product-item .product-item-image {
    display: inline-block;
    width: 100%;
    height: 95px;
    overflow: hidden;
    background: 0 0;
    text-align: center
}

.window .product-item .product-item-image img {
    max-width: 102%
}

.window .product-item .selected {
    border-radius: 2px;
    opacity: 0;
    position: absolute;
    background: #89B808;
    margin: 4px 0 0 -6px;
    padding: 3px 5px;
    color: #fff;
    text-shadow: -1px -1px 0 #6E910F;
    border: 1px solid #6E910F;
    font-size: 14px;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.window .product-item .selected.show {
    opacity: 1;
    animation: bubble-in .5s;
    -webkit-animation: bubble-in .5s
}

.window .product-item .product-item-purchase {
    display: none
}

.window .product-item .product-item-description {
    margin-top: -5px;
    text-align: center;
    padding: 4px 5px 1px;
    font-size: 11px;
    background: #393939;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    width: calc(100% - 10px);
    color: #fff;
    text-shadow: -1px -1px 0 #000;
    z-index: 100;
    transition: background .1s;
    -webkit-transition: background .1s;
    box-shadow: 0 1px 0 #555, 1px 0 0 #555, -1px 0 0 #555, inset 0 1px 0 rgba(255, 255, 255, 1)
}

.window ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%
}

.window .tabbed-tabcontent ul {
    display: table;
    border-collapse: collapse
}

.window li.param-item,
.window li.separator {
    display: table-row
}

.window li.param-item div {
    display: table-cell;
    vertical-align: middle
}

.window .param-item label,
.window .separator label {
    display: table-cell;
    vertical-align: middle;
    padding: 3px 10px 3px 0;
    white-space: nowrap
}

.window .param-item .field,
.window .separator .field {
    display: table-cell;
    vertical-align: middle;
    text-align: right;
    padding: 5px 0;
    white-space: nowrap;
    max-width: 200px
}

.window .param-item .field input[type=text],
.window .param-item .field input[type=number],
.window .param-item .field input[type=email],
.window .param-item .field input[type=password],
.window .param-item .field input[type=tel],
.window .param-item .field input[type=url],
.window .param-item .field input[type=range] {
    min-width: 100px;
    max-width: 80%;
    max-width: calc(100% - 50px);
    width: 100%
}

.window .param-item .field span.unit {
    display: inline-block;
    width: 25px;
    padding-left: 5px;
    font-size: 10pt;
    overflow: hidden;
    color: #666;
    cursor: default;
    text-align: left;
    margin-left: -30px;
    margin-bottom: -3px;
    pointer-events: none
}

.window .param-item button,
.window .param-item input[type=submit] {
    min-width: 100px;
    margin: -1px 0 0
}

.window .param-item .field input[type=range] {
    width: 90px;
    width: calc(100% - 90px);
    margin: -3px 0 0;
    vertical-align: middle
}

.window .param-item .field input[type=range]+input {
    width: 62px;
    min-width: 62px;
    margin-left: 5px
}

.window .param-item .field input[type=range]+input.unit {
    width: 40px;
    min-width: 40px;
    margin-left: 5px
}

.photonui-window-title-close-button,
.pull-right {
    float: right
}

#main-ui ul,
.fa-ul {
    list-style-type: none
}

.photonui-widget {
    display: inline-block;
    box-sizing: border-box;
    margin: 0;
    font-family: Arial, sans-serif;
    font-size: 11pt;
}

.photonui-container-expand-child-horizontal>.photonui-widget:not(.photonui-widget-fixed-width),
.photonui-container-expand-child>.photonui-widget:not(.photonui-widget-fixed-width) {
    width: 100% !important
}

.photonui-container-expand-child-vertical>.photonui-widget:not(.photonui-widget-fixed-height),
.photonui-container-expand-child>.photonui-widget:not(.photonui-widget-fixed-height) {
    height: 100% !important
}

.photonui-widget button::-moz-focus-inner,
.photonui-widget input[type=submit]::-moz-focus-inner,
button.photonui-widget::-moz-focus-inner,
input[type=submit].photonui-widget::-moz-focus-inner {
    border: 0;
    padding: 0
}

.photonui-popupmenu {
    overflow-y: auto !important
}

.photonui-popupmenu>div>.photonui-menu {
    min-width: 75px
}

.photonui-colorbutton {
    min-height: 30px
}

.photonui-colorbutton span {
    display: inline-block;
    min-width: 50px;
    min-height: 18px
}

.photonui-select {
    min-width: 75px;
    min-height: 30px;
    box-sizing: border-box;
    outline: 0;
    display: flex;
    align-items: center;
    flex-direction: row
}

.photonui-select .photonui-menuitem {
    flex-grow: 1
}

.photonui-select .photonui-menuitem .photonui-menuitem-icon {
    width: auto;
    min-width: 0;
    max-width: 30px;
    margin: 0
}

.photonui-button span+span,
.photonui-menuitem .photonui-menuitem-widget {
    margin-left: 5px
}

.photonui-select .photonui-menuitem .photonui-menuitem-icon>* {
    margin-right: 5px !important
}

.photonui-select.photonui-select-noicon .photonui-menuitem .photonui-menuitem-icon {
    display: none
}

.photonui-basewindow {
    position: absolute;
    user-select: none;
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: -ms-max-content;
    min-width: max-content
}

.photonui-menuitem {
    box-sizing: border-box;
    user-select: none;
    display: flex;
    align-items: center;
    height: 30px;
    padding: 0 5px;
    text-align: left
}

.photonui-menuitem .photonui-menuitem-icon {
    box-sizing: border-box;
    width: 16px;
    min-width: 16px;
    max-width: 16px;
    overflow: hidden;
    margin-right: 5px;
    font-size: 16px
}

.photonui-menuitem .photonui-menuitem-icon>* {
    color: inherit
}

.photonui-menuitem .photonui-menuitem-text {
    flex-grow: 1;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.photonui-popupwindow {
    z-index: 4000;
    box-sizing: border-box
}

.photonui-window-title-text {
    display: block;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none
}

.photonui-window-have-button .photonui-window-title-text {
    width: calc(100% - 40px)
}

.photonui-window-content {
    overflow: hidden
}

.photonui-window-modalbox {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 3000
}

.photonui-window.photonui-window-fullscreen {
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    right: 0 !important
}

.photonui-window.photonui-window-fullscreen .photonui-window-content {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important
}

.photonui-viewport {
    box-sizing: border-box;
    vertical-align: middle
}

.photonui-viewport>* {
    height: auto !important
}

.photonui-boxlayout {
    display: -webkit-flex !important;
    display: flex !important;
    box-sizing: border-box;
    height: 100%
}

.photonui-boxlayout.photonui-layout-orientation-horizontal {
    -webkit-flex-direction: row;
    flex-direction: row
}

.photonui-boxlayout.photonui-layout-orientation-vertical {
    -webkit-flex-direction: column;
    flex-direction: column
}

.photonui-boxlayout>.photonui-boxlayout-item {
    -webit-flex-grow: 1;
    flex-grow: 1;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row
}

.photonui-boxlayout>.photonui-boxlayout-item>* {
    display: block;
    width: 100%
}

.photonui-boxlayout>.photonui-layout-align-stretch {
    -webkit-align-self: stretch;
    align-self: stretch
}

.photonui-boxlayout>.photonui-layout-align-start {
    -webkit-align-self: flex-start;
    align-self: flex-start
}

.photonui-boxlayout>.photonui-layout-align-center {
    -webkit-align-self: center;
    align-self: center
}

.photonui-boxlayout>.photonui-layout-align-end {
    -webkit-align-self: flex-end;
    align-self: flex-end
}

.photonui-fluidlayout {
    overflow: hidden;
    display: flex;
    align-items: stretch
}

.photonui-fluidlayout>.photonui-fluidlayout-innerbox {
    display: flex;
    flex-wrap: wrap;
    height: 100%;
    width: 100%;
    align-content: flex-start
}

.photonui-fluidlayout>.photonui-fluidlayout-innerbox>.photonui-container.photonui-layout-align-stretch {
    align-self: stretch;
    height: 100%
}

.photonui-fluidlayout>.photonui-fluidlayout-innerbox>.photonui-container.photonui-layout-align-stretch>* {
    height: 100% !important
}

.photonui-fluidlayout>.photonui-fluidlayout-innerbox>.photonui-container.photonui-layout-align-start {
    align-self: flex-start
}

.photonui-fluidlayout>.photonui-fluidlayout-innerbox>.photonui-container.photonui-layout-align-center {
    align-self: center
}

.photonui-fluidlayout>.photonui-fluidlayout-innerbox>.photonui-container.photonui-layout-align-end {
    align-self: flex-end
}

.photonui-gridlayout {
    display: inline-block;
    box-sizing: border-box
}

.photonui-gridlayout>table {
    box-sizing: border-box;
    border-collapse: collapse;
    width: 100%;
    height: 100%
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell {
    padding: 0;
    box-sizing: border-box
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell>.photonui-gridlayout-wrapper {
    display: inline-block;
    vertical-align: middle;
    text-align: left
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell>.photonui-gridlayout-wrapper>:not(.photonui-widget-fixed-width) {
    width: 100% !important
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-layout-horizontalalign-stretch>.photonui-gridlayout-wrapper,
.photonui-menu>* {
    width: 100%
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell>.photonui-gridlayout-wrapper>:not(.photonui-widget-fixed-height) {
    height: 100% !important
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-layout-verticalalign-stretch>.photonui-gridlayout-wrapper {
    height: 100%
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-layout-verticalalign-start {
    vertical-align: top
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-layout-verticalalign-center {
    vertical-align: middle
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-layout-verticalalign-end {
    vertical-align: bottom
}

.photonui-canvas>canvas,
.photonui-image img,
.photonui-menu {
    vertical-align: middle
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-layout-horizontalalign-start {
    text-align: left
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-layout-horizontalalign-center {
    text-align: center
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-layout-horizontalalign-end {
    text-align: right
}

.photonui-button,
.photonui-colorpicker {
    text-align: center
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-gridlayout-lastcol {
    padding-right: 0 !important
}

.photonui-gridlayout>table>tbody>tr>td.photonui-gridlayout-cell.photonui-gridlayout-lastrow {
    padding-bottom: 0 !important
}

.photonui-menu {
    box-sizing: border-box
}

.photonui-menu.photonui-menu-noicon .photonui-menuitem .photonui-menuitem-icon {
    display: none
}

.photonui-button {
    user-select: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.photonui-button>span {
    display: inline-block !important
}

.photonui-colorpicker .photonui-colorpicker-preview,
.photonui-colorpicker .photonui-colorpicker-previewouter {
    display: block;
    height: 35px;
    width: 100%;
    box-sizing: border-box
}

.photonui-button>span i {
    margin-bottom: -1px
}

.photonui-colorpicker .photonui-colorpicker-previewouter {
    padding: 0 10px 5px
}

.photonui-field {
    min-height: 30px
}

.photonui-slider {
    display: flex !important;
    flex-direction: row;
    flew-wrap: nowrap;
    align-items: center
}

.photonui-slider .photonui-slider-slider {
    box-sizing: border-box;
    flex-grow: 1
}

.photonui-slider .photonui-slider-slider .photonui-slider-grip {
    position: relative;
    display: block;
    box-sizing: border-box
}

.photonui-slider .photonui-field {
    width: 25%;
    min-width: 50px;
    max-width: 75px
}

.photonui-switch {
    display: inline-block
}

.photonui-switch input {
    display: none
}

.photonui-switch span,
.photonui-switch span:after {
    display: block;
    box-sizing: border-box
}

.photonui-switch span:after {
    content: "";
    width: 50%;
    height: 100%
}

.photonui-field-textarea {
    resize: none;
    min-height: 50px
}

.photonui-togglebutton {
    display: inline-block
}

.photonui-togglebutton input {
    display: none
}

.photonui-canvas,
.photonui-image {
    display: inline-block;
    text-align: center
}

.photonui-togglebutton button {
    width: 100%;
    height: 100%
}

.photonui-progressbar.photonui-progressbar-pulsate.photonui-progressbar-horizontal .photonui-progressbar-text,
.photonui-progressbar.photonui-progressbar-pulsate.photonui-progressbar-vertical .photonui-progressbar-text {
    display: none
}

.photonui-progressbar {
    position: relative;
    box-sizing: border-box;
    min-height: 26px;
    min-width: 26px;
    cursor: default;
    overflow: hidden
}

.photonui-progressbar .photonui-progressbar-bar {
    z-index: 1;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0
}

.photonui-progressbar .photonui-progressbar-text {
    z-index: 2;
    position: absolute;
    box-sizing: border-box;
    white-space: nowrap;
    text-align: center;
    width: 100%;
    height: 26px;
    line-height: 26px;
    top: calc(50% - 13px);
    left: 0
}

.photonui-progressbar.photonui-progressbar-horizontal {
    min-width: 75px
}

.photonui-progressbar.photonui-progressbar-horizontal .photonui-progressbar-bar {
    height: 100%
}

.photonui-progressbar.photonui-progressbar-vertical {
    min-height: 75px
}

.photonui-progressbar.photonui-progressbar-vertical .photonui-progressbar-bar {
    width: 100%
}

@keyframes photonui-progressbar-pulsate-horizontal {
    0% {
        width: 0;
        left: 0
    }

    25% {
        width: 30%;
        left: 0
    }

    75% {
        width: 30%;
        left: 70%
    }

    100% {
        width: 0;
        left: 100%
    }
}

@-webkit-keyframes photonui-progressbar-pulsate-horizontal {
    0% {
        width: 0;
        left: 0
    }

    33% {
        width: 30%;
        left: 0
    }

    75% {
        width: 30%;
        left: 70%
    }

    100% {
        width: 0;
        left: 100%
    }
}

@keyframes photonui-progressbar-pulsate-vertical {
    0% {
        height: 0;
        bottom: 0
    }

    25% {
        height: 30%;
        bottom: 0
    }

    75% {
        height: 30%;
        bottom: 70%
    }

    100% {
        height: 0;
        bottom: 100%
    }
}

@-webkit-keyframes photonui-progressbar-pulsate-vertical {
    0% {
        height: 0;
        bottom: 0
    }

    25% {
        height: 30%;
        bottom: 0
    }

    75% {
        height: 30%;
        bottom: 70%
    }

    100% {
        height: 0;
        bottom: 100%
    }
}

.photonui-progressbar.photonui-progressbar-pulsate.photonui-progressbar-horizontal .photonui-progressbar-bar {
    width: 20%;
    animation: photonui-progressbar-pulsate-horizontal linear 1.5s infinite
}

.fa,
.fa-stack,
.photonui-separator,
.photonui-tablayout {
    display: inline-block
}

.photonui-progressbar.photonui-progressbar-pulsate.photonui-progressbar-vertical .photonui-progressbar-bar {
    height: 20%;
    animation: photonui-progressbar-pulsate-vertical linear 1.5s infinite
}

.photonui-separator {
    padding: 0
}

.photonui-separator hr {
    vertical-align: middle;
    width: 0;
    height: 0;
    margin: 0
}

.photonui-separator.photonui-separator-horizontal {
    width: 100%
}

.photonui-separator.photonui-separator-horizontal hr {
    width: 100%;
    min-width: 20px
}

.photonui-separator.photonui-separator-vertical hr {
    height: 100%;
    min-height: 20px
}

.photonui-spriteicon>span {
    font-size: 1px;
    line-height: inherit;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: text-bottom;
    background: gray
}

/*!
 *  Font Awesome 4.3.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
@font-face {
    font-family: FontAwesome;
    src: url(./assets/fontawesome-webfont.eot?v=4.3.0);
    src: url(./assets/fontawesome-webfont.eot?#iefix&v=4.3.0) format('embedded-opentype'), url(./assets/fontawesome-webfont.woff2?v=4.3.0) format('woff2'), url(./assets/fontawesome-webfont.woff?v=4.3.0) format('woff'), url(./assets/fontawesome-webfont.ttf?v=4.3.0) format('truetype'), url(./assets/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular) format('svg');
    font-weight: 400;
    font-style: normal
}

.fa {
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0)
}

.fa-lg {
    font-size: 1.33333333em;
    line-height: .75em;
    vertical-align: -15%
}

.fa-2x {
    font-size: 2em
}

.fa-3x {
    font-size: 3em
}

.fa-4x {
    font-size: 4em
}

.fa-5x {
    font-size: 5em
}

.fa-fw {
    width: 1.28571429em;
    text-align: center
}

.fa-ul {
    padding-left: 0;
    margin-left: 2.14285714em
}

.fa-ul>li {
    position: relative
}

.fa-li {
    position: absolute;
    left: -2.14285714em;
    width: 2.14285714em;
    top: .14285714em;
    text-align: center
}

.fa-li.fa-lg {
    left: -1.85714286em
}

.fa-border {
    padding: .2em .25em .15em;
    border: .08em solid #eee;
    border-radius: .1em
}

.pull-left {
    float: left
}

.fa.pull-left {
    margin-right: .3em
}

.fa.pull-right {
    margin-left: .3em
}

.photonui-dialog-buttons>*,
.photonui-tabitem-tab span+span {
    margin-left: 5px
}

.fa-spin {
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear
}

.fa-pulse {
    -webkit-animation: fa-spin 1s infinite steps(8);
    animation: fa-spin 1s infinite steps(8)
}

@-webkit-keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

.fa-rotate-90 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg)
}

.fa-rotate-180 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg)
}

.fa-rotate-270 {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg)
}

.fa-flip-horizontal {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
    -webkit-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1)
}

.fa-flip-vertical {
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
    -webkit-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    transform: scale(1, -1)
}

:root .fa-flip-horizontal,
:root .fa-flip-vertical,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-rotate-90 {
    filter: none
}

.fa-stack {
    position: relative;
    width: 2em;
    height: 2em;
    line-height: 2em;
    vertical-align: middle
}

.fa-stack-1x,
.fa-stack-2x {
    position: absolute;
    left: 0;
    width: 100%;
    text-align: center
}

.fa-stack-1x {
    line-height: inherit
}

.fa-stack-2x {
    font-size: 2em
}

.fa-inverse {
    color: #fff
}

.fa-glass:before {
    content: "\f000"
}

.fa-music:before {
    content: "\f001"
}

.fa-search:before {
    content: "\f002"
}

.fa-envelope-o:before {
    content: "\f003"
}

.fa-heart:before {
    content: "\f004"
}

.fa-star:before {
    content: "\f005"
}

.fa-star-o:before {
    content: "\f006"
}

.fa-user:before {
    content: "\f007"
}

.fa-film:before {
    content: "\f008"
}

.fa-th-large:before {
    content: "\f009"
}

.fa-th:before {
    content: "\f00a"
}

.fa-th-list:before {
    content: "\f00b"
}

.fa-check:before {
    content: "\f00c"
}

.fa-close:before,
.fa-remove:before,
.fa-times:before {
    content: "\f00d"
}

.fa-search-plus:before {
    content: "\f00e"
}

.fa-search-minus:before {
    content: "\f010"
}

.fa-power-off:before {
    content: "\f011"
}

.fa-signal:before {
    content: "\f012"
}

.fa-cog:before,
.fa-gear:before {
    content: "\f013"
}

.fa-trash-o:before {
    content: "\f014"
}

.fa-home:before {
    content: "\f015"
}

.fa-file-o:before {
    content: "\f016"
}

.fa-clock-o:before {
    content: "\f017"
}

.fa-road:before {
    content: "\f018"
}

.fa-download:before {
    content: "\f019"
}

.fa-arrow-circle-o-down:before {
    content: "\f01a"
}

.fa-arrow-circle-o-up:before {
    content: "\f01b"
}

.fa-inbox:before {
    content: "\f01c"
}

.fa-play-circle-o:before {
    content: "\f01d"
}

.fa-repeat:before,
.fa-rotate-right:before {
    content: "\f01e"
}

.fa-refresh:before {
    content: "\f021"
}

.fa-list-alt:before {
    content: "\f022"
}

.fa-lock:before {
    content: "\f023"
}

.fa-flag:before {
    content: "\f024"
}

.fa-headphones:before {
    content: "\f025"
}

.fa-volume-off:before {
    content: "\f026"
}

.fa-volume-down:before {
    content: "\f027"
}

.fa-volume-up:before {
    content: "\f028"
}

.fa-qrcode:before {
    content: "\f029"
}

.fa-barcode:before {
    content: "\f02a"
}

.fa-tag:before {
    content: "\f02b"
}

.fa-tags:before {
    content: "\f02c"
}

.fa-book:before {
    content: "\f02d"
}

.fa-bookmark:before {
    content: "\f02e"
}

.fa-print:before {
    content: "\f02f"
}

.fa-camera:before {
    content: "\f030"
}

.fa-font:before {
    content: "\f031"
}

.fa-bold:before {
    content: "\f032"
}

.fa-italic:before {
    content: "\f033"
}

.fa-text-height:before {
    content: "\f034"
}

.fa-text-width:before {
    content: "\f035"
}

.fa-align-left:before {
    content: "\f036"
}

.fa-align-center:before {
    content: "\f037"
}

.fa-align-right:before {
    content: "\f038"
}

.fa-align-justify:before {
    content: "\f039"
}

.fa-list:before {
    content: "\f03a"
}

.fa-dedent:before,
.fa-outdent:before {
    content: "\f03b"
}

.fa-indent:before {
    content: "\f03c"
}

.fa-video-camera:before {
    content: "\f03d"
}

.fa-image:before,
.fa-photo:before,
.fa-picture-o:before {
    content: "\f03e"
}

.fa-pencil:before {
    content: "\f040"
}

.fa-map-marker:before {
    content: "\f041"
}

.fa-adjust:before {
    content: "\f042"
}

.fa-tint:before {
    content: "\f043"
}

.fa-edit:before,
.fa-pencil-square-o:before {
    content: "\f044"
}

.fa-share-square-o:before {
    content: "\f045"
}

.fa-check-square-o:before {
    content: "\f046"
}

.fa-arrows:before {
    content: "\f047"
}

.fa-step-backward:before {
    content: "\f048"
}

.fa-fast-backward:before {
    content: "\f049"
}

.fa-backward:before {
    content: "\f04a"
}

.fa-play:before {
    content: "\f04b"
}

.fa-pause:before {
    content: "\f04c"
}

.fa-stop:before {
    content: "\f04d"
}

.fa-forward:before {
    content: "\f04e"
}

.fa-fast-forward:before {
    content: "\f050"
}

.fa-step-forward:before {
    content: "\f051"
}

.fa-eject:before {
    content: "\f052"
}

.fa-chevron-left:before {
    content: "\f053"
}

.fa-chevron-right:before {
    content: "\f054"
}

.fa-plus-circle:before {
    content: "\f055"
}

.fa-minus-circle:before {
    content: "\f056"
}

.fa-times-circle:before {
    content: "\f057"
}

.fa-check-circle:before {
    content: "\f058"
}

.fa-question-circle:before {
    content: "\f059"
}

.fa-info-circle:before {
    content: "\f05a"
}

.fa-crosshairs:before {
    content: "\f05b"
}

.fa-times-circle-o:before {
    content: "\f05c"
}

.fa-check-circle-o:before {
    content: "\f05d"
}

.fa-ban:before {
    content: "\f05e"
}

.fa-arrow-left:before {
    content: "\f060"
}

.fa-arrow-right:before {
    content: "\f061"
}

.fa-arrow-up:before {
    content: "\f062"
}

.fa-arrow-down:before {
    content: "\f063"
}

.fa-mail-forward:before,
.fa-share:before {
    content: "\f064"
}

.fa-expand:before {
    content: "\f065"
}

.fa-compress:before {
    content: "\f066"
}

.fa-plus:before {
    content: "\f067"
}

.fa-minus:before {
    content: "\f068"
}

.fa-asterisk:before {
    content: "\f069"
}

.fa-exclamation-circle:before {
    content: "\f06a"
}

.fa-gift:before {
    content: "\f06b"
}

.fa-leaf:before {
    content: "\f06c"
}

.fa-fire:before {
    content: "\f06d"
}

.fa-eye:before {
    content: "\f06e"
}

.fa-eye-slash:before {
    content: "\f070"
}

.fa-exclamation-triangle:before,
.fa-warning:before {
    content: "\f071"
}

.fa-plane:before {
    content: "\f072"
}

.fa-calendar:before {
    content: "\f073"
}

.fa-random:before {
    content: "\f074"
}

.fa-comment:before {
    content: "\f075"
}

.fa-magnet:before {
    content: "\f076"
}

.fa-chevron-up:before {
    content: "\f077"
}

.fa-chevron-down:before {
    content: "\f078"
}

.fa-retweet:before {
    content: "\f079"
}

.fa-shopping-cart:before {
    content: "\f07a"
}

.fa-folder:before {
    content: "\f07b"
}

.fa-folder-open:before {
    content: "\f07c"
}

.fa-arrows-v:before {
    content: "\f07d"
}

.fa-arrows-h:before {
    content: "\f07e"
}

.fa-bar-chart-o:before,
.fa-bar-chart:before {
    content: "\f080"
}

.fa-twitter-square:before {
    content: "\f081"
}

.fa-facebook-square:before {
    content: "\f082"
}

.fa-camera-retro:before {
    content: "\f083"
}

.fa-key:before {
    content: "\f084"
}

.fa-cogs:before,
.fa-gears:before {
    content: "\f085"
}

.fa-comments:before {
    content: "\f086"
}

.fa-thumbs-o-up:before {
    content: "\f087"
}

.fa-thumbs-o-down:before {
    content: "\f088"
}

.fa-star-half:before {
    content: "\f089"
}

.fa-heart-o:before {
    content: "\f08a"
}

.fa-sign-out:before {
    content: "\f08b"
}

.fa-linkedin-square:before {
    content: "\f08c"
}

.fa-thumb-tack:before {
    content: "\f08d"
}

.fa-external-link:before {
    content: "\f08e"
}

.fa-sign-in:before {
    content: "\f090"
}

.fa-trophy:before {
    content: "\f091"
}

.fa-github-square:before {
    content: "\f092"
}

.fa-upload:before {
    content: "\f093"
}

.fa-lemon-o:before {
    content: "\f094"
}

.fa-phone:before {
    content: "\f095"
}

.fa-square-o:before {
    content: "\f096"
}

.fa-bookmark-o:before {
    content: "\f097"
}

.fa-phone-square:before {
    content: "\f098"
}

.fa-twitter:before {
    content: "\f099"
}

.fa-facebook-f:before,
.fa-facebook:before {
    content: "\f09a"
}

.fa-github:before {
    content: "\f09b"
}

.fa-unlock:before {
    content: "\f09c"
}

.fa-credit-card:before {
    content: "\f09d"
}

.fa-rss:before {
    content: "\f09e"
}

.fa-hdd-o:before {
    content: "\f0a0"
}

.fa-bullhorn:before {
    content: "\f0a1"
}

.fa-bell:before {
    content: "\f0f3"
}

.fa-certificate:before {
    content: "\f0a3"
}

.fa-hand-o-right:before {
    content: "\f0a4"
}

.fa-hand-o-left:before {
    content: "\f0a5"
}

.fa-hand-o-up:before {
    content: "\f0a6"
}

.fa-hand-o-down:before {
    content: "\f0a7"
}

.fa-arrow-circle-left:before {
    content: "\f0a8"
}

.fa-arrow-circle-right:before {
    content: "\f0a9"
}

.fa-arrow-circle-up:before {
    content: "\f0aa"
}

.fa-arrow-circle-down:before {
    content: "\f0ab"
}

.fa-globe:before {
    content: "\f0ac"
}

.fa-wrench:before {
    content: "\f0ad"
}

.fa-tasks:before {
    content: "\f0ae"
}

.fa-filter:before {
    content: "\f0b0"
}

.fa-briefcase:before {
    content: "\f0b1"
}

.fa-arrows-alt:before {
    content: "\f0b2"
}

.fa-group:before,
.fa-users:before {
    content: "\f0c0"
}

.fa-chain:before,
.fa-link:before {
    content: "\f0c1"
}

.fa-cloud:before {
    content: "\f0c2"
}

.fa-flask:before {
    content: "\f0c3"
}

.fa-cut:before,
.fa-scissors:before {
    content: "\f0c4"
}

.fa-copy:before,
.fa-files-o:before {
    content: "\f0c5"
}

.fa-paperclip:before {
    content: "\f0c6"
}

.fa-floppy-o:before,
.fa-save:before {
    content: "\f0c7"
}

.fa-square:before {
    content: "\f0c8"
}

.fa-bars:before,
.fa-navicon:before,
.fa-reorder:before {
    content: "\f0c9"
}

.fa-list-ul:before {
    content: "\f0ca"
}

.fa-list-ol:before {
    content: "\f0cb"
}

.fa-strikethrough:before {
    content: "\f0cc"
}

.fa-underline:before {
    content: "\f0cd"
}

.fa-table:before {
    content: "\f0ce"
}

.fa-magic:before {
    content: "\f0d0"
}

.fa-truck:before {
    content: "\f0d1"
}

.fa-pinterest:before {
    content: "\f0d2"
}

.fa-pinterest-square:before {
    content: "\f0d3"
}

.fa-google-plus-square:before {
    content: "\f0d4"
}

.fa-google-plus:before {
    content: "\f0d5"
}

.fa-money:before {
    content: "\f0d6"
}

.fa-caret-down:before {
    content: "\f0d7"
}

.fa-caret-up:before {
    content: "\f0d8"
}

.fa-caret-left:before {
    content: "\f0d9"
}

.fa-caret-right:before {
    content: "\f0da"
}

.fa-columns:before {
    content: "\f0db"
}

.fa-sort:before,
.fa-unsorted:before {
    content: "\f0dc"
}

.fa-sort-desc:before,
.fa-sort-down:before {
    content: "\f0dd"
}

.fa-sort-asc:before,
.fa-sort-up:before {
    content: "\f0de"
}

.fa-envelope:before {
    content: "\f0e0"
}

.fa-linkedin:before {
    content: "\f0e1"
}

.fa-rotate-left:before,
.fa-undo:before {
    content: "\f0e2"
}

.fa-gavel:before,
.fa-legal:before {
    content: "\f0e3"
}

.fa-dashboard:before,
.fa-tachometer:before {
    content: "\f0e4"
}

.fa-comment-o:before {
    content: "\f0e5"
}

.fa-comments-o:before {
    content: "\f0e6"
}

.fa-bolt:before,
.fa-flash:before {
    content: "\f0e7"
}

.fa-sitemap:before {
    content: "\f0e8"
}

.fa-umbrella:before {
    content: "\f0e9"
}

.fa-clipboard:before,
.fa-paste:before {
    content: "\f0ea"
}

.fa-lightbulb-o:before {
    content: "\f0eb"
}

.fa-exchange:before {
    content: "\f0ec"
}

.fa-cloud-download:before {
    content: "\f0ed"
}

.fa-cloud-upload:before {
    content: "\f0ee"
}

.fa-user-md:before {
    content: "\f0f0"
}

.fa-stethoscope:before {
    content: "\f0f1"
}

.fa-suitcase:before {
    content: "\f0f2"
}

.fa-bell-o:before {
    content: "\f0a2"
}

.fa-coffee:before {
    content: "\f0f4"
}

.fa-cutlery:before {
    content: "\f0f5"
}

.fa-file-text-o:before {
    content: "\f0f6"
}

.fa-building-o:before {
    content: "\f0f7"
}

.fa-hospital-o:before {
    content: "\f0f8"
}

.fa-ambulance:before {
    content: "\f0f9"
}

.fa-medkit:before {
    content: "\f0fa"
}

.fa-fighter-jet:before {
    content: "\f0fb"
}

.fa-beer:before {
    content: "\f0fc"
}

.fa-h-square:before {
    content: "\f0fd"
}

.fa-plus-square:before {
    content: "\f0fe"
}

.fa-angle-double-left:before {
    content: "\f100"
}

.fa-angle-double-right:before {
    content: "\f101"
}

.fa-angle-double-up:before {
    content: "\f102"
}

.fa-angle-double-down:before {
    content: "\f103"
}

.fa-angle-left:before {
    content: "\f104"
}

.fa-angle-right:before {
    content: "\f105"
}

.fa-angle-up:before {
    content: "\f106"
}

.fa-angle-down:before {
    content: "\f107"
}

.fa-desktop:before {
    content: "\f108"
}

.fa-laptop:before {
    content: "\f109"
}

.fa-tablet:before {
    content: "\f10a"
}

.fa-mobile-phone:before,
.fa-mobile:before {
    content: "\f10b"
}

.fa-circle-o:before {
    content: "\f10c"
}

.fa-quote-left:before {
    content: "\f10d"
}

.fa-quote-right:before {
    content: "\f10e"
}

.fa-spinner:before {
    content: "\f110"
}

.fa-circle:before {
    content: "\f111"
}

.fa-mail-reply:before,
.fa-reply:before {
    content: "\f112"
}

.fa-github-alt:before {
    content: "\f113"
}

.fa-folder-o:before {
    content: "\f114"
}

.fa-folder-open-o:before {
    content: "\f115"
}

.fa-smile-o:before {
    content: "\f118"
}

.fa-frown-o:before {
    content: "\f119"
}

.fa-meh-o:before {
    content: "\f11a"
}

.fa-gamepad:before {
    content: "\f11b"
}

.fa-keyboard-o:before {
    content: "\f11c"
}

.fa-flag-o:before {
    content: "\f11d"
}

.fa-flag-checkered:before {
    content: "\f11e"
}

.fa-terminal:before {
    content: "\f120"
}

.fa-code:before {
    content: "\f121"
}

.fa-mail-reply-all:before,
.fa-reply-all:before {
    content: "\f122"
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
    content: "\f123"
}

.fa-location-arrow:before {
    content: "\f124"
}

.fa-crop:before {
    content: "\f125"
}

.fa-code-fork:before {
    content: "\f126"
}

.fa-chain-broken:before,
.fa-unlink:before {
    content: "\f127"
}

.fa-question:before {
    content: "\f128"
}

.fa-info:before {
    content: "\f129"
}

.fa-exclamation:before {
    content: "\f12a"
}

.fa-superscript:before {
    content: "\f12b"
}

.fa-subscript:before {
    content: "\f12c"
}

.fa-eraser:before {
    content: "\f12d"
}

.fa-puzzle-piece:before {
    content: "\f12e"
}

.fa-microphone:before {
    content: "\f130"
}

.fa-microphone-slash:before {
    content: "\f131"
}

.fa-shield:before {
    content: "\f132"
}

.fa-calendar-o:before {
    content: "\f133"
}

.fa-fire-extinguisher:before {
    content: "\f134"
}

.fa-rocket:before {
    content: "\f135"
}

.fa-maxcdn:before {
    content: "\f136"
}

.fa-chevron-circle-left:before {
    content: "\f137"
}

.fa-chevron-circle-right:before {
    content: "\f138"
}

.fa-chevron-circle-up:before {
    content: "\f139"
}

.fa-chevron-circle-down:before {
    content: "\f13a"
}

.fa-html5:before {
    content: "\f13b"
}

.fa-css3:before {
    content: "\f13c"
}

.fa-anchor:before {
    content: "\f13d"
}

.fa-unlock-alt:before {
    content: "\f13e"
}

.fa-bullseye:before {
    content: "\f140"
}

.fa-ellipsis-h:before {
    content: "\f141"
}

.fa-ellipsis-v:before {
    content: "\f142"
}

.fa-rss-square:before {
    content: "\f143"
}

.fa-play-circle:before {
    content: "\f144"
}

.fa-ticket:before {
    content: "\f145"
}

.fa-minus-square:before {
    content: "\f146"
}

.fa-minus-square-o:before {
    content: "\f147"
}

.fa-level-up:before {
    content: "\f148"
}

.fa-level-down:before {
    content: "\f149"
}

.fa-check-square:before {
    content: "\f14a"
}

.fa-pencil-square:before {
    content: "\f14b"
}

.fa-external-link-square:before {
    content: "\f14c"
}

.fa-share-square:before {
    content: "\f14d"
}

.fa-compass:before {
    content: "\f14e"
}

.fa-caret-square-o-down:before,
.fa-toggle-down:before {
    content: "\f150"
}

.fa-caret-square-o-up:before,
.fa-toggle-up:before {
    content: "\f151"
}

.fa-caret-square-o-right:before,
.fa-toggle-right:before {
    content: "\f152"
}

.fa-eur:before,
.fa-euro:before {
    content: "\f153"
}

.fa-gbp:before {
    content: "\f154"
}

.fa-dollar:before,
.fa-usd:before {
    content: "\f155"
}

.fa-inr:before,
.fa-rupee:before {
    content: "\f156"
}

.fa-cny:before,
.fa-jpy:before,
.fa-rmb:before,
.fa-yen:before {
    content: "\f157"
}

.fa-rouble:before,
.fa-rub:before,
.fa-ruble:before {
    content: "\f158"
}

.fa-krw:before,
.fa-won:before {
    content: "\f159"
}

.fa-bitcoin:before,
.fa-btc:before {
    content: "\f15a"
}

.fa-file:before {
    content: "\f15b"
}

.fa-file-text:before {
    content: "\f15c"
}

.fa-sort-alpha-asc:before {
    content: "\f15d"
}

.fa-sort-alpha-desc:before {
    content: "\f15e"
}

.fa-sort-amount-asc:before {
    content: "\f160"
}

.fa-sort-amount-desc:before {
    content: "\f161"
}

.fa-sort-numeric-asc:before {
    content: "\f162"
}

.fa-sort-numeric-desc:before {
    content: "\f163"
}

.fa-thumbs-up:before {
    content: "\f164"
}

.fa-thumbs-down:before {
    content: "\f165"
}

.fa-youtube-square:before {
    content: "\f166"
}

.fa-youtube:before {
    content: "\f167"
}

.fa-xing:before {
    content: "\f168"
}

.fa-xing-square:before {
    content: "\f169"
}

.fa-youtube-play:before {
    content: "\f16a"
}

.fa-dropbox:before {
    content: "\f16b"
}

.fa-stack-overflow:before {
    content: "\f16c"
}

.fa-instagram:before {
    content: "\f16d"
}

.fa-flickr:before {
    content: "\f16e"
}

.fa-adn:before {
    content: "\f170"
}

.fa-bitbucket:before {
    content: "\f171"
}

.fa-bitbucket-square:before {
    content: "\f172"
}

.fa-tumblr:before {
    content: "\f173"
}

.fa-tumblr-square:before {
    content: "\f174"
}

.fa-long-arrow-down:before {
    content: "\f175"
}

.fa-long-arrow-up:before {
    content: "\f176"
}

.fa-long-arrow-left:before {
    content: "\f177"
}

.fa-long-arrow-right:before {
    content: "\f178"
}

.fa-apple:before {
    content: "\f179"
}

.fa-windows:before {
    content: "\f17a"
}

.fa-android:before {
    content: "\f17b"
}

.fa-linux:before {
    content: "\f17c"
}

.fa-dribbble:before {
    content: "\f17d"
}

.fa-skype:before {
    content: "\f17e"
}

.fa-foursquare:before {
    content: "\f180"
}

.fa-trello:before {
    content: "\f181"
}

.fa-female:before {
    content: "\f182"
}

.fa-male:before {
    content: "\f183"
}

.fa-gittip:before,
.fa-gratipay:before {
    content: "\f184"
}

.fa-sun-o:before {
    content: "\f185"
}

.fa-moon-o:before {
    content: "\f186"
}

.fa-archive:before {
    content: "\f187"
}

.fa-bug:before {
    content: "\f188"
}

.fa-vk:before {
    content: "\f189"
}

.fa-weibo:before {
    content: "\f18a"
}

.fa-renren:before {
    content: "\f18b"
}

.fa-pagelines:before {
    content: "\f18c"
}

.fa-stack-exchange:before {
    content: "\f18d"
}

.fa-arrow-circle-o-right:before {
    content: "\f18e"
}

.fa-arrow-circle-o-left:before {
    content: "\f190"
}

.fa-caret-square-o-left:before,
.fa-toggle-left:before {
    content: "\f191"
}

.fa-dot-circle-o:before {
    content: "\f192"
}

.fa-wheelchair:before {
    content: "\f193"
}

.fa-vimeo-square:before {
    content: "\f194"
}

.fa-try:before,
.fa-turkish-lira:before {
    content: "\f195"
}

.fa-plus-square-o:before {
    content: "\f196"
}

.fa-space-shuttle:before {
    content: "\f197"
}

.fa-slack:before {
    content: "\f198"
}

.fa-envelope-square:before {
    content: "\f199"
}

.fa-wordpress:before {
    content: "\f19a"
}

.fa-openid:before {
    content: "\f19b"
}

.fa-bank:before,
.fa-institution:before,
.fa-university:before {
    content: "\f19c"
}

.fa-graduation-cap:before,
.fa-mortar-board:before {
    content: "\f19d"
}

.fa-yahoo:before {
    content: "\f19e"
}

.fa-google:before {
    content: "\f1a0"
}

.fa-reddit:before {
    content: "\f1a1"
}

.fa-reddit-square:before {
    content: "\f1a2"
}

.fa-stumbleupon-circle:before {
    content: "\f1a3"
}

.fa-stumbleupon:before {
    content: "\f1a4"
}

.fa-delicious:before {
    content: "\f1a5"
}

.fa-digg:before {
    content: "\f1a6"
}

.fa-pied-piper:before {
    content: "\f1a7"
}

.fa-pied-piper-alt:before {
    content: "\f1a8"
}

.fa-drupal:before {
    content: "\f1a9"
}

.fa-joomla:before {
    content: "\f1aa"
}

.fa-language:before {
    content: "\f1ab"
}

.fa-fax:before {
    content: "\f1ac"
}

.fa-building:before {
    content: "\f1ad"
}

.fa-child:before {
    content: "\f1ae"
}

.fa-paw:before {
    content: "\f1b0"
}

.fa-spoon:before {
    content: "\f1b1"
}

.fa-cube:before {
    content: "\f1b2"
}

.fa-cubes:before {
    content: "\f1b3"
}

.fa-behance:before {
    content: "\f1b4"
}

.fa-behance-square:before {
    content: "\f1b5"
}

.fa-steam:before {
    content: "\f1b6"
}

.fa-steam-square:before {
    content: "\f1b7"
}

.fa-recycle:before {
    content: "\f1b8"
}

.fa-automobile:before,
.fa-car:before {
    content: "\f1b9"
}

.fa-cab:before,
.fa-taxi:before {
    content: "\f1ba"
}

.fa-tree:before {
    content: "\f1bb"
}

.fa-spotify:before {
    content: "\f1bc"
}

.fa-deviantart:before {
    content: "\f1bd"
}

.fa-soundcloud:before {
    content: "\f1be"
}

.fa-database:before {
    content: "\f1c0"
}

.fa-file-pdf-o:before {
    content: "\f1c1"
}

.fa-file-word-o:before {
    content: "\f1c2"
}

.fa-file-excel-o:before {
    content: "\f1c3"
}

.fa-file-powerpoint-o:before {
    content: "\f1c4"
}

.fa-file-image-o:before,
.fa-file-photo-o:before,
.fa-file-picture-o:before {
    content: "\f1c5"
}

.fa-file-archive-o:before,
.fa-file-zip-o:before {
    content: "\f1c6"
}

.fa-file-audio-o:before,
.fa-file-sound-o:before {
    content: "\f1c7"
}

.fa-file-movie-o:before,
.fa-file-video-o:before {
    content: "\f1c8"
}

.fa-file-code-o:before {
    content: "\f1c9"
}

.fa-vine:before {
    content: "\f1ca"
}

.fa-codepen:before {
    content: "\f1cb"
}

.fa-jsfiddle:before {
    content: "\f1cc"
}

.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-ring:before,
.fa-life-saver:before,
.fa-support:before {
    content: "\f1cd"
}

.fa-circle-o-notch:before {
    content: "\f1ce"
}

.fa-ra:before,
.fa-rebel:before {
    content: "\f1d0"
}

.fa-empire:before,
.fa-ge:before {
    content: "\f1d1"
}

.fa-git-square:before {
    content: "\f1d2"
}

.fa-git:before {
    content: "\f1d3"
}

.fa-hacker-news:before {
    content: "\f1d4"
}

.fa-tencent-weibo:before {
    content: "\f1d5"
}

.fa-qq:before {
    content: "\f1d6"
}

.fa-wechat:before,
.fa-weixin:before {
    content: "\f1d7"
}

.fa-paper-plane:before,
.fa-send:before {
    content: "\f1d8"
}

.fa-paper-plane-o:before,
.fa-send-o:before {
    content: "\f1d9"
}

.fa-history:before {
    content: "\f1da"
}

.fa-circle-thin:before,
.fa-genderless:before {
    content: "\f1db"
}

.fa-header:before {
    content: "\f1dc"
}

.fa-paragraph:before {
    content: "\f1dd"
}

.fa-sliders:before {
    content: "\f1de"
}

.fa-share-alt:before {
    content: "\f1e0"
}

.fa-share-alt-square:before {
    content: "\f1e1"
}

.fa-bomb:before {
    content: "\f1e2"
}

.fa-futbol-o:before,
.fa-soccer-ball-o:before {
    content: "\f1e3"
}

.fa-tty:before {
    content: "\f1e4"
}

.fa-binoculars:before {
    content: "\f1e5"
}

.fa-plug:before {
    content: "\f1e6"
}

.fa-slideshare:before {
    content: "\f1e7"
}

.fa-twitch:before {
    content: "\f1e8"
}

.fa-yelp:before {
    content: "\f1e9"
}

.fa-newspaper-o:before {
    content: "\f1ea"
}

.fa-wifi:before {
    content: "\f1eb"
}

.fa-calculator:before {
    content: "\f1ec"
}

.fa-paypal:before {
    content: "\f1ed"
}

.fa-google-wallet:before {
    content: "\f1ee"
}

.fa-cc-visa:before {
    content: "\f1f0"
}

.fa-cc-mastercard:before {
    content: "\f1f1"
}

.fa-cc-discover:before {
    content: "\f1f2"
}

.fa-cc-amex:before {
    content: "\f1f3"
}

.fa-cc-paypal:before {
    content: "\f1f4"
}

.fa-cc-stripe:before {
    content: "\f1f5"
}

.fa-bell-slash:before {
    content: "\f1f6"
}

.fa-bell-slash-o:before {
    content: "\f1f7"
}

.fa-trash:before {
    content: "\f1f8"
}

.fa-copyright:before {
    content: "\f1f9"
}

.fa-at:before {
    content: "\f1fa"
}

.fa-eyedropper:before {
    content: "\f1fb"
}

.fa-paint-brush:before {
    content: "\f1fc"
}

.fa-birthday-cake:before {
    content: "\f1fd"
}

.fa-area-chart:before {
    content: "\f1fe"
}

.fa-pie-chart:before {
    content: "\f200"
}

.fa-line-chart:before {
    content: "\f201"
}

.fa-lastfm:before {
    content: "\f202"
}

.fa-lastfm-square:before {
    content: "\f203"
}

.fa-toggle-off:before {
    content: "\f204"
}

.fa-toggle-on:before {
    content: "\f205"
}

.fa-bicycle:before {
    content: "\f206"
}

.fa-bus:before {
    content: "\f207"
}

.fa-ioxhost:before {
    content: "\f208"
}

.fa-angellist:before {
    content: "\f209"
}

.fa-cc:before {
    content: "\f20a"
}

.fa-ils:before,
.fa-shekel:before,
.fa-sheqel:before {
    content: "\f20b"
}

.fa-meanpath:before {
    content: "\f20c"
}

.fa-buysellads:before {
    content: "\f20d"
}

.fa-connectdevelop:before {
    content: "\f20e"
}

.fa-dashcube:before {
    content: "\f210"
}

.fa-forumbee:before {
    content: "\f211"
}

.fa-leanpub:before {
    content: "\f212"
}

.fa-sellsy:before {
    content: "\f213"
}

.fa-shirtsinbulk:before {
    content: "\f214"
}

.fa-simplybuilt:before {
    content: "\f215"
}

.fa-skyatlas:before {
    content: "\f216"
}

.fa-cart-plus:before {
    content: "\f217"
}

.fa-cart-arrow-down:before {
    content: "\f218"
}

.fa-diamond:before {
    content: "\f219"
}

.fa-ship:before {
    content: "\f21a"
}

.fa-user-secret:before {
    content: "\f21b"
}

.fa-motorcycle:before {
    content: "\f21c"
}

.fa-street-view:before {
    content: "\f21d"
}

.fa-heartbeat:before {
    content: "\f21e"
}

.fa-venus:before {
    content: "\f221"
}

.fa-mars:before {
    content: "\f222"
}

.fa-mercury:before {
    content: "\f223"
}

.fa-transgender:before {
    content: "\f224"
}

.fa-transgender-alt:before {
    content: "\f225"
}

.fa-venus-double:before {
    content: "\f226"
}

.fa-mars-double:before {
    content: "\f227"
}

.fa-venus-mars:before {
    content: "\f228"
}

.fa-mars-stroke:before {
    content: "\f229"
}

.fa-mars-stroke-v:before {
    content: "\f22a"
}

.fa-mars-stroke-h:before {
    content: "\f22b"
}

.fa-neuter:before {
    content: "\f22c"
}

.fa-facebook-official:before {
    content: "\f230"
}

.fa-pinterest-p:before {
    content: "\f231"
}

.fa-whatsapp:before {
    content: "\f232"
}

.fa-server:before {
    content: "\f233"
}

.fa-user-plus:before {
    content: "\f234"
}

.fa-user-times:before {
    content: "\f235"
}

.fa-bed:before,
.fa-hotel:before {
    content: "\f236"
}

.fa-viacoin:before {
    content: "\f237"
}

.fa-train:before {
    content: "\f238"
}

.fa-subway:before {
    content: "\f239"
}

.fa-medium:before {
    content: "\f23a"
}

.photonui-tablayout {
    height: 100%;
    box-sizing: border-box
}

.photonui-tablayout .photonui-tablayout-innerbox {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    height: 100%
}

.photonui-tablayout .photonui-tablayout-innerbox .photonui-tablayout-tabs {
    display: flex;
    box-sizing: border-box
}

.photonui-tablayout .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab {
    box-sizing: border-box;
    min-width: 10px;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -wibkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.photonui-tablayout .photonui-tablayout-innerbox .photonui-tablayout-content {
    box-sizing: border-box;
    min-height: 20px;
    min-width: 20px;
    flex-grow: 1
}

.photonui-tablayout .photonui-tablayout-innerbox .photonui-tablayout-content>* {
    height: 100%;
    width: 100%
}

.photonui-tablayout.photonui-tablayout-tabposition-top .photonui-tablayout-innerbox {
    flex-direction: column
}

.photonui-tablayout.photonui-tablayout-tabposition-top .photonui-tablayout-innerbox .photonui-tablayout-tabs {
    flex-direction: row
}

.photonui-tablayout.photonui-tablayout-tabposition-bottom .photonui-tablayout-innerbox {
    flex-direction: column-reverse
}

.photonui-tablayout.photonui-tablayout-tabposition-bottom .photonui-tablayout-innerbox .photonui-tablayout-tabs,
.photonui-tablayout.photonui-tablayout-tabposition-left .photonui-tablayout-innerbox {
    flex-direction: row
}

.photonui-tablayout.photonui-tablayout-tabposition-left .photonui-tablayout-innerbox .photonui-tablayout-tabs {
    flex-direction: column
}

.photonui-tablayout.photonui-tablayout-tabposition-right .photonui-tablayout-innerbox {
    flex-direction: row-reverse
}

.photonui-tablayout.photonui-tablayout-tabposition-right .photonui-tablayout-innerbox .photonui-tablayout-tabs {
    flex-direction: column
}

.photonui-widget {
    color: #333
}

.photonui-widget::selection {
    background: #89b808;
    color: #fff
}

.photonui-widget::-moz-selection {
    background: #89b808;
    color: #fff
}

.photonui-widget::-o-selection {
    background: #89b808;
    color: #fff
}

.photonui-widget::-ms-selection {
    background: #89b808;
    color: #fff
}

.photonui-widget::-webkit-selection {
    background: #89b808;
    color: #fff
}

.photonui-menu.photonui-menu-style-popupmenu .photonui-menuitem {
    cursor: pointer
}

.photonui-dialog-buttons {
    white-space: nowrap;
    padding: 6px 5px 5px;
    text-align: right;
    box-sizing: border-box;
    box-shadow: inset 0 7px 3px -7px rgba(0, 0, 0, .4);
    background: #e4e4e4
}

.photonui-dialog-buttons>:first-child {
    margin-left: 0
}

.photonui-window.photonui-dialog.photonui-window-fullscreen .photonui-window-content {
    height: calc(5%) !important;
    min-height: calc(5%) !important;
    max-height: calc(5%) !important
}

.photonui-window.photonui-dialog.photonui-window-fullscreen .photonui-dialog-buttons {
    height: 55px
}

.photonui-window {
    min-width: 100px;
    background: #f1f1f1;
    border-radius: 2px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .3)
}

.photonui-window .photonui-window-title {
    height: 40px;
    border-radius: 2px 2px 0 0;
    background: #555;
    transition: all 150ms;
    text-shadow: -1px -1px 0 #2f2f2f
}

.photonui-window .photonui-window-title-text {
    margin-top: 2px;
    padding: 8px 10px;
    font-size: 120%;
    font-weight: 700;
    color: #fff
}

.photonui-window .photonui-window-title-close-button {
    display: block;
    margin: 6px 6px 0 0;
    padding: 0;
    height: 26px;
    width: 22px;
    border: none;
    border-radius: 3px;
    outline: 0;
    background: 0 0;
    color: rgba(255, 255, 255, .3);
    cursor: pointer;
    font-size: 26px
}

.photonui-window .photonui-window-title-close-button:before {
    transition: color 150ms
}

.photonui-window .photonui-window-title-close-button:hover:before {
    color: rgba(255, 255, 255, .7)
}

.photonui-window.photonui-active .photonui-window-title {
    background: #333;
    text-shadow: -1px -1px 0 #2f2f2f
}

.photonui-window.photonui-active .photonui-window-title-text {
    color: #fff
}

.photonui-window.photonui-active .photonui-window-title-close-button:before {
    color: rgba(255, 255, 255, .3)
}

.photonui-window.photonui-active .photonui-window-title-close-button:hover:before {
    color: rgba(255, 255, 255, .7)
}

.photonui-window.photonui-window-have-button .photonui-window-title-text {
    padding: 8px 0 8px 10px;
    width: calc(58%)
}

.photonui-window.photonui-window-fullscreen .photonui-window-content {
    height: calc(60%) !important;
    min-height: calc(60%) !important;
    max-height: calc(60%) !important
}

.photonui-popupwindow {
    border: none;
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 0 5px rgba(0, 0, 0, .3)
}

.photonui-menu>.photonui-menu {
    margin-left: 26px;
    width: calc(74%)
}

.photonui-menu .photonui-menuitem {
    color: #333;
    cursor: default;
    transition: all 150ms
}

.photonui-menu .photonui-menuitem.photonui-menuitem-active,
.photonui-menu .photonui-menuitem:hover {
    background: #89b808;
    color: #fff
}

.photonui-menu .photonui-submenuitem .photonui-menuitem-widget:before {
    box-sizing: border-box;
    content: "";
    display: inline-block;
    border: 6px solid transparent;
    border-top-color: #333;
    -webkit-transform: rotate(-90deg) translate(0, 4px);
    transform: rotate(-90deg) translate(0, 4px);
    transition: -webkit-transform 150ms;
    transition: transform 150ms
}

.photonui-menu .photonui-submenuitem.photonui-menuitem-active {
    background: #bbb;
    color: #fff
}

.photonui-menu .photonui-submenuitem.photonui-menuitem-active .photonui-menuitem-widget:before {
    -webkit-transform: rotate(0) translate(0, 4px);
    transform: rotate(0) translate(0, 4px)
}

.photonui-menu .photonui-submenuitem.photonui-menuitem-active .photonui-menuitem-widget:before,
.photonui-menu .photonui-submenuitem:hover .photonui-menuitem-widget:before {
    border-top-color: #fff
}

.photonui-menu .photonui-submenuitem:hover {
    background: #89b808
}

.photonui-particle-button-default {
    color: #333;
    border-color: #a5a5a5;
    background: linear-gradient(to bottom, #f7f7f7 0, #c4c4c4 100%)
}

.photonui-particle-button-default .photonui-faicon {
    color: #333
}

.photonui-particle-button-alternative-colors.photonui-button-color-blue {
    background: linear-gradient(to bottom, #089ab8 0, #077d96 100%);
    border-color: #055d6f;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #05697d
}

.photonui-particle-button-alternative-colors.photonui-button-color-blue:active:focus,
.photonui-particle-button-alternative-colors.photonui-button-color-blue:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-particle-button-alternative-colors.photonui-button-color-blue .photonui-faicon {
    color: #fff
}

.photonui-particle-button-alternative-colors.photonui-button-color-blue:active {
    background: linear-gradient(to top, #089ab8 0, #077d96 100%)
}

.photonui-particle-button-alternative-colors.photonui-button-color-red {
    background: linear-gradient(to bottom, #de313f 0, #cb202e 100%);
    border-color: #a81b26;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #b51d29
}

.photonui-particle-button-alternative-colors.photonui-button-color-red:active:focus,
.photonui-particle-button-alternative-colors.photonui-button-color-red:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-particle-button-alternative-colors.photonui-button-color-red .photonui-faicon {
    color: #fff
}

.photonui-particle-button-alternative-colors.photonui-button-color-red:active {
    background: linear-gradient(to top, #de313f 0, #cb202e 100%)
}

.photonui-particle-button-alternative-colors.photonui-button-color-yellow {
    background: linear-gradient(to bottom, #f3c518 0, #dcb00b 100%);
    border-color: #b59109;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #c49d0a
}

.photonui-particle-button-alternative-colors.photonui-button-color-yellow:active:focus,
.photonui-particle-button-alternative-colors.photonui-button-color-yellow:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-particle-button-alternative-colors.photonui-button-color-yellow .photonui-faicon {
    color: #fff
}

.photonui-particle-button-alternative-colors.photonui-button-color-yellow:active {
    background: linear-gradient(to top, #f3c518 0, #dcb00b 100%)
}

.photonui-particle-button-alternative-colors.photonui-button-color-green {
    background: linear-gradient(to bottom, #89b808 0, #709607 100%);
    border-color: #526f05;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #5d7d05
}

.photonui-particle-button-alternative-colors-active.photonui-button-color-blue:focus,
.photonui-particle-button-alternative-colors-active.photonui-button-color-green:focus,
.photonui-particle-button-alternative-colors-active.photonui-button-color-red:focus,
.photonui-particle-button-alternative-colors-active.photonui-button-color-wanaplan-toggle:focus,
.photonui-particle-button-alternative-colors-active.photonui-button-color-yellow:focus,
.photonui-particle-button-alternative-colors.photonui-button-color-green:active:focus,
.photonui-particle-button-alternative-colors.photonui-button-color-green:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-particle-button-alternative-colors.photonui-button-color-green .photonui-faicon {
    color: #fff
}

.photonui-particle-button-alternative-colors.photonui-button-color-green:active {
    background: linear-gradient(to top, #89b808 0, #709607 100%)
}

.photonui-particle-button-alternative-colors-active.photonui-button-color-blue {
    background: linear-gradient(to top, #089ab8 0, #077d96 100%)
}

.photonui-particle-button-alternative-colors-active.photonui-button-color-red {
    background: linear-gradient(to top, #de313f 0, #cb202e 100%)
}

.photonui-particle-button-alternative-colors-active.photonui-button-color-yellow {
    background: linear-gradient(to top, #f3c518 0, #dcb00b 100%)
}

.photonui-particle-button-alternative-colors-active.photonui-button-color-green {
    background: linear-gradient(to top, #89b808 0, #709607 100%)
}

.photonui-particle-button-alternative-colors-active.photonui-button-color-wanaplan-toggle {
    background: linear-gradient(to top, #89b808 0, #709607 100%);
    text-shadow: -1px -1px 0 #5d7d05;
    color: #fff
}

.photonui-particle-button-alternative-colors-active.photonui-button-color-wanaplan-toggle .photonui-faicon {
    color: #fff
}

.photonui-button {
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    text-shadow: 1px 1px 0 #fff;
    color: #333;
    border-color: #a5a5a5;
    background: linear-gradient(to bottom, #f7f7f7 0, #c4c4c4 100%);
    border-style: solid;
    border-width: 1px;
    min-width: 32px;
    line-height: 2em;
    padding: 0 10px;
    text-decoration: none !important;
    vertical-align: middle;
    cursor: pointer;
    border-radius: 2px
}

.photonui-button:active:focus,
.photonui-button:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button:active {
    background: linear-gradient(to top, #ddd 0, #cbcbcb 100%)
}

.photonui-button .photonui-faicon {
    color: #333
}

.photonui-button.photonui-button-color-blue {
    background: linear-gradient(to bottom, #089ab8 0, #077d96 100%);
    border-color: #055d6f;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #05697d
}

.photonui-button.photonui-button-color-blue:active:focus,
.photonui-button.photonui-button-color-blue:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-color-blue .photonui-faicon {
    color: #fff
}

.photonui-button.photonui-button-color-blue:active {
    background: linear-gradient(to top, #089ab8 0, #077d96 100%)
}

.photonui-button.photonui-button-color-red {
    background: linear-gradient(to bottom, #de313f 0, #cb202e 100%);
    border-color: #a81b26;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #b51d29
}

.photonui-button.photonui-button-color-red:active:focus,
.photonui-button.photonui-button-color-red:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-color-red .photonui-faicon {
    color: #fff
}

.photonui-button.photonui-button-color-red:active {
    background: linear-gradient(to top, #de313f 0, #cb202e 100%)
}

.photonui-button.photonui-button-color-yellow {
    background: linear-gradient(to bottom, #f3c518 0, #dcb00b 100%);
    border-color: #b59109;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #c49d0a
}

.photonui-button.photonui-button-color-yellow:active:focus,
.photonui-button.photonui-button-color-yellow:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-color-yellow .photonui-faicon {
    color: #fff
}

.photonui-button.photonui-button-color-yellow:active {
    background: linear-gradient(to top, #f3c518 0, #dcb00b 100%)
}

.photonui-button.photonui-button-color-green {
    background: linear-gradient(to bottom, #89b808 0, #709607 100%);
    border-color: #526f05;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #5d7d05
}

.photonui-button.photonui-button-color-green:active:focus,
.photonui-button.photonui-button-color-green:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-color-green .photonui-faicon {
    color: #fff
}

.photonui-button.photonui-button-color-green:active {
    background: linear-gradient(to top, #89b808 0, #709607 100%)
}

.photonui-button.photonui-button-appearance-flat,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button {
    box-shadow: none;
    border-color: transparent;
    background: 0 0;
    color: #333;
    text-shadow: none
}

.photonui-button.photonui-button-appearance-flat .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button .photonui-faicon {
    color: #333
}

.photonui-button.photonui-button-appearance-flat:focus:not(:hover),
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:not(:hover) {
    box-shadow: inset 1px 1px 0 #b2e81e, inset -1px -1px 0 #b2e81e;
    border-bottom: none;
    padding-top: 0;
    border-radius: 0
}

.photonui-button.photonui-button-appearance-flat:focus:hover,
.photonui-button.photonui-button-appearance-flat:hover,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover {
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    text-shadow: 1px 1px 0 #fff;
    color: #333;
    border-color: #a5a5a5;
    background: linear-gradient(to bottom, #f7f7f7 0, #c4c4c4 100%)
}

.photonui-button.photonui-button-appearance-flat:focus:hover:active:focus,
.photonui-button.photonui-button-appearance-flat:focus:hover:focus,
.photonui-button.photonui-button-appearance-flat:hover:active:focus,
.photonui-button.photonui-button-appearance-flat:hover:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-appearance-flat:focus:hover:active,
.photonui-button.photonui-button-appearance-flat:hover:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover:active {
    background: linear-gradient(to top, #ddd 0, #cbcbcb 100%)
}

.photonui-button.photonui-button-appearance-flat:focus:hover .photonui-faicon,
.photonui-button.photonui-button-appearance-flat:hover .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover .photonui-faicon {
    color: #333
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-blue,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-blue,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-blue,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-blue {
    background: linear-gradient(to bottom, #089ab8 0, #077d96 100%);
    border-color: #055d6f;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #05697d
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-blue:active:focus,
.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-blue:focus,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-blue:active:focus,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-blue:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-blue:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-blue:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-blue:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-blue:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-blue .photonui-faicon,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-blue .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-blue .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-blue .photonui-faicon {
    color: #fff
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-blue:active,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-blue:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-blue:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-blue:active {
    background: linear-gradient(to top, #089ab8 0, #077d96 100%)
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-red,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-red,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-red,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-red {
    background: linear-gradient(to bottom, #de313f 0, #cb202e 100%);
    border-color: #a81b26;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #b51d29
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-red:active:focus,
.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-red:focus,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-red:active:focus,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-red:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-red:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-red:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-red:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-red:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-red .photonui-faicon,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-red .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-red .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-red .photonui-faicon {
    color: #fff
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-red:active,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-red:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-red:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-red:active {
    background: linear-gradient(to top, #de313f 0, #cb202e 100%)
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-yellow,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-yellow,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-yellow,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-yellow {
    background: linear-gradient(to bottom, #f3c518 0, #dcb00b 100%);
    border-color: #b59109;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #c49d0a
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-yellow:active:focus,
.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-yellow:focus,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-yellow:active:focus,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-yellow:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-yellow:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-yellow:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-yellow:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-yellow:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-yellow .photonui-faicon,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-yellow .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-yellow .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-yellow .photonui-faicon {
    color: #fff
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-yellow:active,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-yellow:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-yellow:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-yellow:active {
    background: linear-gradient(to top, #f3c518 0, #dcb00b 100%)
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-green,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-green,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-green,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-green {
    background: linear-gradient(to bottom, #89b808 0, #709607 100%);
    border-color: #526f05;
    outline: 0;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3);
    color: #fff;
    text-shadow: -1px -1px 0 #5d7d05
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-green:active:focus,
.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-green:focus,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-green:active:focus,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-green:focus,
.photonui-togglebutton input:checked+button.photonui-button-color-blue:focus,
.photonui-togglebutton input:checked+button.photonui-button-color-green:focus,
.photonui-togglebutton input:checked+button.photonui-button-color-red:focus,
.photonui-togglebutton input:checked+button.photonui-button-color-wanaplan-toggle:focus,
.photonui-togglebutton input:checked+button.photonui-button-color-yellow:focus,
.photonui-togglebutton input:checked+button:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-green:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-green:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-green:active:focus,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-green:focus {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-green .photonui-faicon,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-green .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-green .photonui-faicon,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-green .photonui-faicon {
    color: #fff
}

.photonui-button.photonui-button-appearance-flat:focus:hover.photonui-button-color-green:active,
.photonui-button.photonui-button-appearance-flat:hover.photonui-button-color-green:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:focus:hover.photonui-button-color-green:active,
.photonui-togglebutton.photonui-button-appearance-flat input:not(:checked)+button:hover.photonui-button-color-green:active {
    background: linear-gradient(to top, #89b808 0, #709607 100%)
}

.photonui-togglebutton input:checked+button {
    background: linear-gradient(to top, #ddd 0, #cbcbcb 100%)
}

.photonui-togglebutton input:checked+button.photonui-button-color-blue {
    background: linear-gradient(to top, #089ab8 0, #077d96 100%)
}

.photonui-togglebutton input:checked+button.photonui-button-color-red {
    background: linear-gradient(to top, #de313f 0, #cb202e 100%)
}

.photonui-togglebutton input:checked+button.photonui-button-color-yellow {
    background: linear-gradient(to top, #f3c518 0, #dcb00b 100%)
}

.photonui-togglebutton input:checked+button.photonui-button-color-green {
    background: linear-gradient(to top, #89b808 0, #709607 100%)
}

.photonui-togglebutton input:checked+button.photonui-button-color-wanaplan-toggle {
    background: linear-gradient(to top, #89b808 0, #709607 100%);
    text-shadow: -1px -1px 0 #5d7d05;
    color: #fff
}

.photonui-togglebutton input:checked+button.photonui-button-color-wanaplan-toggle .photonui-faicon {
    color: #fff
}

.photonui-checkbox {
    display: inline-block
}

.photonui-checkbox input {
    display: none
}

.photonui-checkbox input+span {
    cursor: pointer;
    outline: 0;
    display: block;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    border: 2px solid #a5a5a5;
    border-radius: 3px;
    transition: all 150ms;
    overflow: hidden
}

.photonui-checkbox input:checked+span {
    border-color: #89b808;
    background: #89b808
}

.photonui-checkbox input:checked+span:after {
    content: "";
    display: block;
    width: 10px;
    height: 6px;
    border: 3px solid #fff;
    border-top: none;
    border-right: none;
    -webkit-transform: rotate(-50deg);
    transform: rotate(-50deg);
    margin: 1px 0 0 2px
}

.photonui-checkbox input+span:focus,
.photonui-checkbox input:checked+span:focus {
    border-color: #6e910f;
    box-shadow: 0 0 3px rgba(0, 0, 0, .4)
}

.photonui-checkbox input[disabled]+span {
    border-color: #cbcbcb;
    box-shadow: none
}

.photonui-checkbox input[disabled]:checked+span,
.photonui-checkbox input[disabled]:checked+span:focus {
    border-color: #bbb;
    background-color: #bbb
}

.photonui-checkbox input[disabled]:checked+span:after,
.photonui-checkbox input[disabled]:checked+span:focus:after {
    border-color: #959595
}

.photonui-colorbutton {
    padding-left: 5px;
    padding-right: 5px
}

.photonui-colorbutton span {
    margin-top: -2px;
    box-sizing: border-box;
    border-radius: 2px;
    text-shadow: none;
    vertical-align: middle;
    height: calc(72%);
    width: 100%;
    box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .3), inset -1px -1px 0 rgba(0, 0, 0, .3)
}

.photonui-colorbutton-custombutton {
    margin: 0 !important;
    width: 100% !important;
    line-height: 1.4em !important
}

.photonui-colorpalette {
    border-collapse: separate;
    border-spacing: 4px
}

.photonui-colorpalette tr td {
    width: 20px;
    height: 20px;
    cursor: pointer
}

.photonui-colorpicker .photonui-colorpicker-preview {
    text-align: center;
    color: rgba(255, 255, 255, .8);
    font-size: 14px;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, .1), 1px 1px 1px rgba(0, 0, 0, .7);
    outline: 0;
    box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 0 #fff;
    border: 1px solid #bbb
}

.photonui-colorpicker .photonui-colorpicker-preview:focus {
    color: #fff;
    border-color: #6e910f;
    box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 0 #fff, 0 0 3px rgba(0, 0, 0, .4)
}

.photonui-field {
    border: 1px solid #bbb;
    background: #fff;
    color: #333;
    outline: 0;
    padding: 5px;
    transition: all 150ms;
    box-shadow: 0 0 8px rgba(0, 0, 0, .1) inset;
    border-radius: 2px;
    box-sizing: border-box;
    width: 100%
}

.photonui-field:focus {
    background: #fff;
    border-color: #6e910f;
    color: #333;
    box-shadow: inset 0 0 7px rgba(0, 0, 0, .1), 0 0 3px rgba(0, 0, 0, .4)
}

.photonui-field::-webkit-input-placeholder {
    color: #b3b3b3;
    opacity: 1;
    font-style: italic
}

.photonui-field::-moz-placeholder {
    color: #b3b3b3;
    opacity: 1;
    font-style: italic
}

.photonui-field:-moz-placeholder {
    color: #b3b3b3;
    opacity: 1;
    font-style: italic
}

.photonui-field:-ms-input-placeholder {
    color: #b3b3b3;
    opacity: 1;
    font-style: italic
}

.photonui-field[disabled] {
    background: #f2f2f2;
    color: #a6a6a6
}

.photonui-field[disabled]::-webkit-input-placeholder {
    color: #b3b3b3
}

.photonui-field[disabled]::-moz-placeholder {
    color: #b3b3b3
}

.photonui-field[disabled]:-moz-placeholder {
    color: #b3b3b3
}

.photonui-field[disabled]:-ms-input-placeholder {
    color: #b3b3b3
}

.photonui-select:focus>*,
.photonui-select>* {
    color: #333
}

.photonui-slider .photonui-slider-slider {
    margin-right: 8px;
    cursor: pointer;
    outline: 0;
    min-width: 50px
}

.photonui-slider .photonui-slider-slider:before {
    box-sizing: border-box;
    content: "";
    display: block;
    height: 4px;
    margin-top: 8px;
    background: #d8d8d8
}

.photonui-slider .photonui-slider-slider .photonui-slider-grip {
    width: 10px;
    height: 20px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAHAQMAAAAVq36TAAAABlBMVEWYl5eblIr+5X3NAAAAAXRSTlMAQObYZgAAAA5JREFUCNdj+MAAAlASABO+AtEd8dlIAAAAAElFTkSuQmCC) center no-repeat #ddd;
    border: 1px solid #a5a5a5;
    margin-top: -12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1), inset 0 2px 7px -2px #fff
}

.photonui-slider .photonui-slider-slider:focus .photonui-slider-grip {
    box-shadow: 0 0 3px rgba(0, 0, 0, .4), inset 0 2px 7px -2px #fff
}

.photonui-slider.photonui-slider-nofield .photonui-slider-slider {
    margin-right: 0
}

.photonui-switch {
    padding-bottom: 0
}

.photonui-switch input+span {
    width: 52px;
    cursor: pointer;
    outline: 0
}

.photonui-switch input+span:before {
    box-sizing: border-box;
    content: "";
    display: block;
    height: 22px;
    width: 52px;
    outline: 0;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADQAAAAWCAYAAACPHL/WAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3QcKCSsuGp5SDAAAAMtJREFUWMPtlkEKgzAQRZ9tN4Kkya736jl7rrqLiOCqpJtZxBDRUhcjzIOBMZmEfId8AoZhGBnNrwtSSs/FBk3zOvA8LRCATr4nIALz3g1uin7sA/DF+F1iAHogbW10USKoJibHS80pOtQWYnpglNxlQrx0atbeoVCIicBHIspYrVatoC7Lx8r8uFKr+g4dhgZBU5a7yrxbqVUrKBZuF4CrRCjcLZ7B5WZxL5+Jqln0psNpukO9HHiNoXA79S+FBLzl4H89fQzDMBZ8AQdPKCm3y2IwAAAAAElFTkSuQmCC) center no-repeat #fff;
    transition: all 150ms;
    box-shadow: inset 0 0 8px rgba(0, 0, 0, .2);
    border-radius: 3px;
    border: 1px solid #aeaeae
}

.photonui-switch input+span:after {
    content: "";
    display: block;
    margin-top: -20px;
    margin-left: 2px;
    width: 24px;
    height: 18px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAWCAYAAADTlvzyAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEwAACxMBAJqcGAAAAHVJREFUSIntlTEKQCEMQ6P8xfvfyDM4eZc2f3Xxt4sZ5Ac6BAKP0lrLnJMQqiphP/CIHjPTAknpkqKaGaIaY6C1lvZfle6QJNZs5HdKz9DdsWYjvwW6ewpIEms28lugvMP7Z6jusPTepS9ffmnkt/T+7+l+4AuK5e348NG/wQAAAABJRU5ErkJggg==) center no-repeat #ddd;
    outline: 0;
    transition: all 150ms;
    border-radius: 3px;
    border: 1px solid #aeaeae;
    box-shadow: 1px 1px 0 rgba(255, 255, 255, .3) inset, -1px -1px 0 rgba(255, 255, 255, .3) inset
}

.photonui-switch input:checked+span:before {
    background-color: #89b808;
    box-shadow: inset 0 0 8px rgba(0, 0, 0, .2), 0 0 7px rgba(137, 184, 8, .5);
    border: 1px solid #5c7a0d
}

.photonui-switch input:checked+span:after {
    margin-left: 26px;
    border: 1px solid #7b7b7b
}

.photonui-label {
    white-space: nowrap;
    color: #333;
    padding: 2px 0
}

.photonui-progressbar {
    border-radius: 0;
    box-shadow: inset 1px 1px 0 #a5a5a5, inset -1px -1px 0 #a5a5a5, inset -1px 1px 0 #a5a5a5, inset 1px -1px 0 #a5a5a5;
    background: #fff
}

.photonui-progressbar .photonui-progressbar-bar {
    border-radius: 0;
    box-shadow: inset 1px 1px 0 #6e910f, inset -1px -1px 0 #6e910f, inset -1px 1px 0 #6e910f, inset 1px -1px 0 #6e910f;
    background: #89b808
}

.photonui-progressbar.photonui-progressbar-vertical .photonui-progressbar-bar {
    top: auto;
    bottom: 0
}

.photonui-progressbar.photonui-progressbar-vertical .photonui-progressbar-text {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.photonui-separator hr {
    border: none
}

.photonui-separator.photonui-separator-horizontal {
    padding: 5px 0
}

.photonui-separator.photonui-separator-horizontal hr {
    border-bottom: 1px solid #a5a5a5
}

.photonui-separator.photonui-separator-vertical {
    padding: 0 5px;
    background: linear-gradient(to right, transparent 0, transparent 5px, #a5a5a5 5px, #a5a5a5 6px, transparent 6px, transparent 100%)
}

.photonui-separator.photonui-separator-vertical hr {
    border-right: 1px solid transparent
}

.photonui-select {
    cursor: pointer;
    border: 1px solid #bbb;
    background: #fff;
    box-shadow: 0 0 8px rgba(0, 0, 0, .1) inset;
    border-radius: 2px
}

.photonui-select:focus {
    border-color: #6e910f;
    background: #fff;
    box-shadow: inset 0 0 7px rgba(0, 0, 0, .1), 0 0 3px rgba(0, 0, 0, .4)
}

.photonui-select .photonui-menuitem.photonui-select-placeholder {
    color: #b3b3b3;
    font-style: italic
}

.photonui-select .photonui-menuitem .photonui-menuitem-icon>* {
    color: inherit
}

.photonui-select .photonui-menuitem .photonui-menuitem-widget:before {
    box-sizing: border-box;
    content: "";
    display: inline-block;
    border: 6px solid transparent;
    border-top-color: #333;
    -webkit-transform: translate(0, 4px);
    transform: translate(0, 4px);
    transition: -webkit-transform 150ms;
    transition: transform 150ms
}

.photonui-select.photonui-widget-disabled {
    border-color: #bbb;
    background: #f2f2f2
}

.photonui-select.photonui-widget-disabled>* {
    color: #a6a6a6
}

.photonui-select.photonui-widget-disabled .photonui-menuitem.photonui-select-placeholder {
    color: #b3b3b3
}

.photonui-select.photonui-widget-disabled .photonui-menuitem .photonui-menuitem-widget:before {
    border-top-color: #919191
}

.photonui-tablayout .photonui-tablayout-tabs .photonui-tabitem-tab {
    border: 1px solid #a5a5a5;
    vertical-align: middle;
    padding: 0 8px;
    cursor: pointer;
    background: #ddd;
    transition: all 150ms
}

.photonui-tablayout .photonui-tablayout-tabs .photonui-tabitem-tab:hover {
    background: #fff
}

.photonui-tablayout .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active {
    background: #fff;
    z-index: 10
}

.photonui-tablayout .photonui-tablayout-content {
    background: #fff;
    border: 1px solid #a5a5a5;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2)
}

.photonui-tablayout.photonui-tablayout-tabposition-bottom .photonui-tablayout-innerbox .photonui-tablayout-tabs,
.photonui-tablayout.photonui-tablayout-tabposition-top .photonui-tablayout-innerbox .photonui-tablayout-tabs {
    height: 36px;
    min-height: 36px;
    max-height: 36px
}

.photonui-tablayout.photonui-tablayout-tabposition-bottom .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab,
.photonui-tablayout.photonui-tablayout-tabposition-top .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab {
    line-height: 30px;
    height: 30px;
    text-align: center;
    margin-right: -1px
}

.photonui-tablayout.photonui-tablayout-tabposition-bottom .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active,
.photonui-tablayout.photonui-tablayout-tabposition-top .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active {
    height: 36px;
    line-height: 36px
}

.photonui-tablayout.photonui-tablayout-tabposition-left .photonui-tablayout-innerbox .photonui-tablayout-tabs,
.photonui-tablayout.photonui-tablayout-tabposition-right .photonui-tablayout-innerbox .photonui-tablayout-tabs {
    width: 120px;
    min-width: 120px;
    max-width: 120px;
    padding-top: 1px
}

.photonui-tablayout.photonui-tablayout-tabposition-left .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab,
.photonui-tablayout.photonui-tablayout-tabposition-right .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab {
    width: calc(94%);
    line-height: 32px;
    height: 32px;
    text-align: 32px;
    text-align: left;
    margin-top: -1px
}

.photonui-tablayout.photonui-tablayout-tabposition-left .photonui-tablayout-innerbox .photonui-tablayout-content,
.photonui-tablayout.photonui-tablayout-tabposition-left .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active,
.photonui-tablayout.photonui-tablayout-tabposition-right .photonui-tablayout-innerbox .photonui-tablayout-content,
.photonui-tablayout.photonui-tablayout-tabposition-right .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active {
    width: 100%
}

.photonui-tablayout.photonui-tablayout-tabposition-top .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
    border-bottom: none;
    border-radius: 2px 2px 0 0
}

.photonui-tablayout.photonui-tablayout-tabposition-top .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active {
    margin-bottom: -1px;
    box-shadow: -1px 0 0 rgba(0, 0, 0, .05), 1px 0 0 rgba(0, 0, 0, .05), 0 -1px 0 rgba(0, 0, 0, .05), -2px -2px 0 rgba(0, 0, 0, .01), 2px -2px 0 rgba(0, 0, 0, .01)
}

.photonui-tablayout.photonui-tablayout-tabposition-bottom .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab {
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
    border-top: none;
    border-radius: 0 0 2px 2px
}

.photonui-tablayout.photonui-tablayout-tabposition-bottom .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active {
    margin-top: -1px;
    box-shadow: -1px 0 0 rgba(0, 0, 0, .05), 1px 0 0 rgba(0, 0, 0, .05), 0 1px 0 rgba(0, 0, 0, .05), -2px 2px 0 rgba(0, 0, 0, .01), 2px 2px 0 rgba(0, 0, 0, .01)
}

.photonui-tablayout.photonui-tablayout-tabposition-left .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab {
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
    border-right: none;
    text-align: right;
    border-radius: 2px 0 0 2px
}

.photonui-tablayout.photonui-tablayout-tabposition-left .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active {
    margin-right: -1px;
    padding-right: 9px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, .05), 0 1px 0 rgba(0, 0, 0, .05), -1px 0 0 rgba(0, 0, 0, .05), -2px -2px 0 rgba(0, 0, 0, .01), -2px 2px 0 rgba(0, 0, 0, .01)
}

.photonui-tablayout.photonui-tablayout-tabposition-right .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab {
    -webkit-align-self: flex-start;
    -ms-flex-item-align: start;
    align-self: flex-start;
    border-left: none;
    border-radius: 0 2px 2px 0
}

.photonui-tablayout.photonui-tablayout-tabposition-right .photonui-tablayout-innerbox .photonui-tablayout-tabs .photonui-tabitem-tab.photonui-tabitem-active {
    margin-left: -1px;
    padding-left: 9px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, .05), 0 1px 0 rgba(0, 0, 0, .05), 1px 0 0 rgba(0, 0, 0, .05), 2px -2px 0 rgba(0, 0, 0, .01), 2px 2px 0 rgba(0, 0, 0, .01)
}

.photonui-window-title {
    overflow: hidden;
    background: #383838 !important
}

.photonui-button-color-green {
    background: #89b808 !important;
    border-color: #6e910f !important;
    color: #fff !important
}

.photonui-window.headless .photonui-window-title {
    display: none
}

#mainMenuTabsContainer {
    overflow: auto
}

#mainMenu {
    height: 100%;
    background: #f1f1f1;
    box-shadow: 0 0 8px rgba(0, 0, 0, .4);
    border-left: #bbb solid 1px
}

#mainMenu ul#mainMenuTabs {
    padding-left: 10px;
    margin-top: 48px;
    white-space: nowrap
}

#mainMenu ul#mainMenuTabs li {
    display: inline-block;
    text-align: center;
    cursor: pointer;
    width: 76px;
    padding: 5px 0;
    margin: 0;
    border: 1px solid #f1f1f1;
    border-top: none;
    border-bottom: none;
    position: relative
}

#mainMenu ul#mainMenuTabs li img {
    vertical-align: middle;
    max-width: 40px
}

#mainMenu ul#mainMenuTabs li span {
    display: block
}

#mainMenu ul#mainMenuTabs li span.menu-title {
    color: #222;
    font-size: 9pt;
    text-shadow: 1px 1px 0 #fff
}

#mainMenu ul#mainMenuTabs>li:hover {
    background: #fff;
    border-color: #ddd;
    box-shadow: inset 0 0 10px rgba(0, 0, 0, .1)
}

#mainMenu ul#mainMenuTabs>li.selected {
    background: #89b808;
    border-color: #6e910f;
    box-shadow: inset 1px 0 0 rgba(255, 255, 255, .3), inset -1px 0 0 rgba(255, 255, 255, .3)
}

#mainMenu ul#mainMenuTabs>li.selected span.menu-title {
    color: #fff;
    text-shadow: -1px -1px 0 #6e910f
}

#mainMenu ul#mainMenuTabs li.label-2D:before,
#mainMenu ul#mainMenuTabs li.label-3D:before {
    background: #fff;
    position: absolute;
    padding: 0 2px;
    font-size: 8pt;
    border-radius: 2px;
    margin-left: 15px;
    color: #888;
    border: 1px solid #bbb;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, .2)
}

#mainMenu ul#mainMenuTabs>li.selected.label-2D:before,
#mainMenu>ul#mainMenuTabs li.selected.label-3D:before {
    background: #C3E75F;
    border-color: #6e910f;
    color: #566F13;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, .3)
}

#mainMenu ul#mainMenuTabs li.label-2D:before {
    content: "2D"
}

#mainMenu ul#mainMenuTabs li.label-3D:before {
    content: "3D"
}

#mainMenu #mainMenuTitle {
    background: #383838;
    margin: 0;
    padding: 5px;
    color: #f1f1f1;
    text-shadow: -1px -1px 0 #000;
    cursor: default
}

#mainMenu #mainMenuContent {
    overflow: auto;
    padding-top: 1px;
    height: 90%;
    height: -moz-calc(100% - 140px);
    height: -webkit-calc(100% - 140px);
    height: calc(100% - 140px)
}

.menu-item.hidden {
    display: none !important
}

#mainMenu li.menu-item.hidden,
#mainMenu li.menu-subitem ul {
    display: none
}

#mainMenu li.menu-subitem ul.visible,
#mainMenu li.menu-subitem.opened ul {
    display: block
}

#mainMenu li {
    cursor: pointer
}

#mainMenu li.menu-subitem>ul {
    box-shadow: -1px 0 0 #999;
    margin-left: 8px !important;
    margin-top: -1px;
    padding-top: 2px
}

#mainMenu ul.mainList li .menu-title {
    margin-left: 9px
}

#mainMenu ul.mainList li span.menu-icon,
#mainMenu ul.sublist li span.menu-icon {
    background: #e1e1e1;
    float: left;
    display: inline-block;
    width: 23px;
    height: 23px;
    margin: 0;
    border: 2px solid #fff;
    overflow: hidden;
    box-shadow: 0 0 1px rgba(0, 0, 0, .3);
    outline-color: #89b808
}

#mainMenu ul.mainList li span.menu-icon .colorChooser,
#mainMenu ul.sublist li span.menu-icon .colorChooser {
    position: absolute;
    margin: -28px 0 0 35px;
    display: block;
    z-index: 2;
    height: 20px;
    width: 20px;
    border: 1px solid #fff;
    box-shadow: 0 0 3px rgba(0, 0, 0, .3);
    overflow: hidden
}

#mainMenu ul.mainList li span.menu-icon .menu-topIcon,
#mainMenu ul.sublist li span.menu-icon .menu-topIcon {
    position: absolute;
    margin: -63px 0 0;
    display: block;
    background: #89B808;
    color: #FFF;
    text-overflow: ellipsis;
    border-radius: 0 0 2px;
    padding: 2px;
    font-size: 13px;
    text-shadow: -1px -1px 0 #6e910f;
    border: 1px solid #6e910f;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .2), inset 0 -1px 0 rgba(255, 255, 255, .2)
}

#mainMenu ul.mainList li span.menu-icon .info,
#mainMenu ul.sublist li span.menu-icon .info {
    position: relative;
    padding: 14px 0;
    text-align: center;
    width: 100%;
    height: 30px;
    bottom: 131px;
    font-size: 12px;
    background: rgba(56, 56, 56, .4);
    color: #fff;
    text-shadow: -1px -1px 0 #000;
    transition: .5s;
    -webkit-transition: .5s;
    text-overflow: ellipsis
}

#mainMenu ul.mainList li span.menu-icon:hover .info,
#mainMenu ul.sublist li span.menu-icon:hover .info {
    bottom: 62px
}

#mainMenu ul.mainList li span.menu-icon .colorChooser:hover,
#mainMenu ul.sublist li span.menu-icon .colorChooser:hover {
    transition: all .1s;
    -webkit-transition: all .1s;
    transform: scale(1.1);
    -webkit-transform: scale(1.1)
}

#mainMenu ul.mainList li span.menu-icon.sprite .colorChooser,
#mainMenu ul.sublist li span.menu-icon.sprite .colorChooser {
    margin-top: 35px
}

#mainMenu ul.mainList li span.menu-icon .colorChooser:after,
#mainMenu ul.sublist li span.menu-icon .colorChooser:after {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background: #fff;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    margin: 14px 0 0 14px;
    border: 1px solid #fff;
    pointer-events: none
}

#mainMenu ul.mainList li span.menu-label {
    display: inline-block;
    height: 20px;
    font-size: 15px;
    padding-top: 4px;
    margin-left: 5px
}

#mainMenu ul.layout-list-icon>li,
#mainMenu ul.layout-list>li {
    width: 100%
}

#mainMenu ul.layout-list li.menu-item,
#mainMenu ul.layout-list-icon li.menu-item {
    padding: 9px 0;
    white-space: normal;
    overflow: hidden;
    border-bottom: #ccc solid 1px;
    box-shadow: 0 1px 0 #fff;
    color: #333;
    text-shadow: 1px 1px 0 #fff
}

#mainMenu ul.layout-list li.selected,
#mainMenu ul.layout-list>li.menu-subitem.opened {
    color: #fff;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .2), inset 0 -1px 0 rgba(255, 255, 255, .2)
}

#mainMenu ul.layout-list-icon>li.menu-subitem,
#mainMenu ul.layout-list>li.menu-subitem {
    background: url(../images/menu-closed.png) right no-repeat
}

#mainMenu ul.layout-list-icon>li.menu-subitem.opened,
#mainMenu ul.layout-list>li.menu-subitem.opened {
    background: url(../images/menu-opened.png) right 6px no-repeat
}

#mainMenu ul.layout-list>li.menu-subitem.opened ul {
    margin-top: 9px;
    background: #eee
}

#mainMenu ul.layout-list li:hover,
#mainMenu ul.layout-list-icon li:hover {
    background-color: #fff
}

#mainMenu ul.layout-list>li.menu-subitem.opened {
    padding-bottom: 0;
    background-color: #bbb;
    text-shadow: -1px -1px 0 #999;
    border: 1px solid #999;
    border-right: none;
    margin-top: -2px
}

#mainMenu ul.layout-list li.selected {
    background-color: #89b808;
    text-shadow: -1px -1px 0 #6e910f;
    border: 1px solid #6e910f;
    border-right: none;
    margin-top: -2px
}

#mainMenu ul.layout-list>li>div>span.menu-icon {
    display: none
}

#mainMenu ul.layout-list-icon>li>div>span.menu-icon {
    display: inline-block
}

#mainMenu ul.layout-table,
#mainMenu ul.layout-table-26,
#mainMenu ul.layout-table-60 {
    padding: 8px 0 !important;
    text-align: center;
    border-bottom: #ccc solid 1px
}

#mainMenu ul.layout-table-26>li,
#mainMenu ul.layout-table-26>li>div,
#mainMenu ul.layout-table-60>li,
#mainMenu ul.layout-table-60>li>div,
#mainMenu ul.layout-table>li {
    display: inline-block;
    width: auto;
    border: none;
    box-shadow: none
}

#mainMenu ul.layout-table-26>li,
#mainMenu ul.layout-table-60>li,
#mainMenu ul.layout-table>li {
    margin: 0 2px
}

#mainMenu ul.layout-table-26>li span.menu-icon,
#mainMenu ul.layout-table-60>li span.menu-icon,
#mainMenu ul.layout-table>li span.menu-icon {
    margin: 0;
    transition: all .1s;
    -webkit-transition: all .1s
}

#mainMenu ul.layout-table-26>li>span.menu-label,
#mainMenu ul.layout-table-60>li>span.menu-label,
#mainMenu ul.layout-table>li>span.menu-label {
    display: none
}

#mainMenu ul.layout-table-26>li,
#mainMenu ul.layout-table-60>li,
#mainMenu ul.layout-table>li {
    transition: all .1s;
    -webkit-transition: all .1s
}

#mainMenu ul.layout-table-26>li.menu-item,
#mainMenu ul.layout-table-60>li.menu-item,
#mainMenu ul.layout-table>li.menu-item {
    padding: 0;
    border-bottom: none;
    box-shadow: none
}

#mainMenu ul.layout-table-26>li span.menu-icon.colorable,
#mainMenu ul.layout-table-60>li span.menu-icon.colorable,
#mainMenu ul.layout-table>li span.menu-icon.colorable {
    position: relative
}

#mainMenu ul.layout-table-26>li span.menu-icon.colorable img,
#mainMenu ul.layout-table-60>li span.menu-icon.colorable img,
#mainMenu ul.layout-table>li span.menu-icon.colorable img {
    width: 60px;
    height: 60px
}

#mainMenu ul.layout-table-26>li span.menu-icon {
    width: 28px;
    height: 28px
}

#luxens ul.layout-table-26>li span.menu-icon {
    width: 28px;
    height: 28px;
    border: 1px solid transparent
}

#luxens ul.layout-table-26>li span.menu-icon:hover {
    border: 1px solid #666
}

#mainMenu ul.layout-table-26>li.selected span.menu-icon {
    transform: scale(1.4);
    -webkit-transform: scale(1.4);
    outline: #89b808 solid 2px;
    box-shadow: none
}

#mainMenu ul.layout-table-60>li span.menu-icon {
    position: relative;
    width: 60px;
    height: 60px;
    margin: 2px
}

#mainMenu ul.layout-table-60>li:hover span.menu-icon {
    box-shadow: 0 0 3px rgba(0, 0, 0, .6)
}

#mainMenu ul.layout-table-60>li.selected span.menu-icon {
    box-shadow: none;
    outline: #89b808 solid 2px
}

#mainMenu ul.layout-table-60>li span.menu-icon img {
    max-width: 64px;
    width: 60px;
    height: 60px
}

#toolbar {
    position: absolute;
    width: 300px;
    right: 0
}

#toolbar #toolbar-bar {
    background: #383838;
    border-radius: 0 0 0 46px;
    text-align: right;
    box-shadow: 0 0 8px rgba(0, 0, 0, .4);
    height: 48px
}

#subMenuList li.menu-subitem ul,
#toolbar li.menu-subitem ul {
    display: none;
    position: absolute;
    background: #fff;
    border: 5px solid #eee;
    z-index: 100000
}

#subMenuList li.menu-subitem.opened>ul,
#toolbar li.menu-subitem.opened>ul {
    display: block
}

#toolbar #toolbar-bar>ul {
    display: table;
    width: 259px;
    text-align: center;
    margin-left: 41px
}

#subMenuList {
    display: table;
    min-width: 50px;
    text-align: center;
    margin: 0;
    padding: 0;
    font-size: 14px
}

#subMenuList>li,
#toolbar #toolbar-bar>ul>li {
    display: table-cell;
    text-align: center;
    min-width: 54px;
    height: 48px;
    cursor: pointer;
    vertical-align: middle
}

#subMenuList>li>span,
#toolbar #toolbar-bar>ul>li>span {
    display: block;
    transition: all .2s;
    -webkit-transition: all .2s
}

#subMenuList>li>span.menu-icon,
#toolbar #toolbar-bar>ul>li>span.menu-icon {
    margin-top: 7px;
    width: 100%;
    opacity: .9
}

#subMenuList>li>span.menu-icon img,
#toolbar #toolbar-bar>ul>li>span.menu-icon img {
    max-width: 32px;
    max-height: 32px;
    transition: all .2s;
    -webkit-transition: all .2s;
    vertical-align: middle;
    -webkit-transform-origin: top
}

#subMenuList>li>span.menu-title,
#toolbar #toolbar-bar>ul>li>span.menu-title {
    color: #eee;
    font-size: 10px;
    display: block;
    text-align: center;
    max-height: 13px;
    margin-top: -10px;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 0;
    font-family: Arial, sans-serif
}

#subMenuList>li:not(.opened):hover>span.menu-icon,
#toolbar #toolbar-bar>ul>li:not(.opened):hover>span.menu-icon {
    transform: scale(.8) translate(0, -3px);
    -webkit-transform: scale(.8) translate(0, -3px);
    transform-origin: top;
    -webkit-transform-origin: top
}

#subMenuList>li.opened>span.menu-title,
#subMenuList>li:hover>span.menu-title,
#toolbar #toolbar-bar>ul>li.opened>span.menu-title,
#toolbar #toolbar-bar>ul>li:hover>span.menu-title {
    opacity: 1
}

#subMenuList .menu-item .loader,
#toolbar #toolbar-bar ul .menu-item .loader {
    display: none
}

#subMenuList .menu-item.loading .loader,
#toolbar #toolbar-bar ul .menu-item.loading .loader {
    display: block
}

#subMenuList>.menu-item i,
#toolbar #toolbar-bar>ul>.menu-item i {
    color: #fff;
    font-size: 1.8em;
    padding: 6px 4px;
    position: relative
}

#subMenuList>.locked,
#toolbar #toolbar-bar>ul>.menu-item i.locked {
    opacity: .5
}

#subMenuList .menu-item i.special,
#toolbar #toolbar-bar ul .menu-item i.special {
    color: #C3E75F
}

#subMenu {
    height: 35px;
    min-width: 75px;
    position: relative
}

#subMenuContainer {
    background: silver;
    position: absolute;
    right: 260px;
    padding: 0 50px 13px 30px;
    z-index: 42;
    overflow: hidden;
    color: #fff;
    font-size: 18pt;
    font-family: Arial, sans-serif;
    border-radius: 0 0 0 46px
}

.subMenuButton,
.subMenuButtonImage {
    float: left;
    z-index: 43;
    font-size: 24px !important;
    cursor: pointer
}

.subMenuButton {
    margin: 5px 15px -2px 5px !important;
    color: #fff
}

.subMenuButton:hover {
    color: #333 !important
}

.subMenuButtonImage {
    margin-top: 0 !important;
    color: #fff
}

.subMenuButtonTransparency {
    background-image: url(../images/icon-transparency.png)
}

.subMenuButtonOpacity {
    background-image: url(../images/icon-opacity.png)
}

.subMenuButtonImage:hover {
    background-image: url(../images/icon-transparency-hover.png)
}

#toolbar-bar li.menu-subitem {
    position: relative;
    text-align: left
}

#toolbar-bar li.menu-subitem ul {
    position: absolute;
    background: #111;
    z-index: 420000000;
    top: 47px;
    right: 10px;
    padding: 5px 0;
    pointer-events: auto;
    border-radius: 5px;
    opacity: .94;
    min-width: 200px;
    transition: all .3s;
    box-shadow: 0 0 10px rgba(0, 0, 0, .5);
    border: 2px solid #fff
}

#toolbar-bar li.menu-subitem ul:after,
#toolbar-bar li.menu-subitem ul:before {
    bottom: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    opacity: .94
}

#toolbar-bar li.menu-subitem ul:after {
    border-color: transparent transparent #000;
    border-width: 10px;
    right: 10px;
    margin-left: -10px
}

#toolbar-bar li.menu-subitem ul:before {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #fff;
    border-width: 13px;
    right: 7px;
    margin-left: -13px
}

#toolbar-bar li.menu-subitem ul li {
    color: rgba(255, 255, 255, .9);
    clear: both;
    padding: 3px 0 3px 10px;
    text-align: left
}

#toolbar-bar li.menu-subitem ul li:hover {
    background: #444
}

#toolbar-bar li.menu-subitem ul li.separator {
    padding: 3px 10px
}

#toolbar-bar li.menu-subitem ul li.separator:hover {
    background: 0 0
}

#toolbar-bar li.menu-subitem ul li button::-moz-focus-inner {
    border: 0;
    padding: 0
}

#toolbar-bar li.menu-subitem ul li button {
    width: 100%;
    margin: 0;
    padding: 5px 10px;
    text-align: left;
    border: none;
    background: 0 0;
    color: rgba(255, 255, 255, .9);
    cursor: pointer;
    font-family: Arial, sans-serif;
    font-size: 11pt;
    border-radius: 2px
}

#toolbar-bar li.menu-subitem ul li hr {
    margin: 3px 0;
    border: none;
    border-bottom: rgba(255, 255, 255, .2) solid 1px
}

#toolbar-bar li.menu-subitem ul.hidden {
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translate(0, 5px);
    transform: translate(0, 7px)
}

#toolbar-bar li.menu-subitem ul li label {
    line-height: 30px;
    font-family: Arial, sans-serif;
    font-size: 11pt;
    padding: 0 15px 0 10px;
    cursor: pointer;
    width: 100%;
    width: calc(100% - 25px);
    display: inline-block
}

#toolbar-bar li.menu-subitem ul li label:empty {
    display: none
}

#toolbar-bar li.menu-subitem ul li input {
    float: right;
    margin-left: 5px
}

#toolbar-bar li.menu-subitem input[type=checkbox] {
    display: inline-block;
    width: 48px;
    height: 30px;
    -moz-appearance: none;
    -webkit-appearance: none;
    margin: -30px 10px 0 0;
    cursor: pointer;
    opacity: 0
}

#toolbar-bar li.menu-subitem input[type=checkbox]+span {
    margin: -26px 10px 0 -10px;
    float: right;
    display: inline-block;
    width: 45px;
    height: 20px;
    border: 1px solid #fff;
    border-radius: 3px;
    pointer-events: none;
    opacity: .9;
    transition: all .2s;
    background: url(../images/ui/menu-switch-bg.png) center no-repeat #000
}

#toolbar-bar li.menu-subitem input[type=checkbox]+span:before {
    display: block;
    content: "";
    width: 20px;
    height: 16px;
    margin-top: 1px;
    margin-left: 1px;
    border: 1px solid #fff;
    border-radius: 2px;
    background: url(../images/ui/menu-switch-btn-bg.png) center no-repeat #fff;
    pointer-events: none;
    box-shadow: 0 0 2px rgba(0, 0, 0, .6);
    transition: all .13s
}

#toolbar-bar li.menu-subitem input[type=checkbox]:checked+span {
    background-color: #777;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, .6)
}

#toolbar-bar li.menu-subitem input[type=checkbox]:checked+span:before {
    margin-left: 22px
}

#waiter,
.photonui-wnpephemeralinfowidget {
    width: 400px;
    height: 30px;
    padding: 5px 5px 5px 40px;
    line-height: 35px;
    background: #FEF86C;
    color: #F4661B;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -200px
}

#waiter.hidden,
.photonui-wnpephemeralinfowidget.hidden {
    display: none
}

.photonui-wnpephemeralinfowidget {
    background: #eee;
    color: #999;
    text-align: center;
    padding: 0
}

.photonui-wnpephemeralinfowidget span {
    text-align: center
}

#userConnectionForm .visible,
#userConnectionForm.visible {
    display: block
}

#userConnectionForm .hide,
#userConnectionForm.hide {
    display: none
}

#userConnectionToggle {
    text-decoration: none;
    color: #555;
    margin-right: 5px;
    font-size: 9pt;
    font-family: Arial
}

#userConnectionToggle:hover {
    text-decoration: underline
}

#userConnectionForm .error {
    display: none;
    border-radius: 2px;
    padding: 5px;
    border-left: 3px solid #DFB5B4;
    background: #FCF2F2
}

#userConnectionForm .loader {
    display: none;
    position: absolute;
    bottom: 5px
}

#userConnectionForm .check {
    margin: 5px 0 0 5px;
    visibility: hidden
}

#helpbubble {
    position: absolute;
    bottom: 20px;
    right: 280px;
    min-width: 200px;
    min-height: 100px;
    max-width: 520px;
    background: #000;
    z-index: 420;
    pointer-events: none;
    border-radius: 3px;
    box-shadow: 0 0 7px rgba(0, 0, 0, .6);
    padding: 10px;
    opacity: 0;
    -moz-filter: blur(7px);
    -webkit-filter: blur(7px);
    filter: blur(7px);
    transition: all .6s;
    line-height: 1.3em
}

#helpbubble .close {
    position: absolute;
    top: 3px;
    right: 3px;
    background: url(../images/helpbubble-close.png) center no-repeat;
    width: 16px;
    height: 16px;
    pointer-events: none;
    cursor: pointer;
    border-radius: 2px;
    border: 0
}

#helpbubble .close:hover {
    background-color: rgba(255, 255, 255, .1)
}

#helpbubble .wrapper {
    display: table
}

#helpbubble .wrapper .content,
#helpbubble .wrapper .image {
    display: table-cell;
    vertical-align: middle;
    padding: 5px
}

#helpbubble .wrapper .image img {
    vertical-align: middle
}

#helpbubble .wrapper .content {
    font-size: 13pt;
    line-height: 1.4em;
    vertical-align: top
}

#helpbubble .wrapper .content strong {
    display: block;
    border-bottom: rgba(255, 255, 255, .3) solid 1px;
    margin-bottom: .5em;
    color: #fff
}

#helpbubble .wrapper .content ul {
    margin: 0;
    padding: 0 0 0 15px
}

#helpbubble .wrapper .content ul li {
    margin-bottom: 5px;
    color: #fff
}

#helpbubble.visible {
    opacity: .8;
    -moz-filter: blur(0);
    -webkit-filter: blur(0);
    filter: blur(0)
}

#helpbubble.visible .close {
    pointer-events: auto
}

.photonui-wnpfloorcontrollerbutton {
    width: 120px;
    /* height: 17px; */
    cursor: pointer;
    border-radius: 5px;
    border: 1px solid #aaa;
    font-size: 10px;
    padding: 3px;
    float: left;
    margin-right: 5px;
    margin-bottom: 3px;
    text-align: center;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    background: silver;
    color: #fff !important
}

.photonui-wnpfloorcontrollerbutton.selected,
.photonui-wnpfloorcontrollerbutton:hover {
    background: #454545;
    border: 1px solid #000
}

.photonui-wnpfloorcontrollerbutton:hover .delete,
.photonui-wnpfloorcontrollerbutton:hover .settings {
    opacity: .5
}

.photonui-wnpfloorcontrollerbutton:hover .delete:hover,
.photonui-wnpfloorcontrollerbutton:hover .settings:hover {
    opacity: 1
}

.photonui-wnpfloorcontrollerbutton.dragover {
    background: #89b808
}

.photonui-wnpfloorcontrollerbutton .delete,
.photonui-wnpfloorcontrollerbutton .settings {
    position: absolute;
    width: 10px;
    opacity: 0;
    display: none
}

.photonui-wnpfloorcontrollerbutton .delete {
    right: 5px;
    top: 2px
}

.photonui-wnpfloorcontrollerbutton .settings {
    left: 5px;
    top: 2px;
    border-radius: 5px;
    opacity: .5;
    border: 1px solid #0C0
}

.photonui-wnpfloorcontrollerbutton.deletable .delete,
.photonui-wnpfloorcontrollerbutton.editable .settings {
    display: block
}

.photonui-wnpiframe .photonui-window-title {
    display: none
}

.photonui-wnpproductitem {
    width: 130px;
    height: 110px;
    position: relative;
    margin: 1px 6px 8px 7px;
    cursor: pointer;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .3), -1px 0 0 #aaa, 1px 0 0 #aaa, 0 -1px 0 #aaa, 0 1px 0 #aaa;
    transition: box-shadow .2s;
    -webkit-transition: box-shadow .2s
}

.photonui-wnpproductitem span {
    display: block;
    margin: 0;
    padding: 0
}

.photonui-wnpproductitem:hover {
    box-shadow: 0 0 5px rgba(0, 0, 0, .4), -1px 0 0 #555, 1px 0 0 #555, 0 -1px 0 #555, 0 1px 0 #555
}

.photonui-wnpproductitem .photonui-wnpproductitem-container {
    width: 100%;
    height: 100%;
    overflow: hidden
}

.photonui-wnpproductitem .photonui-wnpproductitem-container .photonui-wnpproductitem-image {
    background: 0 0;
    position: absolute;
    top: 0;
    display: inline-block;
    width: 100%;
    height: 95px;
    overflow: hidden;
    text-align: center
}

.photonui-wnpproductitem .photonui-wnpproductitem-container .photonui-wnpproductitem-image img {
    max-width: 102%
}

.photonui-wnpproductitem .photonui-wnpproductitem-container .photonui-wnpproductitem-purchase {
    display: none
}

.photonui-wnpproductitem .photonui-wnpproductitem-container .photonui-wnpproductitem-description {
    position: absolute;
    bottom: 0;
    padding: 4px 5px 1px;
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    width: calc(100% - 10px);
    z-index: 100;
    text-align: center;
    background: #383838;
    text-overflow: ellipsis;
    color: #fff;
    text-shadow: -1px -1px 0 #000;
    transition: background .1s;
    -webkit-transition: background .1s;
    box-shadow: 0 1px 0 #555, 1px 0 0 #555, -1px 0 0 #555, inset 0 1px 0 #fff
}

.photonui-wnpproductitem .photonui-wnpproductitem-container .photonui-wnpproductitem-icon {
    position: absolute;
    top: 1px;
    left: -1px;
    background: #89B808;
    color: #FFF;
    text-overflow: ellipsis;
    border-radius: 4px 0;
    padding: 3px;
    text-shadow: -1px -1px 0 #6e910f;
    border: 1px solid #6e910f;
    margin-top: -2px;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .2), inset 0 -1px 0 rgba(255, 255, 255, .2)
}

.photonui-wnpproductitem .photonui-wnpproductitem-container .photonui-wnpproductitem-info {
    position: relative;
    top: -110px;
    z-index: 1;
    padding: 20px 0;
    text-align: center;
    width: 100%;
    height: 70px;
    font-size: 18px;
    background: rgba(56, 56, 56, .4);
    color: #fff;
    text-shadow: -1px -1px 0 #000;
    transition: .5s;
    -webkit-transition: .5s;
    text-overflow: ellipsis
}

.photonui-wnpproductitem .selected {
    opacity: 0;
    position: absolute;
    top: 5px;
    z-index: 2;
    margin: 4px 0 0 -6px;
    padding: 3px 5px;
    font-size: 14px;
    border-radius: 2px;
    background: #89B808;
    color: #fff;
    text-shadow: -1px -1px 0 #6E910F;
    border: 1px solid #6E910F;
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(255, 255, 255, .3)
}

.photonui-wnpproductitem .selected.show {
    animation: bubble-in .5s;
    -webkit-animation: bubble-in .5s;
    opacity: 1
}

.photonui-wnpproductitem:hover .photonui-wnpproductitem-container .photonui-wnpproductitem-info {
    top: 0
}

.photonui-wnpremotecameracontroller {
    width: 50px;
    height: 50px;
    background-color: transparent;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAADSCAYAAAAIe5MzAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAGtQAABrUBXo2HFwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAABFGSURBVHic7V1bbFtHev4OD2+iSJuMSNlSRFl3BesAEVD4pUaRFtikizxsHyw1tbduEqEVkgAukKKLPiRtFtv2ZbdbA/vQGNradYEFlKxSBFlgixYB3KZNCwdOUMOIHV9km5Rk60JSvJPnzMw50weTgiTzci5zZCnY7408c2bOd2b+mf8y8x+Jcw4RuHDhQsjv95/0+Xy/7fF4Qh6PJyjLcsjlcoUAQNf1ImOsxBgrUkqLqqr+p6Ioc9PT00UR7Ut2iFy4cKE3GAz+SSAQ+K1wODzS19fXHwqFJCP3FotFvry8vJjL5RYqlcp/l0qln01PTz+0+iyWiMzOzvZHo9G/7+np+c3+/v4ev9/ftCznHLquQ5blpmUURcHi4uLKysrK/6bT6T+bmZlZNPtMpoi89957ke7u7h8fPnz4hdHR0f5WD1dHMpkEABw5cqRtWU3TcOfOncXV1dVP1tfXv//GG29kjT6bYSJzc3OvRKPRd5599tkRr9dr6B5VVXHv3j3Isoynn34anZ2dhu4jhOCrr75aSKfTf3Py5Ml/NnKPISIffvjhj4eHh1/r7+/vMvQkNdy5cwcejwfAo7c9PDxs5nYsLi5m7t69+0+Tk5Pfb1e2JZGLFy/6g8Hg+xMTE78biUSaC0ID5HI5rK2twefzAQAYY4hEIujqMvUukM1mlatXr/57qVT6g1dffVVpVq4pkYsXL/rD4fAnx44dO+73+w3NRFtx8+ZN7JwEVFXF+Pi42aqgKAq/cuXK/+RyuReakXE1uzkUCs1ZJbGysrI5pLbC6/XiwYMHZquD3++Xjh07djwUCs01K9OQyPz8/I8mJia+Y4WEruvIZrMNp1tJklAqlUApNVst/H6/NDEx8Z35+fkfNbr+GJG5ublXRkdHp8PhsCmZqCOZTCIQCDS97vP5LPUKAITDYf/o6Oj03NzcKzuvbSNy/vz5p2Kx2DvxeNycRNZQqVSgKE3lcROEEJRKJStNIB6Pd8VisXfOnz//1Nb/txEJh8M/OXr06IilFgAsLy+jo6OjbTmv14vV1VWrzeDo0aMj4XD4J1v/2yRy7ty5gUOHDn3b6GK3ExsbG6bKS5KEdDptqS2v14tDhw59+9y5cwP1/zaJxGKxn46NjfVZqhnA2toazLwEWZaRyWRgVWkdGxvri8ViP63/ljjnOHfu3NMTExNfjo6OHrJSaSKRQD6fh8vVdDZvio6ODoyMWBvNd+7cWbt69epvvP766w/cABCNRv/4yJEjlkgAwMDAgNVbbSEejx9aWlqaAfCuCwACgcBxK7JhR2BF1OX3+xEIBI4DgNzV1XVgcHDwnWg0GjZaQS6XQzKZRKVSQSwWM/0AjZBMJpHNZuF2ux9TbVqhWCy6P/744wvuaDR6sq+vr9/ITYqiYHl5Gbquw+fzQVVVyw++E7Isw+fzYX19Hel0Gn19fYYI9fX1xZeWlk66vV7v88FgsKUqwjnH4uIiKpWKoXXCDupDPJFIoKOjA/39/ZCk5o8XCoUkr9f7vMvj8YRaVby6uoqvv/4anHPHSWyF3+8H5xw3b97E2tpay7IejyfkdrvdDYkUCgU8fPgQbre7pe7kNDo6OlAqlZDL5dDT04MDBw48VsbtdofcsixvI6KqKpaWlqBpmimhcxKyLEOWZaysrCCVSiEej29bfGVZDrllWQ7W/0gmkyiXywgEAnC73U/koVuhbm3evXsXnZ2d6O9/NEfJshzcXIoVRQEhxJSa8aTg8XhACNk2a7o1TSsCj4RrdHQU2WwW6+vr8Hq9LWeLJwHOOSiliMViiEQim/9rmlZ067q+zWUZiUQQiUTw8OFDFAqFPSMniqLg4MGDGBwcfOyarutFFyGkoe+1t7d3U5kjhDj7lC1ACIEkSRgZGUFPT0+zMkU3Y6ypE9ntdmNgYADlcnlTFzLiXRQBTdMAwJBjjzFWdKmqeqlQKOitCnZ2dmJ4eBjhcBiqqlq2IYyAcw5CCCKRCIaHh9uSKBQKuqqql1yapr2/uLi4ZKSRrq4ujI+PC9ez6iCEwOfzYWxsDE899VT7GwAsLi4uaZr2vuv06dPlUql020yDvb29GBwcbOi7sgqv14vBwUH09vaauq9QKCycPn267AaAcrn8X4qivGBmhvJ6vRgaGgLwyB1aH9Nm4XK54PF4Nusyg0qlgnK5/CkAuAEgnU7/YzKZfGN8fNzc66hhdXUVGxsbprUBzjk6OzstW5jJZHJlY2PjZ8AW3+9HH330wfHjx3/f6qzUyNfbDlZ9wcCjUfDZZ5/9y4kTJyaBLV6UbDb71q1bt5KWagVw+PBhUxMAY8yWdXn79u1kPp//0/rvTSLT09MP19fX/9XqbBQOh02tMZIkGZ6ZdkJVVaysrPzb1pjjNv9NPp//ixs3btyyVDuAeDyOarVq6EGardJGcOPGjVulUmlb8Gcbkenp6eL6+voPEomEJRegz+dDIBBou2DWvB9WmkAikUivr6//YGdY+zGP2qlTp96/f//+bCaTaf9qG6C/v79lr6iqir4+aw7NTCZTvX///uypU6fe33mtoWtwcnLy7WvXrv2qWq2a1kUkSUI0GgVj7LFruq7jwIEDlvS1arXKr1279qvJycm3G11v6uPknH/vypUrn1ar1ZZ6WCN0d3c3XCAZY5Zko1qt6leuXPmUc/69ZmWaEpmamiKpVOrFy5cv/yKTyZTNNt7b27stVsIYQ3d3t9lqkMlkypcvX/5FKpV6cWpqqqk9YSg8PT8//1dDQ0NvDgwMmPIPLywsbK72uq6bVkMSicTavXv3/mFqauqH7coa3jDwwQcf/F44HP7bo0ePfqujo8OQDcwYw+3bt+F2u9Hf32945a9Wq/z69es3crnc2y+//PLHRu4xtYVjdnY2EIlE/joWi333mWeeGTGi/S4tLUHXdUNbOCiluHnz5kIqlfplNpv9y5mZmYrRZ7O6qSba1dX1d7FY7PmBgYEjnZ2dbV2urRwZ5XKZJxKJZCqV+jSTyfz5zMyM6XXM1jan2dnZaCgU+sNgMPhCMBgcicfjg+Fw2NPO+8I5Ry6Xo0tLS/dLpdJCqVT6pFgs/twKgTpsEdmKs2fPdnR1dX03EAj8jsfjOeh2uw94PJ6DsiwfAABN0wqMsQKlNE8pzVcqlf/IZDK/fOuttywtvDshjMiThvmg3x7Fr4nsNXxjiNiOHczPz3sZY3+k67qtuggh//faa699bvV+20RWV1el8fHxH46NjVk3+QB88cUXPwfw5IicOXNGvXTpUjkUahmKbInallpr24VqECIjuq6339vUAjUjzNyunB0QRcSWI5hSCl3XLasnwB7qEcbYup06hBDhnNvuEUpp62B6Gwghomma3R5RCCE5O3XsiaFFCFFcLlfBTh17goiqqiql9MkTYYzZkhFCCHG73U+eCOe8oOum3V+boJRSM/Z5I4gS9oyV3dV12J31AHEysmaHiN0FFRBERFGU1Ua+XqMQ0SNCtgDpuu5NJBJ6MBi09GLy+fzBs2fPdthxRAghwjn/OhqNlvr6+h7fFWYA6XR6ya43RcjQopQWKKWWhwfn3NY6BIibtfKEEMtENE3bG8J+5syZIqXU8hYiTdNsbz8S5Xzgdh7GrooDCPSiWNWANU2Drut5u+0LI2JVYGvrjy3rEBDbI5YEtmbmpuy2L4yI1XFOKQUhxJaZC+wBIowxrVKp7P+hRQip2rUOgT3QI5RSRZblPUXEkq6kqiohhOwdIpqmZa2o8oQQGo1GbRMRtpOfEOK7deuW6Q2bmUwmkM1mnwZgOj3CVggjIknSl/F4vOH5jlYol8trJ06csEUCEDi0FEVZYYyZjqyKMHMBscKeU1XV9MwlQmEEBBKRZblAKTU9c4mw1wGBRFwulyXjStd1IUchhBEJBoN5RVFMP9SeG1pTU1PEinElwswFBIenrdgke27WAswTqQVBbfl86xBKxOwwEREEreOJ9gilFIwx27YIIJgIY8wUERFB0DpE94ipoSUiCFrHE+0RSqmqaZrhHFqtIPRArqIoBxYWFgyX39jY4Jqm9QH40m7bQom43e57Q0NDhrNxLCwsFB48eHBZRNtCh5au6ykzkStCCNl5xNYqRK8jKTPmLmOM2A2C1iGUiKIoq2Z6RJR6AggmQilNEUIMd8meJeJyuQqEEMNDRZRRBQgmIklSnhBieC3Zs0TMWomibBFAMJHp6ekSY8ywtIuyDgHx+365mcjVnu0RwNxMtGdnLcDccNnTPWLUuKod77MdBK1DeDqaSqUiG0mSV0vQYn2T1w44scnf0HCphaUzohoV3iMulysTjUbblstms+Cc3xDWrqiK6jC6v5ExpquqajssXYcTwm7IkU0IqWqaZjtSVYcT0++GEZtExF7frXCCSNqITUIIUb1e794lwhgztL+REEI7OzuFmLmAA0QIIauU0rYhOF3XydTUlLWsMA3gRI/kjYTgROpZgDMLYp5S2tZK3BdEVAPJVURah4ADRCKRSMHI/kaRRhXgAJGpqSlikIjQfHCOnAw1osqL7hFHskoWi8WOds7scrlsKRN6MzhCxO/3rw0NDY22KrO8vGw5c1QjOJXnU2nlka8lAxC2qgMOyUi7TWiUUnDOhQR46nCKSEtBruWsE2aLAA4RaWdc1XpESBC0DqeItO2RcrksJAhah1NDq9TqFByllIgKgtbh1IKYbmWTEEKqIrbIboVTQ2u9lZVICLF9EnQnHCFCCFlpQ4RUq9W9v44QQjK0BRPGGBWVaqcOp9KJtDSuRNsigHPC3tLcFa35Ag4R8Xq9BVVVm9obom0RwCGlMRQKsUwm422myhcKhQMXL170t/pSmFk4lpbq0qVL15977rlvNbr2+eeff/LSSy+9KLI9x3IHtbISRXtQAAeJtAqKigy51eFkjzR92H0z/QJte2R/TL9A87VC0zRwzoUFQetwskcaDh8ReYIaYdeHFmNMyEnQnXCSSEOlkFIKVVWFWoeAs7NWw1NwlFKuKMr+6RHO+XoTIkJOgu6EY0QIIQ1zpRBCFNHWIeAgkWq1utYoBEcIUe3mCWoEJ9eRHCHkMYGnlNKVlRWhZi7gnO8Xsiy7l5aWeKGw/eWnUqlAT09PH2yeBN0Jx4hwzu+Hw+H86Ojotk+6VCqVtcnJSaEkAGdTgOZJg68UOWHmAg4SmZmZoY1OwTlhiwAOJ2Vt9PadsEWAJ0DECVsEcJhII3P3G9Mj+1JGGqny+27WAh4fRpxzcM5Nf3DCCHZ1aNWsQyEnQXfCUSI7Q3CMMUiSJNzMBZzvkdJWT2btSKvQIGgdThPZtr+RMeaImQs4qDQCAKW0lM/nN7/HWygUqJkzWGbgNJFcsVjc/F5PsVikmqY58iFSR4noun47FArRWCzmAYByuVz2+XzXnWjL6XWksDUERwghkiQJtw4B53WtbSE4xhgRGdzZCqdnrW2n4JzSswCHibz55ptlQsjm/OuU5gs4/7ULvlWVd8oWAXbhsx1b9S0RyVebYVeJ7FsZAbYT2c8yss242u9Etk6/v5aRdtg1IrVYia0PQbSCo0ojAKiq2plIJEApRaVSsfbFUwNwnAjnPNnd3Y1qtQpZlh3RfIFdGFoul+uhy+WCy+UCpVS4F36zHacqrqMegnMqCFqH40RUVV1ljPFa6kPhOx7qcJxI7RRclRAiJB1uM+yGsOcppRVVVVm1Wt2/RHRdz6uqqjLGtI2NDVtfD2sFx4l4PJ5CLWuT9u677wrLKLATjsvIzMwMZYwRJ9UTYBd6BHhkUOm67ohjro5dIaLrusI5F3bAuBF2s0cckw9gl4homqZomubod293bWg53CG71yPfJCKOeOHr2BUijDEqSZL1L3YZwG7JSFGSJCFpDJtht4ikvylE1lwul9AzVTuxK0QIISuSJDmqa/0/gq0PU/5dNbkAAAAASUVORK5CYII=)
}

.photonui-wnpremotecameracontroller:hover {
    cursor: pointer
}

.photonui-wnpremotecameracontroller .wnp-rcc-icon-container {
    width: 16px;
    height: 16px;
    top: 17px;
    background: 0 0;
    position: relative;
    left: 17px
}

.photonui-wnpremotecameracontroller .wnp-rcc-icon-container.visible {
    background-size: 100%;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAADxUlEQVRYhe2YQW8aVxDH/28xi8NiA64rbFexqUyrYlWBWonqpIdsLzlUiop66i2WMLvHkm/AN6iPBWzJ+QbprSc3yamHLgYf4lY1EuA4sYuLF2MgsOy+HsAbaOPsboirtspIHObxn9nf6r03M1rgX2ZkmGBBEO4AiFBKPXpCQrKqqq6ur68X/zEgQRDcDNu8z03t82Nz+YH/lIYLJ/mP5Jb8TjyVSt2zmtv2OkCLi4vfzXy2GfF88AvsXH3g5/AcY/z930ZrxflI6ONPs5lM5lcruRmrMLFY7JuJhe3lS+8evlLnDebAMMyq1fyWgRi2nZgI5gx143N5sO6KPxaL3bwwIFEUQw73scdY2bVLkwcghPAXBqRpmmkYAGBYxYq8G2NJzDCyFb3WtlujgUWgZDKZa1e9BdXkg+rPZkEpfXBhQACgKY5ENb9gqDspzqPTcBXS6fRDK/kt1yFJknILs1/4QUiYdVfA2LS/aZplHyrbV2W1zX6dyWQsVWzLQKIohiilo8+Ppn5qHL7HE5sKTWHRabjQabhQ3Q2ivLWUVRV2mRDiD4fD8tbWVtVsfkutQxCEb1l3Jc7Y22iWfTKAAgA/IUS/fZTSLACZEMKPTh5AbXCy0hgz3UZMAwmCcMc5XdqYvv4AAKC27aiVAqg/vTygY+xtcDN7GO/rccUfvoJS53gz52nELBCABDezpzs2VoEnsANPYMcwcGwuj8rjKwkAnxtpTd2ylZWVL0ecp/7+t/795xvn6luyF/JuUPfd849hYxVeFMXQGwEihCSmln7U/frTy6iVAufqNYXFH9vXcFavbKwCbroETdP4oYGi0eicjVXCDs+xvnZSnDcKA4AB6N52Lw8NxDBMZHTyQPfVth2NZ7PmgPrAuZk92FglbLRtZrYs0j/79NpB1iiIUpptVyeg1LkXUN1tiw8FRAjhuemS7ld3gyCEmBm8ZErpRrXvcPfGXf9QQGdvCnRbQkv2yoSQ7IjzVNcodQ4t2av7I85TEEL8ADZqpYB+uHs1qzAsUOJo+xr2H91CWbohE0LimqZ5+oGOd0J4snn7/lHuKgDAztUBwJ9Opx9qCrv6ZPM29h/dQq0UMBxrDYHW1ta+V+oc3yz7+E5znH9ZC+jdppeeq1QqdfcsnnYc4WQy+cr511SlNjtCnDchWhlBLM9DF21vgYzsLZCR/T+AGIaROw0XgG6zpZTKAArNsu+va5bttb5+SJJ0+MmV655m2bdUK3woqy1nPJVK3QsFbw6sSZJk/BHgTZooiqFoNDpntPaftj8BRtKXENACsR4AAAAASUVORK5CYII=)
}

.photonui-slider.photonui-wnpverticalslider {
    flex-direction: column;
    width: 30px;
    height: 50px;
    position: relative
}

.photonui-slider.photonui-wnpverticalslider .photonui-slider-slider {
    width: 8px;
    height: 100%;
    min-width: 1px;
    min-height: 10px
}

.photonui-slider.photonui-wnpverticalslider .photonui-slider-slider .photonui-slider-grip {
    width: 29px;
    height: 15px;
    background-image: none;
    border-radius: 4px
}

.photonui-slider.photonui-wnpverticalslider .photonui-slider-slider:before {
    margin: 0 0 0 8px;
    width: 100%;
    height: 100%
}

.photonui-slider.photonui-wnpverticalslider .photonui-numericfield {
    min-width: 30px;
    margin: auto
}

.photonui-wnpstartscreentile {
    width: 150px;
    position: relative;
    box-shadow: none;
    border: 1px solid #ccc;
    transition: all .2s;
    -webkit-transition: all .2s
}

.photonui-wnpstartscreentile:hover {
    cursor: pointer;
    box-shadow: 0 0 5px #ccc;
    border: 1px solid #89b808
}

.photonui-wnpstartscreentile .title {
    display: block;
    text-align: center;
    font-weight: 600;
    font-size: small;
    color: #666;
    padding: 14px;
    border-top: 1px solid #ccc;
    background: #fff;
    min-height: 23px;
    vertical-align: middle
}

.photonui-wnpstartscreentile div {
    background: #fff
}

.photonui-wnpstartscreentile img {
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle
}

.wnp-standalone #sa_loadList .sa_screenshot img {
    width: 100px !important;
    height: 60px !important;
    border: 1px solid #ddd
}

.wnp-standalone #sa_loadList .sa_label {
    display: inline-block !important;
    width: 300px !important;
    overflow: hidden;
    text-align: center;
    max-height: 30px
}

.wnp-standalone #sa_loadList .sa_load-item {
    -webkit-transition: all .3s;
    transition: all .3s;
    padding: 10px 5px;
    cursor: pointer
}

.wnp-standalone #sa_loadList .sa_load-item:hover {
    -webkit-transition: all .3s;
    transition: all .3s;
    background-color: #ccc
}

.wnp-standalone #sa_loadList .sa_close {
    width: 32px;
    height: 32px;
    border: 0;
    background: 0 0;
    -webkit-transition: all .3s;
    transition: all .3s
}

.wnp-standalone #sa_loadList .sa_close:hover {
    transition: all .3s;
    -webkit-transition: rotateZ(90deg);
    transform: rotateZ(90deg)
}

#debugArea {
    background: rgba(0, 0, 0, .7);
    color: #fff;
    position: fixed;
    bottom: 0;
    height: auto;
    z-index: 999999;
    width: 100%;
    font-style: normal;
    box-shadow: 0 -1px 10px rgba(0, 0, 0, .5);
    max-height: 150px;
    overflow: auto
}

#debugArea div {
    padding: 5px;
    border-bottom: rgba(255, 255, 255, .5) dashed 1px
}

#debugArea div:last-child {
    border-bottom: none
}

.scrollable {
    overflow-x: hidden;
    overflow-y: auto
}

.wnp-iframeWindow.noTopbar .photonui-window-title {
    display: none
}

#wnp-savedialog-saveoverlay {
    width: 100%;
    height: 100%;
    z-index: 1001;
    position: absolute;
    background-color: rgba(10, 10, 10, .5);
    top: 0;
    left: 0
}

#wnp-savedialog-saveoverlay img {
    position: absolute;
    top: 45%;
    left: 45%
}

#wnp-material-parameters-icon {
    z-index: 999999
}

.lockComponent-icon-mobile {
    position: absolute;
    top: 45px;
    left: 25px;
    display: block;
    width: 42px
}

.lockComponent-icon-mobile:hover {
    transform: scale(1.1);
    transition: all .2s;
    -webkit-transition: all .2s
}

#wnp-remotecontroller {
    background-color: transparent !important
}

#wnp-remotecontroller .photonui-slider-grip {
    width: 25px;
    height: 12px;
    margin-left: 4px;
    border: 1px solid #6e910f;
    background: #89b808
}

#wnp-remotecontroller-slider .photonui-slider-slider {
    width: 20px
}

#wnp-remotecontroller-slider .photonui-slider-slider:before {
    background: url(../images/remote-controller/bg.png) no-repeat;
    background-position: 58% 92% !important
}

#wnp-edition-controller {
    width: 57px;
    min-height: 150px;
    border-radius: 46px 0 0 46px;
    border: 1px solid;
    opacity: .5;
    position: absolute;
    transition: all .2s;
    -webkit-transition: all .2s;
    margin-left: 0;
    top: 25%;
    z-index: -1
}

#wnp-edition-controller .photonui-button:hover {
    background: 0 0;
    border: 0 !important;
    box-shadow: none
}

#wnp-edition-controller .photonui-button:hover span {
    border: 0 !important;
    border-radius: 0 !important
}

#wnp-edition-controller:hover {
    opacity: 1
}

#wnp-edition-controller .icon {
    font-size: 25px
}

#wnp-edition-controller .photonui-slider-slider {
    margin: 0 0 0 6px
}

#wnp-edition-controller .photonui-slider-slider:before {
    width: 14px;
    border-radius: 5px;
    background-color: #eee
}

#wnp-edition-controller .photonui-slider-grip {
    margin-left: 1px
}

#wnp-edition-controller.single {
    border-color: #6e910f;
    background-color: #89b808;
    height: 350px
}

#wnp-edition-controller.single .wnp-edc-group {
    display: none
}

#wnp-edition-controller.show {
    margin-left: -59px
}

#wnp-edition-controller.group {
    border-color: #af6b00;
    background-color: #d08c00;
    height: 400px
}

#wnp-edition-controller.group .wnp-edc-group {
    display: block
}

#wnp-backgroundWindow-canvas canvas {
    background-color: #fff;
    border: 1px solid #bbb;
    border-radius: 2px;
    margin: 0 0 10px 10px
}

.warning {
    background: #f6f5d5;
    color: #e88d5c;
    border: 1px solid #e88d5c;
    border-radius: 5px;
    padding: 10px
}

#colorWindow .photonui-container.photonui-window-content {
    overflow-y: auto;
    text-align: center;
    border-bottom: #ccc solid 1px
}

#colorWindow .luxens {
    display: inline-block;
    cursor: pointer;
    margin-right: 3px;
    margin-bottom: 3px;
    width: 22px;
    height: 22px;
    border: 2px solid #fff;
    box-shadow: 0 0 1px rgba(0, 0, 0, .3);
    transition: all .1s;
    -webkit-transition: all .1s
}

#colorWindow .luxens:hover {
    transform: scale(1.4);
    -webkit-transform: scale(1.4)
}

#colorWindow .luxens .selected {
    transform: scale(1.4);
    -webkit-transform: scale(1.4);
    outline: #89b808 solid 2px;
    box-shadow: none
}

.wnp-floor-controller {
    /* max-width:80% */
}

.wnp-infocomponent2D-container {
    cursor: pointer;
    background: #89b808;
    border-top: none;
    padding: 5px 10px 5px 30px;
    overflow: hidden;
    color: #fff;
    font-size: 10pt;
    line-height: 20px;
    font-family: Arial, sans-serif;
    border-radius: 0 0 0 46px;
    box-shadow: 0 0 8px rgba(0, 0, 0, .4);
    position: absolute;
    top: 47px;
    right: 260px
}

.wnp-infocomponent2D-container .photonui-label {
    text-shadow: none;
    color: #fff;
    cursor: pointer
}

#wnp-infos2D-window {
    background-color: #dedede
}

#wnp-infos2D-window .wnp-infos2D-header,
#wnp-infos2D-window table {
    border: 1px solid #999
}

#wnp-infos2D-window .wnp-infos2D-header {
    padding: 15px;
    background: 1px #fff
}

#wnp-infos2D-window .bold {
    font-weight: 700
}

#wnp-infos2D-window table td {
    background-color: #fff;
    padding: 10px !important
}

#wnp-infos2D-window table tr:first-child {
    border-bottom: 1px solid #ccc;
    font-weight: 700
}

#wnp-infos2D-window .photonui-gridlayout-lastrow {
    background-color: #dedede;
    border-top: 1px solid #ccc
}

#printComponentDialog .photonui-tablayout-content {
    background-color: #797979
}

#printComponentDialog canvas,
body,
html {
    background-color: #fff
}

body,
html {
    overflow: hidden;
    margin: 0;
    padding: 0;
    border: 0;
    width: 100%;
    height: 100%;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: none;
    font-family: arial;
    font-size: 14px
}

body:-moz-full-screen,
body:-webkit-full-screen {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background-color: #fff;
    text-align: center
}

#scripts {
    display: none
}

.clear {
    clear: both
}

.left {
    float: left
}

.right {
    float: right
}

.drawableSurface canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.drawableSurface.with-menu canvas {
    -webkit-width: calc(100% - 260px);
    width: calc(100% - 260px);
    height: 100%
}

canvas.brush {
    cursor: url(../images/cursor_brush.cur), auto !important
}

canvas.lockedbrush {
    cursor: url(../images/cursor_locked_brush.cur), auto !important
}

canvas.eraser {
    cursor: url(../images/cursor_eraser.cur), auto !important
}

#main-ui {
    position: absolute;
    right: 0;
    width: 260px;
    height: 100%;
    top: 0;
    z-index: 1000
}

#main-ui ul {
    margin: 0;
    padding: 0
}

#screenshot-flash {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    z-index: 99999;
    background: #fff;
    opacity: 0;
    pointer-events: none;
    transition: opacity ease-in 200ms
}

@keyframes loading {

    0%,
    20% {
        width: 0
    }

    70% {
        width: 70%
    }

    80%,
    90% {
        width: 80%
    }

    100% {
        width: 100%
    }
}

@-webkit-keyframes loading {

    0%,
    20% {
        width: 0
    }

    30% {
        width: 10%
    }

    40%,
    45% {
        width: 50%
    }

    70% {
        width: 70%
    }

    80%,
    90% {
        width: 80%
    }

    100% {
        width: 100%
    }
}

#splashscreen {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(255, 255, 255, .9);
    z-index: 42000
}

#splashscreen .splash-text {
    position: absolute;
    width: 400px;
    top: 40%;
    left: 50%;
    margin-left: -234px;
    border: 4px solid #fff;
    padding: 30px;
    text-align: center;
    font-size: 22pt;
    box-shadow: 0 0 10px rgba(0, 0, 0, .3);
    border-radius: 5px;
    color: #333;
    pointer-events: none;
    background: #f1f1f1;
    background: -moz-linear-gradient(top, #f1f1f1 0, #e5e5e5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f1f1f1), color-stop(100%, #e5e5e5));
    background: -webkit-linear-gradient(top, #f1f1f1 0, #e5e5e5 100%);
    background: -o-linear-gradient(top, #f1f1f1 0, #e5e5e5 100%);
    background: -ms-linear-gradient(top, #f1f1f1 0, #e5e5e5 100%);
    background: linear-gradient(to bottom, #f1f1f1 0, #e5e5e5 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@wanaplan-header-textColor', endColorstr='#e5e5e5', GradientType=0)
}

#splashscreen .splash-bar {
    height: 12px;
    border: 1px solid #6e910f;
    margin-top: 20px;
    border-radius: 3px;
    padding: 1px;
    background: #f1f1f1
}

#splashscreen .splash-bar div {
    background: #89b808;
    height: 100%;
    border-radius: 2px;
    width: 100%;
    animation: loading 5s linear;
    -webkit-animation: loading 5s linear
}

.photonui-switch .green input:disabled+span:after,
.photonui-switch .green input:disabled+span:before {
    background: #ddd;
    border-color: #aaa;
    cursor: default;
    box-shadow: none
}

#splashscreen .splash-error-message {
    position: absolute;
    left: 38%;
    top: 90%;
    font-size: 16px
}

.photonui-switch .green input:disabled+span:focus {
    cursor: default
}

.photonui-button-appearance-flat.invisible:focus:hover,
.photonui-button-appearance-flat.invisible:focus:hover:focus,
.photonui-button-appearance-flat.invisible:hover,
.photonui-button-appearance-flat.invisible:hover:focus {
    border-color: transparent;
    background: 0 0;
    box-shadow: none;
    transition: border-color 0, box-shadow .1s;
    outline: #ccc dashed 1px
}

.photonui-button-appearance-flat.invisible:focus,
.photonui-button-appearance-flat.invisible:focus:not(:hover) {
    border-color: transparent;
    background: 0 0;
    box-shadow: none;
    transition: border-color 0, box-shadow .1s;
    outline: 0
}

.photonui-button-appearance-flat.invisible span span i:before {
    color: #666
}

#info2D {
    height: 40px;
    padding: 0 40px;
    line-height: 45px;
    position: absolute;
    bottom: 0;
    left: 50%;
    text-align: center;
    transition: height .1s;
    color: #fff
}

#info2D.manualOpposite {
    background: #333;
    color: #eee
}

#info2D.nonParallel {
    background: #FEF86C;
    color: #F4661B
}

#info2D.hidden {
    height: 0
}

#wnp-startscreen {
    background: #eee
}

#wnp-startscreen .photonui-window-title {
    font-size: 100%
}

#wnp-startscreen .title1 {
    text-align: center
}

.photonui-window-modalbox {
    background: rgba(0, 0, 0, .7)
}

.wnp-shoppinglist-subproduct {
    margin-left: 5px;
    padding-left: 5px;
    border-left: #CCC solid 4px;
    height: 100%;
    font-style: italic
}

i.tooltip {
    outline: 0;
    position: absolute;
    z-index: 0;
    margin-top: -80px;
    margin-left: -30px
}

.wnp-shoppinglist-subproduct i.tooltip {
    margin-top: -40px;
    margin-left: -35px
}

i.tooltip:hover {
    text-decoration: none;
    z-index: 10
}

i.tooltip span {
    display: none;
    padding: 14px 20px;
    margin-top: 40px;
    margin-left: -160px;
    width: 400px;
    line-height: 16px;
    background: #fff;
    box-shadow: 5px 5px 8px #CCC
}

i.tooltip:hover span {
    display: inline-block;
    position: absolute;
    color: #111;
    border: 1px solid #A5A5A5;
    background: #fff
}


.notFound {
    text-align: center;
    font-size: 18px;
    width: 100%;
    margin-top: 100px;
    margin-left: 50px;
}

div.planItem {
    cursor: pointer;
    background: #fafafa;
    margin: 10px;
    border: 1px solid #CCC;
    position: relative;
}

div.planItem img {
    width: 288px
}

div.planItem p {
    border-top: 1px solid #CCC;
    padding: 5px;
    margin: 0px;
    color: #333;
    background: #FFF;
}

div.planItem div.toolbarPlan {
    display: none;
    background: #CCC;
    position: absolute;
    right: 0px;
    top: 0px;
    color: #222;
    opacity: 0.9;
    z-index: 9999;
}

div.planItem div.toolbarPlan .fa {
    padding: 5px;
}

div.planItem div.toolbarPlan .fa-times {
    padding-left: 15px;
}

div.planItem:hover div.toolbarPlan {
    display: block;
}

div.planItem div.overall {
    background: #222;
    opacity: 0.8;
    width: 100%;
    height: 100%;
    color: #FFF;
    top: 0px;
    position: absolute;
    text-align: center;
    vertical-align: middle;
}

div.planItem div.editForm {
    width: 100%;
    height: 100%;
    color: #FFF;
    top: 60px;
    position: absolute;
    text-align: center;
    vertical-align: middle;
}

div.planItem .editPlanInput {
    height: 30px;
    width: 90%;
    font-size: 15px;
    border: 1px solid #999;
}

div.planItem div.overall span {
    font-size: 16px;
}

div.planItem .overall-cercle {
    opacity: 1;
    padding-left: 0;
    padding-right: 0;
    margin-left: auto;
    margin-right: auto;
    bottom: 25px;
    width: 100%;
    position: absolute;
}

div.planItem div.editForm .window-action-bar {
    margin-top: 10px;
    text-align: right;
}