*
{
    margin:0;
    padding:0;
    box-sizing: border-box;
    user-select:none;
}

html, body, form, #Component_0, .AppContainer
{
    width:100%;
    height:100%;
    font-family:arial;
    overflow:hidden;
}

.TabbedLayout
{
    width:100%;
    height:100%;
    display:flex;
    flex-direction: column;
}

.TabbedLayout_content
{
    flex-grow:1;
    animation: fadeIn 0.1s forwards;
    width:100%;
    height:0;
    overflow:auto;
}

.TabbedLayout_content-menu
{
    animation: none;
}

@keyframes fadeIn
{
    0%{
        opacity:0.8;
        transform:translateY(-200px);
    }

    100%{
        opacity:1;
    }
}

.TabbedLayout_tabs
{
    height:50px;
    border-top:1px solid grey;
}

.TabsBar
{
    width:100%;
    display:flex;
    overflow:auto;
    height:100%;
    align-items: center;
    justify-content: flex-start;
}

.TabsBar_button
{
    height:100%;
    display: flex;
    align-items: center;
    padding:10px;
    opacity:0.4;
    flex-grow: 1;
    justify-content: center;
}

.TabBar_button-2
{
    opacity:1;
    border-bottom:2px solid black;
}

.TabbedLayoutExample_content
{
    width:100%;
    min-height:100%;
    padding:20px;
    background-color:rgb(236, 248, 255);
}

.TabbedLayoutExample_content-menu
{
    padding:50px 20px;
}

.TabbedLayoutExample_content_title
{
    font-size:26px;
    margin-bottom:10px;
}

.MenuBar
{
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    width:60%;
    background-color:rgb(188, 206, 255);
    margin-left:-60%;
    animation: MenuBar_opening 0.3s forwards reverse;
}

.MenuBar-visible
{
    margin-left:0%;
    animation: MenuBar_opening 0.3s forwards;
}

@keyframes MenuBar_opening
{
    0%{
        margin-left:-60%;
    }

    100%{
        margin-left:0%;
    }
}

.MenuBar_icon
{
    position:absolute;
    right:-30px;
    width:30px;
    height:30px;
    top:0;
    background-color:rgb(188, 206, 255);
    display:flex;
    align-items: center;
    justify-content: space-around;
    font-size:22px;
    font-weight: bold;
}

.MenuBar_items
{
    display:flex;
    flex-direction: column;
}

.MenuBar_item
{
    padding:5px;
    border-bottom:1px solid rgba(255, 255, 255, 0.2);
}

.MenuLayout
{
    display:flex;
    flex-direction: column;
    height:100%;
}