html {
    background: -webkit-linear-gradient(#444, black); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#444, black); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#444, black); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#444, black); /* Standard syntax */
}

body {
    background: rgba(0,0,0,0); /* Make the bg transparent */
    color: white;
    min-width: 400px;
    width: 30%;
    height: 100%;
    text-align: center;
    margin: auto;
}

p, h1, h2, h3, h4, h5, h6 {
    text-shadow: 0px 1px 1px #000;
}

code {
    text-shadow: none;
}

.header {
    padding-top: 1em;
    height: 10%;
    min-height: 75px;
    text-align: center;
}

.header strong {
    float: right;
}

.logo {
    margin: auto;
}

.logo strong {
    padding-left: .5em;
    float: left;
}

#airtimeLogo {
    float: left;
    padding-top: 0.6em;
}

.btn-primary {
    text-shadow: 0px 1px 1px #000000;
    background-color: #ff5d1a;
    border-color: #8d3715;
}

.btn-primary:focus, .btn-primary:active, .form-control:focus
{
    border-color: #ff5d1a;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 93, 26, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 93, 26, 0.6);
}

.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary,
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus, .btn-primary.disabled:active,
.btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active
{
    background-color: #dc5118;
    border-color: #632910;
}

/* ############################################################################
 *
 * Form Styles
 *
 * ############################################################################ */

form {
    margin: auto;
    top: 0;
    width: 99%;
    position: absolute;
    float: right;

}

form p {
    text-align: left;
    margin-bottom: 1em;
}

form .form-group {
    text-align: left;
}

.viewport {
    position: absolute;
    width: 30%;
    min-width: 400px;
    height: 89%; /* Keep 1% off of 100 to avoid overflow */
    overflow-x: hidden;
    overflow-y: auto;
}

.form-wrapper {
    overflow: auto;
}

.form-title {
    margin: 1em 0;
}

.form-slider {
    position: absolute;
    width: 100%;
    height: 100%;
}

.form-control-feedback {
    display: none;
}

/* ############################################################################
 *
 * Form Help Box Styles
 *
 * ############################################################################ */

.help-block.help-message {
    font-weight:bold;
    margin-bottom: 15px;
}

.has-error, .has-error .control-label,
.has-error .form-control-feedback,
.has-error .form-control {
    color: red;
}

.has-success {
    color: lawngreen;
}

/* ############################################################################
 *
 * Overlay Styles
 *
 * ############################################################################ */

#overlay {
    display: none;
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #000;
    width: 100%;
    height: 100%;
    z-index: 5000;
}

#loadingImage {
    display: none;
    position: absolute;
    top: 40%;
    left: 49%; /* Shave 1% to account for half image width */
    z-index: 5001;
}

/* ############################################################################
 *
 * Button Styles
 *
 * ############################################################################ */

.btn-primary {
    font-weight: bold;
}

.btn-disabled {
    disabled: disabled;
    visibility: hidden;
    display: block;
}

.btn-next {
    float: right;
    width: 49%;
}

.btn-skip {
    margin-top: .5em;
    width: 100%;
}

.btn-back {
    float: left;
    width: 49%;
}

.caret.caret-up {
    border-top-width: 0;
    border-bottom: 4px solid #fff;
}

/* ############################################################################
 *
 * RabbitMQ Settings Form Styles
 *
 * ############################################################################ */

#rmqSettingsForm {
    left: 100%;
}

#rmqFormBody {
    display: none;
}

/* ############################################################################
 *
 * General Settings Form Styles
 *
 * ############################################################################ */

#generalSettingsForm {
    left: 200%;
}

/* ############################################################################
 *
 * Media Settings Form Styles
 *
 * ############################################################################ */

#mediaSettingsForm {
    left: 300%;
}

/* ############################################################################
 *
 * Finish Settings Form Styles
 *
 * ############################################################################ */

#finishSettingsForm {
    left: 400%;
}