﻿.dx-theme-generic .layout-content .ppp-calculator {
    background-image: url("../content/images/background-image-pppcalculator.jpg");
    background-repeat: no-repeat;
    background-size: auto 90%;
}


@media screen and (min-width: 1281px), (min-width: 1025px) and (max-width: 1280px),(min-width: 768px) and (max-width: 1024px), (min-width: 481px) and (max-width: 767px) and (orientation: landscape), (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {

    #left {
        width: 160px;
        float: left;
        padding-top: 70px;
    }

        #left > div {
            margin-bottom: 10px;
        }

    #main {
        overflow: auto;
        min-width: 590px;
        padding-left: 10px;
    }

    #required {
        width: 160px;
        padding: 0px;
        text-align: center;
    }

    #brand-logo {
        margin: 0px;
        width: 100%;
        text-align: center;
    }

    .assumptions {
        width: 280px;
        padding: 1px;
        float: left;
    }

        .assumptions > ul {
            list-style-type: square;
            font-weight: normal;
            padding-top: 5px;
            margin-left: 15px;
        }

    .illustration-request {
        padding: 1px;
        overflow: auto;
    }

    .left-col {
        text-align: left;
        width: 30px;
    }

    .right-col {
        text-align: right;
        width: 70px;
    }

    .dx-fieldset {
        padding: 10px 0 0 0;
        margin: 0 0 0 10px;
    }
}

@media (min-width: 320px) and (max-width: 480px),(min-width: 481px) and (max-width: 767px) {
    #left {
        width: 100%;
        float: left;
        padding-top: 10px;
        text-align: center;
    }

        #left > div {
            margin-bottom: 10px;
        }

    #brand-logo {
        margin: 21px 10px 0 10px;
        width: 100%;
        text-align: center;
    }

    #required {
        width: 100%;
        padding: 1px;
        text-align: center;
    }

    #main {
        width: 100%;
        padding-left: 0px;
    }

    .assumptions {
        width: 100%;
    }

    .information {
        text-align: left;
    }

    .right-col {
        width: 70px;
        text-align: left;
    }

    .illustration-request {
        width: 100%;
    }

    .dx-field-value-static {
        text-align: left;
    }
}

.bold {
    font-weight: bold;
}

.tooltip-age {
    color: #9ACA41;
    font-weight: bold;
    text-wrap: none;
    text-align: center;
    width: 100%;
    padding: 1px;
}

.tooltip-ppp {
    color: #f3961e;
}

.tooltip-rrsp {
    color: #CBCDCE;
}

.tooltip-diff {
    color: #9ACA41;
    font-weight: bold;
}

.tooltip-table {
    display: table;
}

.tooltip-row {
    display: table-row;
}

.tooltip-cell {
    display: table-cell;
    border: 0;
    padding: 1px;
}


.dx-fieldset {
    padding: 10px 0 0 0;
    margin: 0 0 0 10px;
}
