.roadmap{position:relative;font-family:"NotesEsa"}
.roadmap::before{content:"";display:block;height:30px;width:200px}

.component-title{position:relative;display:block;width:200px;font-weight:400;font-size:1.4em;cursor:pointer;background-color:#003247;color:#8197A6;margin:10px 0 10px 0;padding:0.5em 1em;border-radius:20px 0 0 20px;box-shadow:2px 2px 3px 1px rgba(0 0 0/30%);transition:all 0.1s ease}
.component-title.selected{background-color:#006762;color:white;margin:13px 0 7px 5px;box-shadow:1px 1px 1px 0 rgba(0 0 0/20%)}
.component-title.selected::after{content:"";position:absolute;height:100%;width:10px;right:0;top:0;background-image:linear-gradient(-90deg,rgba(0 0 0/30%),transparent)}
.component-title.selected+.component-title{margin-top:7px}
.component-title.disabled{opacity:0.2;cursor:default}
.component-title:not(.disabled):hover{color:white}
.component{position:absolute;top:0;left:200px;width:calc(100% - 200px)}

.tab-title{background-color:#003247;display:inline-block;float:left;font-weight:400;font-size:1.1em;padding:0 1em;cursor:pointer;width:33.33%;text-align:center;color:#8197A6;height:40px;line-height:40px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;transition:all 0.25s ease}
.tab-title.selected{background-color:#006762;color:white}
.tab-title.disabled{opacity:0.2;cursor:default}
.tab-title:not(.disabled):hover{color:white}
.tab-title+.tab-title{border-left:1px solid #8197A6}
.tab{padding:20px 40px;background-color:white;height:250px;overflow-y:scroll}
.tab.hide-logs .log-selection{display:none}

.tab .log-selection{padding:0;transition:margin 0.25s ease}
.tab .log-selection,.log-selection li{list-style:none}
.tab .log-selection .logs{width:100%;border-style:solid;border-width:0px 1px 1px 1px;border-color:transparent;background-color:transparent;max-height:0px;padding:0 1em;border-radius:0 0 5px 5px;overflow-y:auto;transition:all 0.25s ease;margin-left:0}
.tab .log-selection:hover .logs{max-height:100px;border-color:#ccc;background-color:#fafafa;padding:1em}
.tab .log-selection .logs:hover{max-height:200px}
.tab .log-version{background-color:white;border:1px solid #ccc;padding:0.5em 0.3em 0.5em 0.5em;font-size:1.4em;border-radius:5px;line-height:1.4em}
.tab .log-selection:hover .log-version{border-radius:5px 5px 0 0}
.tab .log-version::before{content:"\25AA";margin-right:0.2em;font-size:2em;float:left}
.tab .log-version::after{content:"\25BE";font-size:2em;float:right}

.log{display:block;line-height:1.6em}
.log a{display:block;text-decoration:none;color:#59ada9}
.log a:hover{text-decoration:underline;color:#006762}
.log.selected a{font-weight:700;text-decoration:underline;color:#006762}

.log-content{margin-top:0}
.tab.hide-logs .log-content{margin-top:0}