:root {

    /*<editor-fold defaultstate="collapsed" desc="body">*/

    --body-display : block ;
    --body-margin-width : 0px ;
    --body-border-width : 0px ;
    --body-outline-width : 0px ;
    --body-padding-width : 1em ;

    --body-position : relative ;
    --body-top : 0px ;
    --body-left : 0px ;
    --body-transform : none ;
    --body-filter : none ;

    --body-box-sizing : content-box ;
    --body-width : calc(100% - (var(--body-padding-width) * 2)) ;
    --body-height : 100% ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="header">*/

    --header-display : block ;
    --header-margin-width : 0px ;
    --header-border-width : 0px ;
    --header-outline-width : 0px ;
    --header-padding-width : 1em ;

    --header-position : fixed ;
    --header-top : unset ;
    --header-left : unset ;
    --header-transform : none ;
    --header-filter : none ;

    --header-box-sizing : content-box ;
    --header-width : var(--body-width) ;
    --header-height : 60px ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="nav">*/

    --nav-display : block ;
    --nav-margin-width : 0px ;
    --nav-border-width : 0px ;
    --nav-outline-width : 0px ;
    --nav-padding-width : 1em ;

    --nav-position : fixed ;
    --nav-top : calc(var(--header-height) + var(--header-padding-width)) ;
    --nav-left : unset ;
    --nav-transform : none ;
    --nav-filter : none ;

    --nav-box-sizing : content-box ;
    --nav-width : var(--body-width) ;
    --nav-height : calc(var(--ui-listitem-height)) ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="main">*/

    --main-display : block ;
    --main-margin-width : auto ;
    --main-border-width : 0px ;
    --main-outline-width : 0px ;
    --main-padding-width : 0px ;

    --main-position : relative ;
    --main-top : calc((var(--header-height) + var(--header-padding-width)) + (var(--nav-height) + (var(--nav-padding-width) * 2))) ;
    --main-left : unset ;
    --main-transform : none ;
    --main-filter : none ;

    --main-box-sizing : content-box ;
    --main-width : 1600px ;
    --main-height : auto ;

    /*</editor-fold>*/

    /*<editor-fold defaultstate="collapsed" desc="ui-list">*/

    --ui-list-display : block ;
    --ui-list-margin-width : 0px ;
    --ui-list-border-width : 0px ;
    --ui-list-outline-width : 0px ;
    --ui-list-padding-width : 0px ;

    --ui-list-position : relative ;
    --ui-list-top : unset ;
    --ui-list-left : unset ;
    --ui-list-transform : none ;
    --ui-list-filter : none ;

    --ui-list-box-sizing : content-box ;
    --ui-list-width : auto ;
    --ui-list-height : auto ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="ui-listitem">*/

    --ui-listitem-display : inline-block ;
    --ui-listitem-margin-width : 0px ;
    --ui-listitem-border-width : 0px ;
    --ui-listitem-outline-width : 0px ;
    --ui-listitem-padding-width : 0.5em ;

    --ui-listitem-position : relative ;
    --ui-listitem-top : unset ;
    --ui-listitem-left : unset ;
    --ui-listitem-transform : none ;
    --ui-listitem-filter : none ;

    --ui-listitem-box-sizing : content-box ;
    --ui-listitem-width : auto ;
    --ui-listitem-height : 2.2em ;

    /*</editor-fold>*/

    /*<editor-fold defaultstate="collapsed" desc="ui-dialogcontainer">*/

    --ui-dialogcontainer-display : grid ;
    --ui-dialogcontainer-margin-width : 0px ;
    --ui-dialogcontainer-border-width : 0px ;
    --ui-dialogcontainer-outline-width : 0px ;
    --ui-dialogcontainer-padding-width : 0px ;

    --ui-dialogcontainer-position : fixed ;
    --ui-dialogcontainer-top : 0px ;
    --ui-dialogcontainer-left : 0px ;
    --ui-dialogcontainer-transform : none ;
    --ui-dialogcontainer-filter : none ;

    --ui-dialogcontainer-box-sizing : content-box ;
    --ui-dialogcontainer-width : 100% ;
    --ui-dialogcontainer-height : 100% ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="ui-dialogoverlay">*/

    --ui-dialogoverlay-display : block ;
    --ui-dialogoverlay-margin-width : 0px ;
    --ui-dialogoverlay-border-width : 0px ;
    --ui-dialogoverlay-outline-width : 0px ;
    --ui-dialogoverlay-padding-width : 0px ;

    --ui-dialogoverlay-position : fixed ;
    --ui-dialogoverlay-top : 0px ;
    --ui-dialogoverlay-left : 0px ;
    --ui-dialogoverlay-transform : none ;
    --ui-dialogoverlay-filter : none ;

    --ui-dialogoverlay-box-sizing : content-box ;
    --ui-dialogoverlay-width : 100% ;
    --ui-dialogoverlay-height : 100% ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="ui-dialog">*/

    --ui-dialog-display : block ;
    --ui-dialog-margin-width : 0px ;
    --ui-dialog-border-width : 0.25em ;
    --ui-dialog-outline-width : 0px ;
    --ui-dialog-padding-width : 0px ;

    --ui-dialog-position : fixed ;
    --ui-dialog-top : 50% ;
    --ui-dialog-left : 50% ;
    --ui-dialog-transform : translateX(-50%) translateY(-50%) ;
    --ui-dialog-filter : none ;

    --ui-dialog-box-sizing : content-box ;
    --ui-dialog-width : 44em ;
    --ui-dialog-height : unset ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="ui-dialogtitlebar">*/

    --ui-dialogtitlebar-display : flex ;
    --ui-dialogtitlebar-margin-width : 0px ;
    --ui-dialogtitlebar-border-width : var(--ui-dialog-border-width) ;
    --ui-dialogtitlebar-outline-width : 0px ;
    --ui-dialogtitlebar-padding-width : 0px ;

    --ui-dialogtitlebar-position : relative ;
    --ui-dialogtitlebar-top : unset ;
    --ui-dialogtitlebar-left : unset ;
    --ui-dialogtitlebar-transform : none ;
    --ui-dialogtitlebar-filter : none ;

    --ui-dialogtitlebar-box-sizing : content-box ;
    --ui-dialogtitlebar-width : unset ;
    --ui-dialogtitlebar-height : unset ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="ui-dialogcontent">*/

    --ui-dialogcontent-display : flex ;
    --ui-dialogcontent-margin-width : 0.5em ;
    --ui-dialogcontent-border-width : 0px ;
    --ui-dialogcontent-outline-width : 0px ;
    --ui-dialogcontent-padding-width : 0px ;

    --ui-dialogcontent-position : relative ;
    --ui-dialogcontent-top : unset ;
    --ui-dialogcontent-left : unset ;
    --ui-dialogcontent-transform : none ;
    --ui-dialogcontent-filter : none ;

    --ui-dialogcontent-box-sizing : content-box ;
    --ui-dialogcontent-width : unset ;
    --ui-dialogcontent-height : unset ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="ui-dialogfooter">*/

    --ui-dialogfooter-display : grid ;
    --ui-dialogfooter-margin-width : 0.5em ;
    --ui-dialogfooter-border-width : 0px ;
    --ui-dialogfooter-outline-width : 0px ;
    --ui-dialogfooter-padding-width : 0px ;

    --ui-dialogfooter-position : relative ;
    --ui-dialogfooter-top : unset ;
    --ui-dialogfooter-left : unset ;
    --ui-dialogfooter-transform : none ;
    --ui-dialogfooter-filter : none ;

    --ui-dialogfooter-box-sizing : content-box ;
    --ui-dialogfooter-width : unset ;
    --ui-dialogfooter-height : unset ;

    /*</editor-fold>*/
    /*<editor-fold defaultstate="collapsed" desc="ui-select">*/

    --ui-select-display : inline-flex ;
    --ui-select-margin-width : 0px ;
    --ui-select-border-width : 0px ;
    --ui-select-outline-width : 0px ;
    --ui-select-padding-width : 0px ;

    --ui-select-position : relative ;
    --ui-select-top : unset ;
    --ui-select-left : unset ;
    --ui-select-transform : none ;
    --ui-select-filter : none ;

    --ui-select-box-sizing : content-box ;
    --ui-select-width : auto ;
    --ui-select-height : auto ;

    /**//*</editor-fold>*/

}

html {

    height : 100% ;

}
body {

    display : var(--body-display) ;
    margin : var(--body-margin-width) ;
    margin : 0px ;
    border : solid var(--body-border-width) ;
    border : none ;
    outline : solid var(--body-outline-width) ;
    outline : none ;
    padding : 0 var(--body-padding-width) 0 var(--body-padding-width) ;

    position : var(--body-position) ;
    top : var(--body-top) ;
    left : var(--body-left) ;
    transform : var(--body-transform) ;
    filter : var(--body-filter) ;

    box-sizing : var(--body-box-sizing) ;
    width : var(--body-width) ;
    height : var(--body-height ) ;

}
header {

    display : var(--header-display) ;
    margin : var(--header-margin-width) ;
    margin : 0px ;
    border : solid var(--header-border-width) ;
    border : none ;
    outline : solid var(--header-outline-width) ;
    outline : none ;
    padding : var(--header-padding-width) 0 0 0 ;

    position : var(--header-position) ;
    top : var(--header-top) ;
    left : var(--header-left) ;
    transform : var(--header-transform) ;
    filter : var(--header-filter) ;

    box-sizing : var(--header-box-sizing) ;
    width : var(--header-width) ;
    height : var(--header-height) ;

}
header img {

    width : auto ;
    height : var(--header-height) ;

}
nav {

    display : var(--nav-display) ;
    margin : var(--nav-margin-width) ;
    margin : 0px ;
    border : solid var(--nav-border-width) ;
    border : none ;
    outline : solid var(--nav-outline-width) ;
    outline : none ;
    padding : var(--nav-padding-width) 0 var(--nav-padding-width) 0 ;

    position : var(--nav-position) ;
    top : var(--nav-top) ;
    left : var(--nav-left) ;
    transform : var(--nav-transform) ;
    filter : var(--nav-filter) ;

    box-sizing : var(--nav-box-sizing) ;
    width : var(--nav-width) ;
    height : var(--nav-height) ;

}
nav > ui-list > ui-menu {

    display: inline-block ;

}
nav > ui-list > ui-menu > ui-list {

    position: absolute ;
    width : max-content ;

}
nav > ui-list > ui-menu > ui-list ui-menu {

    display: block

}
main {

    display : var(--main-display) ;
    margin : var(--main-margin-width) ;
    margin : 0px ;
    border : solid var(--main-border-width) ;
    border : none ;
    outline : solid var(--main-outline-width) ;
    outline : none ;
    padding : var(--main-padding-width) ;
    padding : 0px ;

    position : var(--main-position) ;
    top : var(--main-top) ;
    left : var(--main-left) ;
    transform : var(--main-transform) ;
    filter : var(--main-filter) ;

    box-sizing : var(--main-box-sizing) ;
    max-width : var(--main-width) ;
    height : var(--main-height) ;

}

ui-list {

    display : var(--ui-list-display) ;
    margin : var(--ui-list-margin-width) ;
    margin : 0px ;
    border : solid var(--ui-list-border-width) ;
    border : none ;
    outline : solid var(--ui-list-outline-width) ;
    outline : none ;
    padding : var(--ui-list-padding-width) ;
    padding : 0px ;

    position : var(--ui-list-position) ;
    top : var(--ui-list-top) ;
    left : var(--ui-list-left) ;
    transform : var(--ui-list-transform) ;
    filter : var(--ui-list-filter) ;

    box-sizing : var(--ui-list-box-sizing) ;
    width : var(--ui-list-width) ;
    height: var(--ui-list-height) ;

}
ui-text , ui-label , ui-button , ui-listitem , ui-menu  , label , input , button {

    display : var(--ui-listitem-display) ;
    margin : var(--ui-listitem-margin-width) ;
    margin : 0px ;
    border : solid var(--ui-listitem-border-width) ;
    border : none ;
    outline : solid var(--ui-listitem-outline-width) ;
    outline : none ;
    padding : 0 var(--ui-listitem-padding-width) 0 var(--ui-listitem-padding-width) ;

    position : var(--ui-listitem-position) ;
    top : var(--ui-listitem-top) ;
    left : var(--ui-listitem-left) ;
    transform : var(--ui-listitem-transform) ;

    box-sizing : var(--ui-listitem-box-sizing) ;
    width : var(--ui-listitem-width) ;
    line-height : var(--ui-listitem-height) ;

}
ui-menu , ui-menu > ui-list {

    display : block ;
    display : none

}
ui-button {

    cursor : pointer ;
    text-align : center

}

ui-dialogcontainer {

    display : var(--ui-dialogcontainer-display) ;
    margin : var(--ui-dialogcontainer-margin-width) ;
    margin : 0px ;
    border : solid var(--ui-dialogcontainer-border-width) ;
    border : none ;
    outline : solid var(--ui-dialogcontainer-outline-width) ;
    outline : none ;
    padding : var(--ui-dialogcontainer-padding-width) ;
    padding : 0px ;

    position : var(--ui-dialogcontainer-position) ;
    top : var(--ui-dialogcontainer-top) ;
    left : var(--ui-dialogcontainer-left) ;
    transform : var(--ui-dialogcontainer-transform) ;
    filter : var(--ui-dialogcontainer-filter) ;

    box-sizing : var(--ui-dialogcontainer-box-sizing) ;
    width : var(--ui-dialogcontainer-width) ;
    height : var(--ui-dialogcontainer-height ) ;

    z-index : 500

}
ui-dialogoverlay {

    display : var(--ui-dialogoverlay-display) ;
    margin : var(--ui-dialogoverlay-margin-width) ;
    margin : 0px ;
    border : solid var(--ui-dialogoverlay-border-width) ;
    border : none ;
    outline : solid var(--ui-dialogoverlay-outline-width) ;
    outline : none ;
    padding : var(--ui-dialogoverlay-padding-width) ;
    padding : 0px ;

    position : var(--ui-dialogoverlay-position) ;
    top : var(--ui-dialogoverlay-top) ;
    left : var(--ui-dialogoverlay-left) ;
    transform : var(--ui-dialogoverlay-transform) ;
    filter : var(--ui-dialogoverlay-filter) ;

    box-sizing : var(--ui-dialogoverlay-box-sizing) ;
    width : var(--ui-dialogoverlay-width) ;
    height : var(--ui-dialogoverlay-height ) ;

    z-index : 501

}
.ui-dialog {

    display : var(--ui-dialog-display) ;
    margin : var(--ui-dialog-margin-width) ;
    margin : 0px ;
    border : solid var(--ui-dialog-border-width) ;
    outline : solid var(--ui-dialog-outline-width) ;
    outline : none ;
    padding : var(--ui-dialog-padding-width) ;
    padding : 0px ;

    position : var(--ui-dialog-position) ;
    top : var(--ui-dialog-top) ;
    left: var(--ui-dialog-left) ;
    transform: var(--ui-dialog-transform) ;
    filter: var(--ui-dialog-filter) ;

    box-sizing : var(--ui-dialog-box-sizing) ;
    width : var(--ui-dialog-width) ;
    height : var(--ui-dialog-height) ;

    z-index : 502

}
ui-dialogtitlebar {

    display : var(--ui-dialogtitlebar-display) ;
    margin : var(--ui-dialogtitlebar-margin-width) ;
    margin : 0px ;
    border-bottom : var(--ui-dialogtitlebar-border-width) ;
    outline : solid var(--ui-dialogtitlebar-outline-width) ;
    outline : none ;
    padding : var(--ui-dialogtitlebar-padding-width) ;
    padding : 0px ;

    position : var(--ui-dialogtitlebar-position) ;
    top : var(--ui-dialogtitlebar-top) ;
    left: var(--ui-dialogtitlebar-left) ;
    transform: var(--ui-dialogtitlebar-transform) ;
    filter: var(--ui-dialogtitlebar-filter) ;

    box-sizing : var(--ui-dialogtitlebar-box-sizing) ;
    width : var(--ui-dialogtitlebar-width) ;
    height : var(--ui-dialogtitlebar-height) ;

}
ui-dialogtitlebar ui-label {

    width : 100%

}
ui-dialogtitlebar ui-button {

    padding : 0px ;
    width : var(--ui-listitem-height)

}
ui-dialogcontent , ui-dialogmessage {

    display : var(--ui-dialogcontent-display) ;
    margin : var(--ui-dialogcontent-margin-width) ;
    border : solid var(--ui-dialogcontent-border-width) ;
    border : none ;
    outline : solid var(--ui-dialogcontent-outline-width) ;
    outline : none ;
    padding : var(--ui-dialogcontent-padding-width) ;
    padding : 0px ;

    position : var(--ui-dialogcontent-position) ;
    top : var(--ui-dialogcontent-top) ;
    left: var(--ui-dialogcontent-left) ;
    transform: var(--ui-dialogcontent-transform) ;
    filter: var(--ui-dialogcontent-filter) ;

    box-sizing : var(--ui-dialogcontent-box-sizing) ;
    width : var(--ui-dialogcontent-width) ;
    max-height : var(--ui-dialogcontent-height) ;

}
ui-dialogfooter {

    display : var(--ui-dialogfooter-display) ;
    margin : var(--ui-dialogfooter-margin-width) ;
    margin : 0px ;
    border : solid var(--ui-dialogfooter-border-width) ;
    border : none ;
    outline : solid var(--ui-dialogfooter-outline-width) ;
    outline : none ;
    padding : var(--ui-dialogfooter-padding-width) ;
    padding : 0px ;

    position : var(--ui-dialogfooter-position) ;
    top : var(--ui-dialogfooter-top) ;
    left: var(--ui-dialogfooter-left) ;
    transform: var(--ui-dialogfooter-transform) ;
    filter: var(--ui-dialogfooter-filter) ;

    box-sizing : var(--ui-dialogfooter-box-sizing) ;
    width : var(--ui-dialogfooter-width) ;
    height : var(--ui-dialogfooter-height) ;

}

ui-select {

    display : var(--ui-select-display) ;
    margin : var(--ui-select-margin-width) ;
    margin : 0px ;
    border : solid var(--ui-select-border-width) ;
    border : none ;
    outline : solid var(--ui-select-outline-width) ;
    outline : none ;
    padding : var(--ui-select-padding-width) ;
    padding : 0px ;

    position : var(--ui-select-position) ;
    top : var(--ui-select-top) ;
    left : var(--ui-select-left) ;
    transform : var(--ui-select-transform) ;
    filter : var(--ui-select-filter) ;

    box-sizing : var(--ui-select-box-sizing) ;
    width : var(--ui-select-width) ;
    height : var(--ui-select-height ) ;

}
ui-select input {

    width : 100%

}
ui-select ui-list {

    display : none ;
    overflow : auto ;

    position : absolute ;
    top : var(--ui-listitem-height) ;

    width : 100% ;
    max-height : 14em ;

}
ui-select ui-list ui-listitem {

    display : flex

}