.rebate_table {
    margin: auto;
}

.rebate_first_cell {
    width: 250px;
    padding-bottom: 30px !important;
    padding-right: 10px !important;
}

.rebate_second_cell {
    color: black !important;
    font-weight: bold;
    font-size: 16px;
    width: 270px;
}

    .rebate_second_cell .small-text {
        color: black !important;
        font-size: 14px;
        padding-top: 10px;
    }

.rebate_logo_cell {
    padding-right: 10px !important;
    font-weight: bold;
    font-size: 16px;
    width: 50px;
}

.rebates-container {
    background-color: rgb(254, 230, 120);
    margin-left: 4%;
}

    .rebates-container .rebates-header {
        text-align: center;
        font-weight: bold;
        font-size: 18px;
        padding: 10px 0 0 0;
        font-family: var(--main-font-family);
        line-height: 16px;
    }

    .rebates-container .rebates-content {
        text-align: left;
    }

        .rebates-container .rebates-content div {
            border-bottom: 1px dashed #FFFFFF;
            padding: 5px 30px 10px 30px;
            color: #0163b1;
        }

        .rebates-container .rebates-content a {
            display: block;
            margin-top: 2px;
        }

    .rebates-container .rebates-footer {
        padding: 5px 30px 5px 30px;
        text-align: center;
    }

        .rebates-container .rebates-footer a, .rebates-container .rebates-content div a.rebates-link {
            font-weight: bold;
            text-decoration: underline;
        }

    .rebates-container .rebates-content img {
        width: calc(100% - 64px);
        margin: 8px 30px 0 30px;
        border-radius: 1px;
        border: solid 2px white; /* Evgeny: So that the rebates image has a nice white border around it, otherwise any elements in it
            adjusent to borders will stick to close to the container, and the whole thing doesn't look good then.
        */
    }

.triangle-container {
    width: 56px;
    height: 56px;
    display: inline-block;
    overflow: hidden;
    display: inline-block;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 5;
}

    .triangle-container .triangle {
        position: absolute;
        display: inline-block;
        top: -40px;
        right: -40px;
        width: 80px;
        height: 80px;
        background-color: #fce475;
        -webkit-transform: rotate(45deg); /* Chrome y Safari */
        -moz-transform: rotate(45deg); /* Firefox */
        transform: rotate(45deg); /* Newer browsers (incl IE9) */
        -o-transform: rotate(45deg); /* Opera */
        /*z-index: 4;*/
    }

        .triangle-container .triangle:hover {
            background-color: #FFD200;
        }

.triangle-rebate {
    position: absolute;
    top: 55px;
    left: 24px;
    font-size: 10px;
    color: #0163b1;
    font-weight: bold;
    font-family: var(--main-font-family);
}

.triangle-available {
    position: absolute;
    top: 65px;
    left: 20px;
    font-size: 10px;
    color: #0163b1;
    font-weight: bold;
    font-family: var(--main-font-family);
}