#leftContainer {
    height: 100%
}

#leftContainer > * {
    margin-bottom: 10px;
}

/* robot list header */

#robotListHeaderContainer {
    height: 60px;
}

#Robot-Selector-div {
    text-align: center;
    margin-bottom: 3px;
}

#Robot-Selector-select {
    width: 80%
}

#ClickSelectContainer {
    text-align: center;
}

#Click-Select-div {
    margin: 0px;
}

/* robot list */

#robotListContainer {
    height: calc(50% - 100px);
    overflow: scroll;
    overflow-x: hidden;
}

#robotListContainer > div {
    margin-bottom: 10px;
    padding: 10px;
    width: 90%;
}

#robotListContainer > div > div {
    width: 100%;
}

#robotListContainer > div > div > select {
    width: 100%
}

#robotContainer {
    background-color: rgba(139, 180, 182, 0.1);
}

.selectedRobot {
    background-color: rgba(15, 200, 150, 0.3) !important;
}

#Opacity-slider {
    width: 98%
}

/* line list header */

#lineListHeaderContainer {
    height: 20px;
}

/* #lineButtonContainer > * {
    text-align: center;
    width: 46%;
    margin-left: 2%;
    margin-right: 2%;
} */

#lineButtonContainer > * {
    text-align: center;
    width: 96%;
    margin-left: 2%;
    margin-right: 2%;
}

/* line list */

#lineListContainer {
    height: calc(50% - 20px);
    overflow: scroll;
    overflow-x: hidden;
}

#lineListContainer > div {
    margin-bottom: 10px;
    padding: 5px;
    width: 90%;
}

#lineAnimationName {
    display: inline-block;
    width: 100%;
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis;
}

#lineSettingsContainer > div {
    width: 50%;
    margin: 0px;
}

#lineSettingsContainer > div > * {
    width: 95%;
}