.vh-sheets-container {
    width: 100%;
}

.controls-panel, .options-panel {
    width: 300px;
    background-color: #D23F31;
    border-radius: 0 4px 4px 0;
    text-align: center;
    color: white;
    border: none;
    padding: 20px;
    float: left;
}

.dropdown-container,
.format-check,
.type-check,
.panel-header,
.vhSheetMusicDynamicContent {
    padding-bottom: 20px;
}

.vhSheetMusicDynamicContent {
    position: relative;
    width: 960px;
    height: 90vh;
    float: left;
    margin-left: 9%;
    /*left: 50%;*/
    /*transform: translate(-50%, -436px);*/
}

/*#embed-container-sib > iframe {*/
    /*border-radius: 4px 0 0 0;*/
/*}*/

.vhSheetMusicDynamicContent > div {
    border-top: 1px solid #D23F31;
    /*border-radius: 4px 4px 0 0;*/
}

.vhSheetMusicDynamicContent > div:first-of-type {
    padding-right: 100px;
}

.dynamic-close-button-container {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #D23F31;
    padding: 10px 0;
    float: right;
    width: 100px;
    text-align: center;
    /*border-radius: 0 4px 4px 0;*/
}

.vh-sheet-dropdown {
    /*TODO: figure out how to use custom arrow icon in dropdown*/
    width: 100%;
    margin: 5px 0;
    background-color: transparent;
    border: none;
    border-bottom: 1px solid white;
    outline: none;
    /*-webkit-appearance: none;*/
    /*-moz-appearance: none;*/
    /*background: transparent url("data:image/svg+xml;utf8,<svg height='30' width='18' xmlns='http://www.w3.org/2000/svg'><path d='M320 704L0 384l96-96 224 240 224-240 96 96-320 320z' fill='white' /></svg>") no-repeat 212px;*/
}

select.vh-sheet-dropdown option {
    outline: none;
    color: black;
    background-color: white;
}

.vh-sheet-dropdown[disabled] {
    border-bottom: 1px solid rgba(255, 255, 255, .25);
    color: rgba(255, 255, 255, .25);
    cursor: not-allowed;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: none;
}

.format-check > span, .type-check > span {
    padding: 0 5px;
}

.format-check > span > label,
.type-check > span > label {
    padding-left: 5px;
}

.go-reset {
    /*border-bottom: 1px solid white;*/
    /*padding-bottom: 5px;*/
}

/*TODO: style checkboxes*/

.options-panel {
    border-top: 1px solid white;
    margin-top: 38px;
    visibility: hidden;
}

.controls-panel > .panel-heading {
    border-bottom: 1px solid white;
}

.controls-panel > .panel-body > input, textarea {
    width: 100%;
}

.go-reset > .btn-default, #download-reset > .btn-default, #close-btn > .btn-default, #save-cancel > .btn-default,
#change-cancel > .btn-default, #soon-ok > .btn-default, #message-ok > .btn-default, #add-cancel > .btn-default,
.popover > .popover-navigation > .btn-default, .popover > .popover-navigation > .btn-group > .btn-default,
.dynamic-close-button-container > .btn-default,
#help-close > .btn-default {
    background-color: transparent;
    background-image: none;
    color: white;
    text-decoration: none;
    text-shadow: none;
    border-radius: 2px;
    border: none;
    margin: 0 10px 0 10px;
    box-shadow: none;
}

.go-reset > .btn-default[disabled], #download-reset > .btn-default[disabled], #close-btn > .btn-default[disabled], #save-cancel > .btn-default[disabled],
#change-cancel > .btn-default[disabled], #soon-ok > .btn-default[disabled], #message-ok > .btn-default[disabled], #add-cancel > .btn-default[disabled],
.popover > .popover-navigation > .btn-default[disabled], .popover > .popover-navigation > .btn-group > .btn-default[disabled],
.dynamic-close-button-container > .btn-default[disabled],
#help-close > .btn-default[disabled] {
    color: rgba(255, 255, 255, .5);
}

.go-reset > .btn-default:hover, #download-reset > .btn-default:hover, #close-btn > .btn-default:hover, #save-cancel > .btn-default:hover,
#change-cancel > .btn-default:hover, #soon-ok > .btn-default:hover, #message-ok > .btn-default:hover, #add-cancel > .btn-default:hover,
.popover > .popover-navigation > .btn-default:hover, .popover > .popover-navigation > .btn-group > .btn-default:hover,
.dynamic-close-button-container > .btn-default:hover,
#help-close > .btn-default:hover {
    outline: none;
    border: none;
    background-color: rgba(255, 255, 255, .25);
}

.go-reset > .btn-default[disabled]:hover, #download-reset > .btn-default[disabled]:hover, #close-btn > .btn-default[disabled]:hover, #save-cancel > .btn-default[disabled]:hover,
#change-cancel > .btn-default[disabled]:hover, #soon-ok > .btn-default[disabled]:hover, #message-ok > .btn-default[disabled]:hover, #add-cancel > .btn-default[disabled]:hover,
.popover > .popover-navigation > .btn-default[disabled]:hover, .popover > .popover-navigation > .btn-group > .btn-default[disabled]:hover,
.dynamic-close-button-container > .btn-default[disabled]:hover,
.dynamic-close-button-container > .btn-default[disabled]:active,
#help-close > .btn-default[disabled]:hover {
    outline: none;
    border: none;
    background-color: transparent;
    color: white;
    color: rgba(255, 255, 255, .5);
}

.go-reset > .btn-default:active, #download-reset > .btn-default:active, #close-btn > .btn-default:active, #save-cancel > .btn-default:active,
#change-cancel > .btn-default:active, #soon-ok > .btn-default:active, #message-ok > .btn-default:active, #add-cancel > .btn-default:active,
.popover > .popover-navigation > .btn-default:active, .popover > .popover-navigation > .btn-group > .btn-default:active,
.dynamic-close-button-container > .btn-default:active,
#help-close > .btn-default:active {
    background-color: white;
    color: #D23F31;
    outline: none;
    border: none;
}

.go-reset > .btn-default:focus, #download-reset > .btn-default:focus, #close-btn > .btn-default:focus, #save-cancel > .btn-default:focus,
#change-cancel > .btn-default:focus, #soon-ok > .btn-default:focus, #message-ok > .btn-default:focus, #add-cancel > .btn-default:focus,
.popover > .popover-navigation > .btn-default:focus, .popover > .popover-navigation > .btn-group > .btn-default:focus,
.dynamic-close-button-container > .btn-default:focus,
#help-close > .btn-default:focus {
    outline: none;
    border: none;
}

#dynamic_container {
    height: 100%;
}

#PdfPlugin {
    height: 100%;
    width: 100%;
}

#player, .pdf-error-message {
    padding: 10px;
    background-color: white;
    width: 860px;
    height: 52px;
    line-height: 32px;
}

#embed-container-sib > iframe {
    height: 90vh;
}

.vh-input > md-autocomplete {
    background-color: transparent;
    border-bottom: 1px solid white;
}

.vh-input > md-autocomplete > md-autocomplete-wrap {
    box-shadow: none;
}

.vh-input > md-autocomplete > md-autocomplete-wrap > input:-moz-placeholder,
.vh-input > md-autocomplete > md-autocomplete-wrap > input::-webkit-input-placeholder,
.vh-input > md-autocomplete > md-autocomplete-wrap > input::placeholder {
    fill: white;
    text-align: center;
}

input[type=search]::-webkit-input-placeholder,
input[type=search]::placeholder {
    color: rgba(255,255,255,.5);
}

.vh-input > md-autocomplete > md-autocomplete-wrap > button > md-icon > svg {
    fill: white;
}

.md-virtual-repeat-container {
    margin-top: -1px;
    border-radius: 0 4px 4px 4px;
    width: 512px;
}

.md-virtual-repeat-container.md-autocomplete-suggestions-container {
    margin-left: -2px;
    color: #D23F31;
}