﻿#ROICalc .button.action {
    text-decoration: none;
    padding-left: 10pt;
    padding-right: 10pt;
}

.roi-left h4, .roi-right h4 {
    font-size: 12pt;
}

#ROICalc h2 {
    color: black;
}

#ROICalc input[type='text'] {
    height: 20pt;
    width: 75px;
    text-align: right;
}

    #ROICalc input[type='text'].big-input {
        width: 100px;
    }

#ROICalc table td {
    background: none;
    border-collapse: collapse;
    border-bottom: #CCC 2px solid;
    height: 28pt;
    vertical-align: middle;
}

.RedText {
    color: #CC0000;
    font-weight: bold;
}

.RedTextUnbold {
    color: #CC0000;
}

.roi-right {
    border-top: #CCC 2px solid;
    padding-bottom: 10px;
    padding-top: 1.5em;
}

@media screen and (min-width:780px) {
    .roi-left {
        float: left;
        max-width: 65%;
        /*margin-left: 20px;*/
        border-right: #CCC 2px solid;
        padding-right: 20px;
    }

    .roi-right {
        padding-top: 0px;
        border: none;
        float: right;
        width: 33%;
    }

    .roi-right-box {
        margin-top: 0px;
        /*margin-right: 20px;*/
        border: 1px solid;
        border: none;
    }

        .roi-right-box h4 {
            font-weight: normal;
        }

        .roi-right-box .roi-calculation {
            font-weight: bold;
        }

        .roi-right-box .roi-actions {
            text-align: center;
        }

    #ROICalc a.button.action {
        min-width: 160px;
    }

    #ROICalc a.button.action {
        text-decoration: none;
        display: inline-block;
        height: 50px;
        line-height: 50px;
        text-align: center;
        color: #FFF;
        font-weight: bold;
        border: #312c23 1px solid;
        background: linear-gradient(to bottom, #a40c13 0%,#bb0c13 100%); /* W3C */
    }
}

@media screen and (min-width:1000px) {
    .roi-left h4, .roi-right h4 {
        font-size: 12pt;
    }
}
