.caosdb-v-tour-button {
    background-color: #ff593c;
    opacity: 0.75;
    color: white;
    font-weight: bold;
    font-size: 14pt;
    border-radius: 10em;
    border: 0px;
    /* width: 5em; */
    /* height: 50px; */
    /* line-height: 50px; */
    text-align: center;
    padding: 0.35em;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    z-index: 99;
}
.caosdb-v-tour-button:hover{
    opacity: 1.0;
}
.caosdb-v-tour-button.medium {
    height: 3em;
    width: 3em;
    /* line-height: 40px; */
}
.caosdb-v-tour-button.large {
    height: 5em;
    width: 5em;
    /* line-height: 50px; */
}
.caosdb-v-tour-button {
    height: 1.5em;
    width: 1.5em;
    /* line-height: 30px; */
}

.caosdb-v-tour-highlight {
    background-color: #ff593c !important;
    color: white !important;
    animation: color-change 1s 2;
}

.caosdb-v-tour-highlighter {
    color: #ff593c;
    animation: color-change 1s 3;
}

.caosdb-v-tour-highlighter a:hover {
    color: #212529;
}

@keyframes color-change {
    0% {
        box-shadow: 0 0 0 0 #ff593c;
    }
    50% {
        box-shadow: 0 0 1em 0.5em #ff593c;
    }
    100% {
        box-shadow: 0 0 0 0 #ff593c;
    }
}
.caosdb-v-tour-menu-entry-highlight {
    background-color: #348187 !important;
    color: white !important;
}
.caosdb-f-tour-menu-entry {
    background-color: #ff593c;
}
.caosdb-f-tour-menu-entry:hover {
    background-color: transparent;
    color: #333 !important;
}
.caosdb-f-tour-menu-entry:active {
    background-color: transparent;
    color: #333 !important;
}
.caosdb-f-tour-menu-entry:focus {
    background-color: transparent;
    color: #333 !important;
}
.caosdb-f-tour-hidden {
    display: none;
}
.dropdown > .caosdb-f-tour-menu-dropdown {
    margin: 0px;
}

/* Taken from https://stackoverflow.com/a/32587571/232888, cc-by-sa 4.0 by
   ryachza */
.caosdb-f-tour-circle {
    background-color: #ff593c;
    color: white;
    font-weight: bold;
    display:inline-block;

    border-radius:50%;
}

.caosdb-f-tour-circle:before,
.caosdb-f-tour-circle:after {
    content:'\200B';
    display:inline-block;
    line-height:0px;

    padding-top:50%;
    padding-bottom:50%;
}

.caosdb-f-tour-circle:before {
    padding-left: 0.5em;
}
.caosdb-f-tour-circle:after {
    padding-right: 0.5em;
}
/* End of https://stackoverflow.com/a/32587571/232888 */

.popover {
    width: 100em;
    color: initial;
}

/* Otherwise the pages would inherit their properties from the elements the
   button was attached to. */
.popover p {
    font-size: 11pt;
}
.popover-content h1 {
    font-size: 170%;
    font-weight: bold;
}
.popover-content h2 {
    font-size: 130%;
    font-weight: bold;
}
.popover-content h3 {
    font-size: 130%;
}

/* Clickable elements on the popover*/
.popover .tour-clickable, .popover [data-tour-activate] {
    cursor: pointer;
    color: LightSeaGreen;
}

.caosdb-v-tour-overview {
    padding: 0px;
}

.caosdb-v-tour-toc-sidebar {
    height: 100%;
    width: 200px;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #1a4548;
    color: #e1eff0;
    overflow-x: hidden;
    padding-top: 20px;
    visibility: hidden;
}

.caosdb-v-tour-toc-sidebar a {
    color: #e1eff0;
}

.caosdb-v-tour-toc-sidebar a:hover {
    color: #212529;
}

body.tour-sidebar-visible .caosdb-v-tour-toc-sidebar {
    visibility: visible;
}

body.tour-sidebar-visible {
    margin-left: 200px;
}

.caosdb-v-tour-toc-active-item {
    background-color: #a1c4c6;
}

.caosdb-v-tour-toc-active-item a {
    color: #333;
}

.caosdb-v-tour-toc-pageset {
    width: 100%;
    text-align: left;
    color: #e1eff0;
}
.caosdb-v-tour-pn-btn {
    width:6em;
}

button.caosdb-v-tour-toc-show {
    position: fixed;
    top: calc(50vh - 12px);
    left: -2px;
    padding: 0;
    margin: 0;
    border: none;
    transform: rotate(45deg);
    width: 24px;
    height: 24px;
    background-color: #1a4548;
    visibility: hidden;
    z-index: 100000;
}

div.caosdb-v-tour-toc-show {
    background-color: #1a4548;
    visibility: hidden;
    width: 12px;
    height: 100%;
    position: fixed;
    padding: 0;
    margin: 0;
    border: none;
    z-index: 100000;
}

.caosdb-v-tour-toc-detour {
    font-size: 0.875em;
    padding-left: 1em;
}

.caosdb-v-tour-toc-cur {
    border: 1px dashed #e1eff0;
}

.caosdb-v-tour-toc-active-item.caosdb-v-tour-toc-cur {
    border: none;
}

.caosdb-v-tour-toc-header {
    margin-left: 0.75rem;
}

/* For elements in popovers which are not for clicking but only illustrative. */
.caosdb-v-tour-unclickable {
    cursor: text !important;
}
