/* 
=-=-=-=-=-=-=-=-=-=-=-=-=-=-

COLORS
=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Color key - Optimal:    #BCEE68
Color key - Acceptable: #FBEC5D
Color key - Warning:    #FF7722
Project Specs title:    #497cbb
Module Specs title:     #497cbb
Inverter Specs title:   #497cbb
Recommendations title:  #497cbb
Field warning:          red
=-=-=-=-=-=-=-=-=-=-=-=-=-=-
*/

#content {
    height: auto;
    margin-bottom: -27px;
}

#sizerContentLeft {
    /* position: absolute; top: 180px; left: 4px; */
    position: absolute; top: 10px; left: 4px;
    background-color: #ececec;
    width: 150px;
    text-align: left;
}

#sizerContentRight {
    width: 900px;
    margin-top: 0px;
    padding-top: 5px;
    margin-left: 175px;
    margin-right: 30px;
    text-align: left;
    line-height: 150%;
    height: 100%;
    padding-bottom: 5px;
}

/* Side Menu Classes */

/* set the image to use and establish the lower-right position */ 
.sizerMenubox, .sizerMenubox_body, .sizerMenubox_head { 
    background: transparent url(/images/menu_box.png) no-repeat bottom right; 
}

.sizerMenubox ul{
    list-style:none;
}

.sizerMenubox { 
    padding-right: 1px; /* the gap on the right edge of the image (not content padding) */ 
} 

/* set the top-right image */ 
.sizerMenubox_head { 
    background-position: top right; margin-right: -1px; /* pull the right image over on top of border */ 
    padding-right: 0px; /* right-image-gap + right-inside padding */
    padding-top: 5px;
} 

/* set the top-left image */ 
.sizerMenubox_head img { 
    background-position: top left; margin: 0; /* reset main site styles*/ 
    border: 0px; /* ditto */ 
    padding: 1px 0 1px 0px; /* padding-left = image gap + interior padding ... no padding-right */ 
    height: auto !important; height: 1%; /* IE Hack */ 
} 

/* set the lower-left corner image */ 
.sizerMenubox_body { 
    background-position: bottom left; margin-right: 0px; /* interior-padding right */ 
    padding: 1px 0 1px 0px; /* mirror .cssbox_head right/left */ 
} 

.sizerMenubox_body strong { 
    padding-left: 5px; /* mirror .cssbox_head right/left */ 
} 

.sizerContentRight_head {
    display: none;
}

/* Color Coding Keys 
=-=-=-=-=-=-=-=-=-=-=-=-=-=- */

.color_keys {
    border: black solid 1px;
    margin: 15%;
    display: none;
}

.color_keys table {
    width: 100%;
}

.color_keys table td {
    width: 100%;
    text-align: center;
}

.color_keys_title {
    border-bottom: black solid 1px;
    text-align: center;
    font-weight: bold;
}

.color_keys_optimal {
    /*    background-color: #BCEE68;  */
}

.color_keys_acceptable {
    /*    background-color: #FBEC5D; */
}

.color_keys_warning {
    /*    background-color: #FF7722; */
}

#string_sizer {
    width: 100%;
    margin-top: 0px;
    position: relative;
}

#string_sizer td {
}

/* Project Specifications Section 
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */

#instructions {
    background-color: #F5F6CE;
    border: black solid 1px;
    width: 872px; 
    margin-top: 7px;
    clear: left; 
    padding: 5px 5px 5px 5px;
    font-weight: bold;
    margin-bottom: 7px;
}

#top_divs {
    height: 205px;    
}

#project_specs {
    border: black solid 1px;
    width: 44%;
    float: left;
    margin-bottom: 7px;
    height: 100%;
}

.highlighted {
    background-color: #F5F6CE;
}

.unhighlighted {
    background-color: transparent;
}

#project_specs table {
    width: 100%;
}

.project_specs_reset {
    width: 100%;
    text-align: right;
}

.project_specs_title {
    font-size: 16px; 
    line-height: 100%; 
    color: #497cbb;	
    font-family: Arial, Helvetica, sans-serif; 
    font-weight : bold; 
    font-style: italic;
    width: 100%;
    border-bottom: black solid 1px;
    padding: 5px 5px 5px 5px;
    background-color: #CCCCCC;
}

.project_specs_value {
    width: 50%;
    padding-left: 10px;
}

.project_specs_value fieldset {
    border: none;
    padding-bottom: 3px;
}

.project_specs_value select {
    width: 150px;
}

.project_specs_value fieldset legend {
    font-weight: bold;
}

/* Module Specifications Section 
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */

#module_specs {
    border: black solid 1px;
    width: 52%;
    float: left;
    margin-left: 14px;
    height: 100%;
    margin-bottom: 7px;
}

#module_specs table {
    width: 100%;
}

.module_specs_row td {
    border-right: gray solid 1px;
    border-bottom: gray solid 1px;
}

.module_specs_title {
    font-size: 16px; 
    line-height: 100%; 
    color: #497cbb;	
    font-family: Arial, Helvetica, sans-serif; 
    font-weight : bold;
    font-style: italic;
    padding: 5px 5px 5px 5px;
    background-color: #CCCCCC;
}

.module_specs_subtitle td {
    font-size: 12px;
    font-weight: bold;
    border-top: black solid 1px;
    border-bottom: gray solid 1px;
    text-align: center;
}

.module_specs_label {
    font-weight: bold;
    text-align: center;
}

.module_specs_value {
    text-align: center;
}

/* Inverter Specifications Section 
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */

#inverter_specs {
    border: black solid 1px;
    width: 880px; 
    margin-top: 7px;
    clear: left; 
}

#inverter_specs table {
    width: 100%
}

.inverter_specs_title {
    font-size: 16px; 
    line-height: 100%; 
    color: #497cbb;	
    font-family: Arial, Helvetica, sans-serif; 
    font-weight : bold;
    font-style: italic;
    padding: 5px 5px 5px 5px;
    background-color: #CCCCCC;
}

.inverter_specs_row_title {
    font-size: 10px;
    font-weight: bold;
    text-align: center;
}

.inverter_specs_col_title {
    border-top: gray solid 1px;
    border-right: gray solid 1px;
    text-align: center;
}

.inverter_specs_row td {
    border-top: gray solid 1px;
    border-right: gray solid 1px;
    text-align: center;
}


.inverter_specs_col_title {
    font-weight: bold;
    text-align: center;
}

.inverter_specs_label {
    font-weight: bold;
    width: 100px;
    text-align: center;
}

.inverter_specs_value {
    width: 100px;
    text-align: center;
}

/* String Calculations Section 
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */

#recommendations {
    border: black solid 1px;
    width: 880px;
    margin-top: 7px;
    clear: left; 
}

.string_calc_head {
    width: 100%;
}

.string_calc_title {
    font-size: 16px; 
    line-height: 100%; 
    color: #497cbb;	
    font-family: Arial, Helvetica, sans-serif; 
    font-weight : bold;
    font-style: italic;
    padding: 5px 5px 5px 5px;
    background-color: #CCCCCC;
}

.string_calc_title_left {
    float: left;
}

.string_calc_title_right {
    float: right;
}

.pdf_button {
    background-image: url(/images/pdf-medium.jpg);
    background-repeat: no-repeat;
    background-position: left;
    background-color: transparent;
    width: 260px;
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif; 
    font-weight : bold;
    color: #497cbb;	
}

.string_calc_row_title {
    font-size: 12px;
    font-weight: bold;
    border-top: black solid 1px;
}

.string_calc_row_title td {
    border-bottom: black solid 1px;
}

.string_calc_no_results {
    text-align: center;
    font-weight: bold;
}

.string_calc_col_title {
    vertical-align: bottom;
    font-weight: bold;
    text-align: center;
    width: 80px;
}

.string_calc_col_title_over_scrollbar {
    width: 15px;
    border-right: none;    
}

.string_calc_row td {
    text-align: center;
}

.string_calc_checkbox_title {
    width: 20px;
    text-align: center;
}

.string_calc_col_title_short {
    vertical-align: bottom;
    text-align: center;
    font-weight: bold;
    width: 50px;
}


.string_calc_checkbox {
    border-bottom: gray solid 1px;
    border-right: gray solid 1px;    
    width: 20px;
    text-align: center;
}

.string_calc_values {
    overflow: scroll;
    height: 200px;
    overflow-x: hidden;
}

.string_calc_values table {
    width: 863px;
}

.string_calc_value_short {
    border-bottom: gray solid 1px;
    border-right: gray solid 1px;    
    width: 50px;
    text-align: center;
}

.string_calc_value {
    width: 80px;
    text-align: center;
    border-bottom: gray solid 1px;
    border-right: gray solid 1px;    
}
        
.string_calc_value_warning_flag {
    color: red;
    font-weight: bold;
}

/* Progress Indicator Section 
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */
#progress_indicator{
    padding-top: 20px;
    text-align: center;
    height: 100px;
    width: 880px;
    clear: left;
}

#update_progress_indicator{
    padding-top: 20px;
    text-align: center;
    height: 100px;
    width: 880px;
    clear: left;
}

#progress_indicator_text {
    font-weight: bold;
    font-size: 20px;
    line-height: normal;
}

/* Terminology Section 
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- */
#terms_string_sizer h2 {
    background: transparent;
}

#terms_string_sizer div {
    padding-top: 15px;
    padding-left: 5px;
}

.terms_definition {
    padding-top: 15px;
    padding-left: 5px;
}

#terms_string_sizer div li dfn li {
    padding-left: 25px;
    list-style-position: inside;
    list-style-type: disc;
}