﻿.WaterMark {
    color: Gray;
    font-style: italic;
}

/*#calcFooter {
    height: 20px;
    padding-bottom: 6px;
    background-color: Black;
}*/

.titleText {
    font-weight: bold;
    font-size: 13px;
    text-align: center;
}

.equip-type-select {
    display: inline-block;
    margin: 3rem 20px 0 20px;
    text-align: center;
}

    .equip-type-select a {
        background-repeat: no-repeat;
        background-position: center;
        background-size: 38%;
        border: solid 1px lightgray;
        border-radius: 5px;
        box-shadow: 1px 1px 3px gray;
        margin-top: 5px;
    }


.footNote {
    font-size: 7pt;
}

.validatorField {
    display: block;
    height: 20px;
    line-height: 20px;
    font-size: 10px;
    /*Margin-Left: Mobile Screen Size Version*/
    margin-left: 15px;
}

.hpValidatorField {
    display: block;
    height: 20px;
    line-height: 20px;
    margin-left: 15px;
    font-size: 12px;
}

#electicLookupLink {
    font-size: 0.8em;
    padding-left: 10px;
}

#ComparisonDetailsTableMobile > tbody > .fieldLineItem:nth-child(2),
#ComparisonDetailsTableMobile > tbody > .fieldLineItem:nth-child(4),
#ComparisonDetailsTableMobile > tbody > .fieldLineItem:nth-child(5),
#ComparisonDetailsTableMobile > tbody > .fieldLineItem:nth-child(7),
#ComparisonDetailsTableMobile > tbody > .fieldLineItem:nth-child(9),
#ComparisonDetailsTableMobile > tbody > .fieldLineItem:nth-child(11),
#ComparisonDetailsTableMobile > tbody > .fieldLineItem:nth-child(14),
#ComparisonDetailsTableMobile > tbody > .fieldLineItem:nth-child(16),
#WaterHeaterSavingsTable > tbody > .fieldLineItem:nth-child(even) {
    background-color: #EBEBEB;
}

.fieldResult {
    text-align: right;
}

#ComparisonDetailsTableMobile .fieldResult {
    width: 150px;
    text-align: center;
}

#WaterHeaterSavingsTable .fieldResult {
    width: 115px;
}

.validatorFieldTop {
    display: block;
    height: 20px;
    line-height: 20px;
    font-size: 10px;
    /*Margin-Left: Mobile Screen Size Version*/
    margin-left: 15px;
}

.ProductImage {
    text-align: center;
    padding: 5px 20px 5px 20px;
    width: 30%;
}

    .ProductImage img {
        display: none;
    }

.disclaimer {
    color: Gray;
    margin: 0;
}

.disclaimerTitle {
    margin-top: 8rem;
}

#CalculateUpdateProgress {
    width: 580px;
    background-color: #FFC080;
    left: 0px;
    font-size: 12px;
    font-weight: bold;
    height: 15px;
}

#ClycloneModelTable {
    /*width: 460px;*/
    min-width: 250px;
}

a.WaterHeaterLink:link, a.WaterHeaterLink:visited {
    display: block;
    width: 250px;
    height: 250px;
}

a.HeatPumpsLink:link, a.HeatPumpsLink:visited {
    display: block;
    width: 250px;
    height: 250px;
}

.fieldValue.currency {
    position: relative;
}

    .fieldValue.currency input {
        padding-left: 25px;
    }

    .fieldValue.currency::after {
        content: "$";
        position: absolute;
        left: 8px;
        top: 50%;
        transform: translateY(-50%);
        color: #000;
    }



#WaterHeaterSavingsTable .fieldLineItem {
    /*Mobile Screen Size Version*/
    display: table-row !important;
}

#ComparisonDetailsTable {
    /*Mobile Screen Size Version*/
    display: none;
}

#ComparisonDetailsTableMobile {
    /*Mobile Screen Size Version*/
    display: block;
    text-align: center;
}

    #ComparisonDetailsTableMobile .fieldLineItem {
        /*Mobile Screen Size Version*/
        display: table-row !important;
    }

.gapRow td {
    padding: 10px;
}

.tableHeader {
    font-size: 1.2em;
}

#ComparisonDetailsTable .fieldName,
#ComparisonDetailsTableMobile .fieldName,
#WaterHeaterSavingsTable .fieldName {
    /*Mobile Screen Size Version*/
    padding: 3px 10px 3px 10px;
}

.subLineItem {
    width: 100px;
}


button, input[type=button], input[type=submit] {
    /*Mobile Screen Size Version*/
    margin-left: auto;
    margin-right: auto;
    margin-top: 5rem;
}


@media only screen and (min-width: 1250px) {

    .ProductImage img {
        display: inline-block;
        width: 100px;
        /*position: absolute;
        top: 300px;*/
    }

    table > tbody > .fieldLineItem:nth-child(even) {
        background-color: #EBEBEB;
    }

    #WaterHeaterSavingsTable .fieldLineItem {
        /*Desktop Screen Size Version*/
        display: flex;
    }

    #WaterHeaterSavingsTable .fieldResult {
        width: 306px;
    }

    #ComparisonDetailsTable {
        /*Desktop Screen Size Version*/
        display: block;
    }

    #ComparisonDetailsTableMobile {
        /*Desktop Screen Size Version*/
        display: none;
    }

    table .fieldName {
        /*Desktop Screen Size Version*/
        padding: 0;
    }

    .validatorFieldTop {
        /*Desktop Screen Size Version*/
        margin-left: 265px;
    }

    .validatorField {
        /*Desktop Screen Size Version*/
        margin-left: 265px;
    }

    button, input[type=button], input[type=submit] {
        /*Desktop Screen Size Version*/
        margin: unset;
        margin-top: 5rem;
    }
}
