/* The below position the viewer div and pcaviz-controls div relative to each other.*/

.pcaviz-vis-and-controls {
    width: 100%;
    height: 400px;
    position: relative;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    margin-bottom: 10px;
}

.pcaviz-viscontainer {
    width: 100%;
    height: 100%;
}

.pcaviz-controls {
    min-height: 40px;
    height: 40px;
}

/** Need below to keep the button from being too tall. **/
.pcaviz-controls-container {
    height: 40px;
}

.pcaviz-figcaption {
    display: inline-block;
}

/* You can also stylize the control buttons. */
.pcaviz-button { padding: 7px;  }
.pcaviz-button img { height: 25px;  }
.pcaviz-slider-container { padding-left: 10px; height: inherit; }