html {
position: relative;
min-height: 100%;
}
body {
background: url(../img/bbaero-bkg.jpg) #61402D;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
color: white;
font-size: 16px;
/* from fixed navbar example */
padding-top: 60px;
/* Margin bottom by footer height */
margin-bottom: 50px;
}
/* From http://stackoverflow.com/questions/121203/how-to-detect-if-javascript-is-disabled
search for "document.body.class" to find the solution:
- set the element's class via JavaScript. Default is .no-js.
JavaScript sets it to .js
- all js/no-js CSS rules start with the respective class, then list
the affected descendants
*/
.js #script-warn {
display: none!important;
}
.no-js #script-warn {
display: inherit;
position: absolute;
top: 50%;
background-color: rgba(0, 0, 0, 0.20);
}
a {
color: inherit;
}
a:hover {
color: #d1a02D;
}
.js #main {
display: inherit;
}
.no-js #main {
display: none!important;
}
#main {
min-width: inherit;
}
#main a {
text-decoration: underline;
}
#main a:visited {
color: #e278c4;
}
div.row {
margin-left: 10px;
margin-right: 0px;
}
.phonetic {
color: #e278c4;
font-style: italic;
}
.fa-smile-o {
font-size: 20px;
color: black;
background-color: yellow;
}
.glyphicon-heart {
font-size: 20px;
color: #ff22c4;
}
#mom-rant {
font-size: 20;
font-weight: bold;
}
button,
html input,
textarea {
color: black;
}
.autowidth {
width: 1px;
}
td.autowidth {
padding-right: 2%;
border-right: 1px white solid;
}
td.autowidth + td {
padding-left: 0.5em;
}
.blanktd {
width: 1px;
}
.tbl-cell-show {
display: table-cell;
}
div#form-container {
margin: 0 auto;
min-height: 90%;
}
#fbtext {
width: 100%;
min-height: 30%
}
#rcword {
margin-left: 0.5em;
}
form div label {
/* To make sure that all labels have the same size and alignment */
display: inline-block;
width: 15%;
text-align: left;
}
label#fbcommentslabel {
text-align: left;
}
form div + div {
margin-top: 0.5em;
}
.testres-hdr {
font-size: 24px;
}
.status-icon {
font-size: 1.75em;
}
.testnum {
text-align: right;
}
.tbl-header {
border-bottom: 1px white solid;
text-align: left;
}
#queue-state {
margin: 1.5%;
width: 50%;
}
#qs-pos {
text-align: center;
}
.qs-icon {
width: 1px;
padding: 1%;
}
.qs-text {
font-size: larger;
}
.qs-wait {
background-color: yellow;
color: black;
}
.qs-update {
background-color: purple;
color: white;
}
.qs-go {
background-color: green;
color: black;
}
.qs-err {
background-color: red;
color: black;
}
#xhrerrs {
font-size: x-large;
}
.button {
margin-top: 1em;
}
span.aerovideo p
{
margin-top: 5%;
}
span.aerovideo object {
margin: 0 1%;
width: 75%;
height: 75%;
}
.js .footer {
display: inherit;
}
.no-js .footer {
display: none!important;
}
ul#techlist li img {
height: 50px;
margin: auto 5px;
display: inline-block;
}
.bbaero-error {
background-color: rgba(255, 0, 0, 0.5);
font-size: 0.85em;
}
.footer {
position: absolute;
bottom: 0;
width: 100%;
/* Set the fixed height of the footer here */
height: 50px;
/* bg color #51302D with 75% transparency */
background-color: rgba(81, 48, 45, 0.75);
}
.footer-text {
margin: 0;
}
.footer ul {
list-style: none;
padding: 0;
margin-bottom: 0;
display: flex;
justify-content: center;
}
.footer li span * {
position: relative;
float: left;
display: inline-block;
vertical-align: center;
height: 50px;
line-height: 50px;
margin: 0 3px;
}
.tf-hdr {
font-size: x-large;
font-weight: bold;
}
.grpbox {
min-width: 300px;
font-size: larger;
display: block;
border: 2px solid white;
}
.grpbox label {
display: block;
min-width: 267px;
margin-left: 5%;
}
.grpbox label span {
vertical-align: middle;
}
#cust-runpct, #cust-failpct {
width: 2em;
height: 1em;
vertical-align: -0.1em;
}
.gb-run-text, .gb-exp-text {
font-size: larger;
}
input[type="radio"] {
margin-top: -1;
margin-bottom: -1;
margin-right: 0.25em;
}
input[type="radio"] + span:before {
display: inline-block;
vertical-align: -0.2em;
border-radius: 1em; /*hard border*/
border: 0.125em solid #fff;
width: 1em;
height: 1em;
}
button#teststart {
width: 110px;
margin-top: 1em;
}
span#show-aero a:visited {
color: white;
}
.js nav {
display: inherit;
}
.no-js nav {
display: none!important;
}
.navbar-toggle {
float: left;
margin-left: 2%;
}
nav.navbar-inverse {
background-color: #61402D;
}
.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.active>a:focus,
.navbar-inverse .navbar-nav>.active>a:hover,
.navbar-inverse .navbar-nav>.open>a,
.navbar-inverse .navbar-nav>.open>a:focus,
.navbar-inverse .navbar-nav>.open>a:hover {
background-color: #814A2D;
}
.menu-arrow {
font-size: 0.75em;
}
.dropdown-toggle>.active,
.dropdown-menu,
.dropdown-menu>li>a {
color: white;
background-color: #814A2D;
}
.dropdown-header {
color: #b5b5b5;
font-weight: bold;
font-style: italic;
background-color: #814A2D;
}
.navbar-inverse .navbar-nav .open .dropdown-menu .divider {
background-color: #ffffff;
}
.tooltip.left .tooltip-arrow {
border-left-color: #41301D;
}
.tooltip.right .tooltip-arrow {
border-right-color: #41301D;
}
.tooltip.top .tooltip-arrow {
border-top-color: #41301D;
}
.tooltip.bottom .tooltip-arrow {
border-bottom-color: #41301D;
}
.tooltip-inner {
background: #41301D;
}
@media (max-width: 767px) {
.dropdown-menu {
padding: 0;
}
.dropdown-menu .divider {
margin: 0;
}
.widelabel {
width: 40%;
}
input.fbfield {
min-width: 95%;
}
div#form-container {
min-width: 100%;
}
div.row {
margin-left: 0;
}
div#main {
padding: 0;
}
#fbtext {
min-width: 75%;
min-height: 70%
}
form[name='testform'] {
min-width: 100%;
}
input[type="radio"] {
vertical-align: -0.3em;
}
.grpbox, .gb-run-text, .gb-exp-text {
font-size: small;
}
.tf-hdr {
font-size: normal;;
}
.tf-gb-hdr {
width: 100%;
margin-bottom: 0.25em;
}
#cust-runpct, #cust-failpct {
height: 2em;
}
.testres-hdr {
font-size: larger;
}
.status-icon {
font-size: 1em;
}
#testres-tbl {
font-size: small;
}
#queue-state {
width: 100%;
}
.qs-text {
font-size: medium;
}
ul#techlist li img {
height: 35px;
margin: auto 3px;
}
}
@media (min-width: 768px) {
.tooltip {
min-width: 20em;
}
input.fbfield {
width: 85%;
}
div#form-container {
max-width: 60%;
}
body {
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
}
@media (min-height: 700px) {
@media (min-width: 992px) {
body {
/* Margin bottom by footer height */
margin-bottom: 75px;
}
.footer,
.footer li span * {
/* Set the fixed height of the footer here */
height: 75px;
line-height: 75px;
}
}
}