img {
    max-width: 100%;
}

span.ui-checkboxradio-icon { 
    display: none; 
}

/*.ui-widget.ui-widget-content {
    border: 0px;
}*/
.ui-widget-header {
    border: 0px;
}
.ui-tabs {
    padding:0px;
}
.ui-tabs .ui-tabs-nav {
    font-size:12px;
    padding:0px;
}
.ui-tabs .ui-tabs-panel {
    padding:0px;
    border-width:1px;
    background-color: white;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    padding:1px 4px;
}
.ui-dialog .ui-dialog-buttonpane {
    margin-top: 0px;
    padding: 0px;
}
/*.notify-dialog .ui-dialog .ui-widget-header {
    background: inherit;
}*/
.notify-dialog .ui-dialog-titlebar {
    background: inherit;
}
.ui-dialog .ui-dialog-titlebar-close {
    border: none;
    background: none;
    top: 40%;
}
.ui-widget-header {
    background: none;
    font-size: 18px;
}
.ui-widget.ui-widget-content {
    border-radius: 10px;
}

.logColor:nth-child(even) {
    background:#dddddd;
}

.frame-fs-off {
    opacity: 1.0;
}
.frame-fs-on {
    opacity: 0.6;
}
.frame-fs-on:hover {
    opacity: 1.0;
}

.mediaSelect {
    margin-bottom: 8px;
}
.mediaSelect > label {
    width: 110px;
    display: inline-block;
}
.mediaSelect > select {
    width: 440px;
}

.waiting {
    position: absolute;
    height: 119px;
    width: 150px;
    border: solid;
    border-radius: 10px;
    background-color: beige;
    text-align: center;
    font-family: Arial;
}

.startSpan {
    font-weight: bold;
    color: darkgray;
/*    background-color: green;
    color: white;
    padding: 4px;
    padding-top: 0px;
    padding-bottom: 1px;
    padding-left: 2px;
    padding-right: 4px;
    border-radius: 12px;*/
}
.startSpan:before {
    content: "metronome: ";
    font-weight: normal;
    color: black;
    font-size: smaller;
}
.startSpan:after {
    content: " BPM";
}
.stopSpan {
/*    background-color: red;
    color: white;
    padding-top: 0px;
    padding-bottom: 2px;
    padding-left: 2px;
    padding-right: 2px;
    border-radius: 12px;*/
}
.markerSpan {
    background-color: burlywood;
    color: white;
    padding: 4px;
    padding-top: 0px;
    border-radius: 12px;
}

.signal-bars {
    display: table;
}
.signal-bars .bar {
    width: 10%;
    margin-left: 1px;
    min-height: 20%;
    display: inline-block;
    background-color: grey;
/*    border: thin solid #f3f3f3;
    width: 18%;
    display: table;*/
}
.signal-bars .bar.first-bar { height: 20%; }
.signal-bars .bar.second-bar { height: 40%; }
.signal-bars .bar.third-bar { height: 60%; }
.signal-bars .bar.fourth-bar { height: 80%; }
.signal-bars .bar.fifth-bar { height: 90%; }

.microphone-on {
    background-image: url(img/microphone-solid.png);
}
.microphone-off {
    background-image: url(img/microphone-slash-solid.png);
}
.microphone-on, .microphone-off {
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0.6;
}
.microphone-on:hover, .microphone-off:hover {
    opacity: 1.0;
}

#sliderButton {
    color:white;
    background-color:#333333;
    font-family:Arial;
    font-weight:bold;
    position:fixed;
    right:320px;
    width:21px; height:17px;
    padding:4px;
    border-top-left-radius:7px;
    border-bottom-left-radius:7px;
}

.no-titlebar {
    padding: 0px;
}
.no-titlebar .ui-dialog-titlebar {
    display: none;
    height: 12px;
    padding-left: 22px;
    background: #454545;
    font-size: 12px;
    color:aliceblue;
}
.no-titlebar .ui-dialog-titlebar-close {
    right: unset;
    left: .3em;
}
.no-titlebar .ui-button {
    top: 65%;
    height: 12px;
    width: 12px;
    border: none;
    outline: none;
    background: azure;
}
.no-titlebar .ui-dialog-content {
    padding: 0px;
    overflow: hidden;
}
.no-titlebar .ui-button .ui-icon {
    background-position: -65px -16px;
}
.no-titlebar:hover .ui-dialog-titlebar {
    display: block;
}
.yes-titlebar {
    padding: 0px;
}
.yes-titlebar .ui-dialog-titlebar {
    display: block;
    height: 12px;
    font-size: 12px;
    padding-left: 22px;
    color: white;
    width: 80px;
    background: #454545;
    opacity: 0.8;
}
.yes-titlebar:hover .ui-dialog-titlebar {
    opacity: 1.0;
}
.yes-titlebar .ui-dialog-titlebar-close {
    right: unset;
    left: .3em;
}
.yes-titlebar .ui-dialog-content {
    display: none;
}
.yes-titlebar .ui-widget-content {
    display: none;
}
.yes-titlebar .ui-dialog-title {
    /*display: none;*/
}
.yes-titlebar .ui-button {
    top: 65%;
    height: 12px;
    width: 12px;
    border: none;
    outline: none;
    background: azure;
}
.yes-titlebar .ui-button .ui-icon {
    background-position: -32px -16px;
}
