@charset "UTF-8";

body {
    padding: 5px;
}

.label {
    padding: 5px;
    font-family: "PT Serif", serif;
    font-size: 15px;
    font-weight: bold;
    color: #fff;
}

td {
    padding: 4px;
    border: 1px solid #356AA0;
}

.spaced-v {
    margin-top: 5px;
    margin-bottom: 5px;
}

.spaced-h {
    margin-right: 5px;
}

p {
    text-align: justify;
}

.jxgbox {
    height: 350px;
    display: block;
}

.bordered {
    padding: 10px;
    border-radius: 5px;
    border: 1px solid #356AA0;
}

.x-large {
    width: 550px;
}

.large {
    width: 500px;
}

.medium {
    width: 430px;
}

.small {
    width: 350px;
}

.center-img {
    margin: 5px auto;
}

.center {
    text-align: center;
}

.justify {
    text-align: justify;
}

.answer-bg {
    background-color: #fbf0cc; /*light-orange*/
}

span.tab {
    padding: 0 20px; /* Or desired space*/
}

.height-auto {
    height: auto;
}

.disabled {
    color: #A4A4A4; /*gray*/
}

.dark-green {
    color: #04B431; /*dark green*/
}

.dark-yellow {
    color: #CC6600; /*dark yellow*/
}

.dark-red {
    color: #FE2E2E; /*dark red*/
}

.hidden {
    visibility: hidden;
}

.inline {
    display: inline-block;
}

.warning {
    color: #FE2E2E; /*dark red*/
    text-decoration: none; /*no underline for a link*/
    display: inline-table;
    vertical-align: middle;
}

.statusText {
    font-family: "PT Serif", serif;
    font-weight: bold;
    font-size: 1em;
}

.myFont {
    font-family: 'Arial', serif;
    border: 2px solid black;
    padding: 5px;
    border-radius: 5px;
    text-align: center;
    font-weight: bold;
    box-shadow: 5px 5px 5px #888888;
}

#hSol{
 color: '#f97f04'; /*orange*/
}

/* **************************** */

div#cylinderRadiusSelector, div#coneRadiusSelector {
    padding: 10px;
    border: 2px solid blue;
    width: 200px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: white;
}

input#answerInput {
    margin-top: 10px;
    margin-bottom: 10px;
    border: 1px solid black;
    width: 100px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: black;
}

div#cylinderRadiusSelector > ul, div#coneRadiusSelector > ul {
    display: none;
    list-style-type: none;
    -webkit-padding-start: 5px;
}

div#cylinderRadiusSelector:hover > ul, div#coneRadiusSelector:hover > ul {
    display: block;
    background: #f9f9f9;
}

div#cylinderRadiusSelector, div#coneRadiusSelector
:hover > ul > li {
    padding: 5px;
}

div#cylinderRadiusSelector > ul > li:hover, div#coneRadiusSelector > ul > li:hover {
    background: lightgrey;
}

#messageContainer {
    max-height: 150px;
}