nickjillings@1341: /*
nickjillings@1341:  * Hold any style information for APE interface. Customise if you like to make the interface your own!
nickjillings@1341:  * 
nickjillings@1341:  */
nicholas@2538: 
nickjillings@1341: body {
nicholas@2538:     /* Set the background colour (note US English spelling) to grey*/
nicholas@2538:     background-color: #ddd
nickjillings@1341: }
nickjillings@1341: div.title {
nicholas@2538:     /* Specify any colouring for the title */
nickjillings@1341: }
nickjillings@1341: div.pageTitle {
nicholas@2538:     width: auto;
nicholas@2538:     height: 20px;
nicholas@2538:     margin-top: 5px;
nicholas@2538:     margin-bottom: 10px;
nickjillings@1341: }
nicholas@2538: div.pageTitle span {
nicholas@2538:     font-size: 1.5em;
nickjillings@1341: }
nickjillings@1341: button {
nicholas@2538:     /* Specify any button structure or style */
nicholas@2538:     min-width: 20px;
nicholas@2538:     background-color: #ddd
nickjillings@1341: }
nickjillings@1341: div.slider {
nicholas@2538:     /* Specify any structure for the slider holder interface */
nicholas@2538:     height: 150px;
nicholas@2538:     margin: 5px 50px;
nicholas@2538:     -moz-user-select: -moz-none;
nicholas@2538:     -khtml-user-select: none;
nicholas@2538:     -webkit-user-select: none;
nickjillings@1341: }
nickjillings@1341: div.sliderScale {
nicholas@2538:     width: 100%;
nicholas@2538:     min-height: 30px;
nicholas@2538:     -moz-user-select: -moz-none;
nicholas@2538:     -khtml-user-select: none;
nicholas@2538:     -webkit-user-select: none;
nickjillings@1341: }
nickjillings@1341: div.sliderScale span {
nicholas@2538:     /* Any formatting of text below scale */
nicholas@2538:     font-size: 1.2em;
nicholas@2538:     min-width: 5px;
nicholas@2391:     max-width: 100px;
nicholas@2391:     text-align: center;
nicholas@2538:     height: 20px;
nicholas@2538:     position: absolute;
nickjillings@1341: }
nickjillings@1341: div.track-slider {
nicholas@2538:     /* Specify any structure for the slider objects */
nicholas@2538:     position: absolute;
nicholas@2538:     height: inherit;
nicholas@2538:     width: 12px;
nicholas@2538:     float: left;
nicholas@2538:     background-color: rgb(100, 200, 100);
nicholas@2538:     -moz-user-select: -moz-none;
nicholas@2538:     -khtml-user-select: none;
nicholas@2538:     -webkit-user-select: none;
nickjillings@1296:     border: 1px solid black;
nickjillings@1341: }
nicholas@3041: canvas.tick-canvas {
nicholas@3041:     z-index: -1;
nicholas@3041:     position: absolute;
nicholas@3041:     height: 150px;
nicholas@3041:     background-color: #eee;
nicholas@3041: }
nicholas@2396: div#outside-reference-holder {
nicholas@2396:     display: flex;
nicholas@2396:     align-content: center;
nicholas@2396:     justify-content: center;
nicholas@2396:     margin-bottom: 5px;
nicholas@2396: }
nickjillings@1341: div.outside-reference {
nicholas@2538:     width: 120px;
nicholas@2396:     text-align: center;
nicholas@2538:     height: 20px;
nicholas@2538:     background-color: rgb(100, 200, 100);
nicholas@2396:     position: inherit;
nicholas@2396:     margin: 0px 5px;
nickjillings@1341: }
nickjillings@1341: div.track-slider-disabled {
nicholas@2538:     background-color: rgb(100, 100, 100);
nickjillings@1341: }
nickjillings@1341: div.track-slider-playing {
nicholas@2538:     background-color: #FF0000;
nickjillings@1341: }
nickjillings@1341: div.comment-box-playing {
nicholas@2538:     background-color: #FFDDDD;
nickjillings@1341: }
nickjillings@1356: div#master-volume-holder {
nickjillings@1356:     position: absolute;
nickjillings@1356:     top: 10px;
nickjillings@1356:     left: 120px;
nicholas@2538: }
nicholas@2782: div.imageController {
nicholas@2782:     align-content: center;
nicholas@2782:     text-align: center;
nicholas@2782:     height: 250px;
nicholas@2782: }
nicholas@2782: div.imageController img {
nicholas@2782:     max-height: 250px;
nicholas@2782: }