input, td, th {text-align:center;}

rect.bordered {stroke:#E6E6E6; stroke-width:2px;}
div.heatmap .axis path, div.heatmap .axis line {fill:none; stroke:none;}
.heatmap {width:90%; float:left; margin-right:20px;}
.soundSymbol {float:left; font-size:150%; width:5%;}
.soundTrace {float:left; width:90%;}
.grid path {stroke-width:0;}
.grid .tick {stroke:#7f7f7f;}
rect.sound {cursor:pointer;}
rect.active {stroke:black; stroke-width:5px;}

ol {padding-left:45px; color:#666;}
ol li {padding:1px;}
.short-instructions {padding-left:45px; color:#666; list-style-type:square; line-height:24px;}

/* Knob */
#knobDiv {background-image:url("../img/auditory/head+dial.png"); width:398px; height:235px; margin:auto; position:relative; overflow:hidden;}
canvas {margin:35px 50px;}
#soundSymbol {position:absolute; font-size:110%; color:white; pointer-events:none;}

#playSound {margin-top:20px; margin-left:auto; margin-right:auto; display:block;}
.svgContainer {position:relative; width:100%;}
.svgContainer:before {content:""; display:block; padding-top:70%;}
.svgContainer > div {position:absolute; top:0; left:0; bottom:0; right:0;}

.axis line, .axis path {fill:none; stroke:#000;}
#summaryTable {max-width:750px; margin:auto;}

.auditory tr.tableHeadings > th {color:#fff;}
.auditory tr.tableHeadings > th:nth-child(1) {background-color:#e41a1c;}
.auditory tr.tableHeadings > th:nth-child(2) {background-color:#377eb8;}
.auditory tr.tableHeadings > th:nth-child(3) {background-color:#4daf4a;}
.auditory tr.tableHeadings > th:nth-child(4) {background-color:#984ea3;}
.auditory col:nth-child(1) {background-color:#f39192;}
.auditory col:nth-child(2) {background-color:#a1c5e3;}
.auditory col:nth-child(3) {background-color:#aadba9;}
.auditory col:nth-child(4) {background-color:#d2acd7;}
.auditory tr.tableSubheadings {background-color:#fff;}
.somatosensory .table-entry {width:80px;}

.flexible {align-items:center; justify-content:center;}
.flex {display:flex; flex-wrap:wrap; justify-content:space-around;}
.arm, .hand, .zoomedHand {cursor:url(../img/somatosensory/probe.png),pointer;}
button.hint {visibility:hidden;}
.peripheral .hint {float:right;}
.hint.cortical {margin-bottom:5px;}
.row.centreAlign {flex-wrap:wrap;}
.row.centreAlign, .verticalCentre {display:flex;}
.verticalCentre {align-items:center; justify-content:center;}
.arrows {cursor:pointer;}
.row.container:after, .row.container:before, .row.row:after, .row.row:before {content:normal;}


/* spatial tuning */
.directionSelect {width:400px; padding-right:10px; padding-left:10px;}
.oscilloContainer {width:calc(100% - 440px); padding-right:10px; padding-left:10px;}
.svgContainer1 {width:600px; margin:0 auto; display:block;}

@media only screen and (max-width:992px) {
    .directionSelect {width:100%; padding:0;}
    .oscilloContainer {width:100%; padding:0;}
}


/* pop anal */
table {border:1px solid #ddd;}
.tableHeadings > th, .tableSubheadings > th {font-size:16px; text-align:left; font-weight:bold; padding:10px 6px; border:1px solid #ddd;}
td {border:1px solid #ddd; padding:4px; color:#333;}

/* Override jquery-ui.css styles */
.ui-dialog {width:265px; box-shadow:2px 5px 15px #888;}
.ui-dialog-titlebar {color:#fff; font-size:16px;}
.ui-dialog-content {font-size:16px; color:#666;}
.ui-dialog-content > p {margin-top:15px; margin-bottom:15px;}
.ui-widget-header {background-color:#1b8fae;}