body {
    font-family: Helvetica;
    overscroll-behavior: none;
    transition: filter 0.3s ease;
}

.content-wrapper{
    padding:50px;
    transform-origin:top left;
    box-sizing:content-box;
}

.modal-active {
    filter: blur(5px);
}

.colorbar-container{
    position:absolute;
    margin-left:25px;
    top:450px;
    background-color:white;
    width:fit-content;
    height:fit-content;
    border:solid lightgray 1px;
    padding:15px;
}

.colorbar-container p{
    margin-top:0;
    margin-bottom:10px;
}

#colorbar{
    width:100%;
    height:100%;
}

.parent-timeline{
    margin-top:100px;
    height:800px;
    margin-left:25px;
}

.child-timeline{
    position:relative;
    height:100px;
}

.main-screen-button{
    position:fixed;
}

.interface-button{
    transition:all 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms !important;
}

.interface-button:hover {
    filter:saturate(65%);
    box-shadow:
        0px 2px 4px -1px rgba(0,0,0,0.2),
        0px 4px 5px  0px rgba(0,0,0,0.14),
        0px 1px 10px 0px rgba(0,0,0,0.12) !important;

}