www/css/style.css

/*
 */

body {
    background: #ccc;
    font-family: Verdana, Arial, sans-serif;
    margin: 0px;
}


#MainPanel {
    width: 1278px;
    height: 628px;
    border: 2px solid #4297d7;
    background: #252526;
    color: #eeeeee;
}


#water_totals {
    width: 960px;
    background: #353536;
    margin-top: 15px;
    border: 1px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


#about_table {
    width: 960px;
    background: #353536;
    margin: 150px;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


#node_table {
    width: 600px;
    background: #353536;
    margin: 50px;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


#fermenter_table {
    width: 720px;
    background: #252526;
    margin: 5px;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


.temperature {
    display: inline-block;
    width: 64px;
    height: 20px;
    white-space: nowrap;
    color: #00eeee;
}


.NUM {
    font-family: "Arial Black", Gadget, sans-serif;
    color: #00eeee;
    padding: 2px;
    margin: 2px;
    background-color: #212121;
}


/*
 * +----------------------------------------------------_
 * |+-------------------++--------++-------------------+|
 * ||                   ||        ||                   ||
 * ||			|| chiller||                   ||
 * ||                   ||        ||                   ||
 * ||                   |=--------+|                   ||
 * ||     Air temp      |+--------+|     Beer temp     ||
 * ||                   ||        ||                   ||
 * ||                   || Temps  ||                   ||
 * ||                   || digits ||                   ||
 * |+-------------------++--------++-------------------+|
 * +----------------------------------------------------+
 */

#fermenter_thermometers {
    width: 720px;
    height: 295px;
    background-color: #252526;
    margin: 5px;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


#fermenter_tempdigits {
    width: 145px;
    height: 120px;
    float: left;
    margin-top: 170;
    background-color: #252526;
    border: 2px solid;
    border-color: #59b4d4;
    border-radius: 5px 5px 5px 5px;
}


/*
.LEDred_on {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #F40;
    border-radius: 50%;
    box-shadow: #000 0 0px 4px 1px, inset #C33 0 -1px 5px, #f44 0 2px 12px;
}

.LEDred_off {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #820;
    border-radius: 50%;
    box-shadow: #400 0 0px 1px 1px;
}

.LEDyellow_on {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #FF0;
    border-radius: 50%;
    box-shadow: #000 0 0px 4px 1px, inset #860 0 -1px 5px, #DD0 0 2px 12px;
}

.LEDyellow_off {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #A90;
    border-radius: 50%;
    box-shadow: #440 0 0px 1px 1px;
}

.LEDgreen_on {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #5E0;
    border-radius: 50%;
    box-shadow: #000 0 0px 4px 1px, inset #270 0 -1px 5px, #5D0 0 2px 12px;
}

.LEDgreen_off {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #270;
    border-radius: 50%;
    box-shadow: #250 0 0px 1px 1px;
}

.LEDblue_on {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #4AF;
    border-radius: 50%;
    box-shadow: #000 0 0px 4px 1px, inset #247 0 -1px 5px, #48F 0 2px 12px;
}

.LEDblue_off {
    margin: 5px auto;
    width: 12px;
    height: 12px;
    background-color: #137;
    border-radius: 50%;
    box-shadow: #024 0 0px 1px 1px;
}
*/


/*
 * New recipe wizzard
 */
#hintBase, #hintStyle {
    float: left;
    margin-top: 30px;
    margin-right: 20px;
    padding: 5px;
    width: 600px;
    color: yellow;
}
#section {
    margin: 5px;
}
#baseButtonsWrapper {
    float: right;
    margin-top: 30px;
    margin-right: 10px;
    width: 160px;
}
#styleButtonsWrapper {
    float: right;
    margin-top: 30px;
    margin-right: 10px;
    width: 320px;
}
#completedButtonsWrapper {
    float: right;
    margin-right: 10px;
    width: 320px;
    margin-top: 160px;
}
.nextButton {
    float: right;
    margin-left: 0px;
}
.backButton {
    float: left;
    margin-left: 10px;
}