/**** TASKS TITLE BAR ***/
#title{
    display:flex;
    transition:0.5s all;
    align-items:center;
}
#tasks{
    display:flex;
    transition:0.5s all;
    align-items:center;
    overflow-x:auto;
    width:100%;
}

#tasks::-webkit-scrollbar{
    display:none;
}

#tasks .wrapper:first-child{
    border-left: solid 1px;
}

#title #tasks > .wrapper{
    flex-basis:100%;
    width:100%;
    transform:translateX(0);
    transition:all 0.25s cubic-bezier(0, 0, 0.31, 1.37);
    padding-top:1em;
    padding-bottom:1em;
    border-right:solid 1px;
}
#title #tasks > .wrapper.selected{
    background-color:var(--pico-primary-background);

}
#title #tasks > .wrapper.entering{
    flex-basis:0;
    transform:translateX(-100%);
}
#title #tasks > .wrapper > *{
    white-space:nowrap;
    overflow:hidden;
    display:flex;
    width:100%;
    justify-content:center;
    text-overflow:ellipsis;
    min-width:5em;
    padding-left:1em;
    padding-right:1em;
    margin:0;
}
#title #newTask{
    width:1em;
    height:1em;
    text-align:center;
    margin:0;
    flex:1em;
    border-right:solid 1px;
}

/*** TEXT EDITOR THINGY ***/

#contents{
    flex-grow:1;
    border:solid 1px;

    border-bottom-left-radius:2em;
    border-bottom-right-radius:2em;
   
    margin-top:2em;
    
    font-family:monospace;
    overflow:hidden;
}
.container{
    display:flex;
    height:100vh;
    flex-flow:column;
}