﻿
.flex-rectangle-top {
    width: 32%
}


.flex-rectangle {
    width: 32%;
    /*background: rgba(70, 130, 180, 0.50);*/
    background: rgba(201, 74, 83, 0.50);  /* red */
    /*border-width: 2px;*/
}

.flex-rectangle:before {
    content: "";
    display: block;
    padding-top: 8%;
}

.flex-rectangle-boxtwo {
    width: 32%;
    background: rgba(176, 196, 222, 0.50); /* blue */
    border-width: 2px;
}

.flex-rectangle-boxtwo:before {
    content: "";
    display: block;
    padding-top: 8%;
}

.flex-rectangle-boxthree {
    width: 32%;
    /*background: rgba(222, 184, 135, 0.50);   orange */
    background: rgba(209, 146, 228, 0.50);
    border-width: 2px;
}

.flex-rectangle-boxthree:before {
    content: "";
    display: block;
    padding-top: 8%;
}

.flex-rectangle-boxfour {
    width: 32%;
    /*background: rgba(250, 128, 114, 0.50);*/
    background: rgba(104, 154, 44, 0.50);  /* green */
    background-color: lightgreen;
    border-width: 2px;
}

    .flex-rectangle-boxfour:before {
        content: "";
        display: block;
        padding-top: 8%;
    }

.impactcol {
    color: mediumblue;
    background-color: aqua;
    font-weight: bold;
    
}

.plan1 {
    color: mediumblue;
    font-weight: bold;
}

.plan2 {
    color: mediumseagreen;
    font-weight: bold;
}

.plan3 {
    color: crimson;
    font-weight: bold;
}

.plan4 {
    color: blueviolet;
    font-weight: bold;

}

.age {

    font-weight: bold;
}

#rendermargin {
    margin-left: 10px;
}

#n4title {
    font-size: x-large;
    align-self: center;
}

/* DivTable.com */
.divTable {
    display: table;
    width: 100%;
}

.divTableRow {
    display: table-row;
}

.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
}

.divTableCell, .divTableHead {
    border: 2px solid #999999;
    display: table-cell;
    padding: 3px 10px;
}

.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bolder;
    font-size: larger;
}

.divTableFoot {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}

.divTableBody {
    display: table-row-group;
    font-weight: bold;
}

.divTableFirstRow {
    font-size: x-large;
}



.tccbuttontuquoise {
    margin-right: 10px;
    width: 100px;
    background: #1abc9c;
    border-bottom: #16a085 3px solid;
    border-left: #16a085 1px solid;
    border-right: #16a085 1px solid;
    border-radius: 6px;
    text-align: center;
    color: white;
    padding: 10px;
    float: left;
    font-size: 12px;
    font-weight: 800;
}

    .tccbuttontuquoise:hover {
        opacity: 0.8;
    }

    .tccbuttontuquoise:active {
        width: 100px;
        background: #18B495;
        border-bottom: #16a085 1px solid;
        border-left: #16a085 1px solid;
        border-right: #16a085 1px solid;
        border-radius: 6px;
        text-align: center;
        color: white;
        padding: 10px;
        margin-top: 3px;
        float: left;
    }

.tccbuttonred {
    margin-right: 10px;
    width: 300px;
    background: #FF4d4d;
    border-bottom: #16a085 3px solid;
    border-left: #16a085 1px solid;
    border-right: #16a085 1px solid;
    border-radius: 6px;
    text-align: center;
    color: white;
    padding: 10px;
    /*float: left;*/
    font-size: 14px;
    font-weight: 800;
}

    .tccbuttonred:hover {
        opacity: 0.8;
    }

    .tccbuttonred:active {
        width: 300px;
        background: #FF0000;
        border-bottom: #16a085 1px solid;
        border-left: #16a085 1px solid;
        border-right: #16a085 1px solid;
        border-radius: 6px;
        text-align: center;
        color: white;
        padding: 10px;
        margin-top: 3px;
        /*float: left;*/
    }


.tccbuttonblue {
    margin-right: 10px;
    width: 150px;
    background: #2c405e;
    border-bottom: #2980b9 3px solid;
    border-left: #2980b9 1px solid;
    border-right: #2980b9 1px solid;
    border-radius: 6px;
    text-align: center;
    color: white;
    padding: 10px;
    /*float: left; */
    font-size: 12px;
    font-weight: 800;
}

    .tccbuttonblue:hover {
        opacity: 0.8;
        transition-delay: 1s;
    }


    .tccbuttonblue:active {
        width: 150px;
        background: #2385C7;
        border-bottom: #2980b9 1px solid;
        border-left: #2980b9 1px solid;
        border-right: #2980b9 1px solid;
        border-radius: 6px;
        text-align: center;
        color: white;
        padding: 10px;
        margin-top: 3px;
        /*float: left; */
    }

    .tccbuttonblue:disabled {
        opacity: 0.5; 
/*        background-color: lightgreen;*/
    }

    .tccbuttonblue.tccbuttonblue-small {
        width: 75px;
    
    }

.tccbuttondarkgrey {
    margin-right: 10px;
    width: 100px;
    background: #34495e;
    border-bottom: #2c3e50 3px solid;
    border-left: #2c3e50 1px solid;
    border-right: #2c3e50 1px solid;
    border-radius: 6px;
    text-align: center;
    color: white;
    padding: 10px;
    float: left;
    font-size: 12px;
    font-weight: 800;
}

    .tccbuttondarkgrey:hover {
        opacity: 0.8;
    }

    .tccbuttondarkgrey:active {
        width: 100px;
        background: #2D3F51;
        border-bottom: #2c3e50 1px solid;
        border-left: #2c3e50 1px solid;
        border-right: #2c3e50 1px solid;
        border-radius: 6px;
        text-align: center;
        color: white;
        padding: 10px;
        margin-top: 3px;
        float: left;
    }

/* Label Font*/

.tcc_small {
    font-size: 12px;
}


/* Tooltip */
.tcctooltip + .tooltip > .tooltip-inner {
    background-color: #73AD21;
    color: #FFFFFF;
    border: 1px solid green;
    display: inline-block;
    padding: 15px;
    font-size: 20px;
}
/* Tooltip on top */
.test + .tooltip.top > .tooltip-arrow {
    border-top: 5px solid green;
}
/* Tooltip on bottom */
.test + .tooltip.bottom > .tooltip-arrow {
    border-bottom: 5px solid blue;
}
/* Tooltip on left */
.test + .tooltip.left > .tooltip-arrow {
    border-left: 5px solid red;
}
/* Tooltip on right */
.test + .tooltip.right > .tooltip-arrow {
    border-right: 5px solid black;
}

.totalmemberspan {
    margin-left: 10px;

}


td.tcc_td_colhead {
    width: 240px;
    background-color: #2e75b6;
    color: white;
    text-align: center;
    font-weight: bold;
    font-size: large;
    font-family: Arial, Helvetica, sans-serif;
    border: 1px solid #dddddd;
    padding: 8px;
}


td.tcc_td_label {
    width: 240px;
    background-color: white;
    text-align: right;
    font-weight: 500;
    font-size: 14px;
    font-family: Arial, Helvetica, sans-serif;
    border: 1px solid #dddddd;
    padding: 8px;
}


.required::after {
    content: " *";
    color: red
}

/*.slick-column-name {
    white-space: normal;
    display: table-cell;
    vertical-align: middle;
    height: 100px;
    background: red;
}*/


