/* This Site CSS */

/* Curve button for tab */
.curve_button_tab1
{
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}


/*Responsive Table Css */

.table_responsive
{
    border: 1px solid #ccc;
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: 100%;
    table-layout: fixed;
}

.table_responsive caption
{
    font-size: 1.5em;
    margin: .5em 0 .75em;
}

.table_responsive tr
{
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    padding: .35em;
}

.table_responsive th, .table_responsive td
{
    padding: .625em;
    text-align: left;
    border: 1px solid #ccc;
}

.table_responsive th
{
    font-size: .85em;
    letter-spacing: .1em;
    text-transform: uppercase;
}

@media screen and (max-width: 600px)
{
    .table_responsive
    {
        border: 0;
    }

    .table_responsive caption
    {
        font-size: 1.3em;
    }

    .table_responsive thead
    {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .table_responsive tr
    {
        border-bottom: 3px solid #ddd;
        display: block;
        margin-bottom: .625em;
    }

    .table_responsive td
    {
        border-bottom: 1px solid #ddd;
        display: block;
        font-size: .8em;
        text-align: left;
    }

    .table_responsive td::before
    {
        /*                     * aria-label has no advantage, it won't be read inside a table                     content: attr(aria-label);                     */
        content: attr(data-label);
        float: left;
        font-weight: bold;
        text-transform: uppercase;
    }

    .table_responsive td:last-child
    {
        border-bottom: 1;
    }
}



/*Responsive Table (Center) Css */

.table_responsive_center
{
    border: 1px solid #ccc;
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: 100%;
    table-layout: fixed;
}

.table_responsive_center caption
{
    font-size: 1.5em;
    margin: .5em 0 .75em;
}

.table_responsive_center tr
{
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    padding: .35em;
}

.table_responsive_center th, .table_responsive_center td
{
    padding: .625em;
    text-align: center;
}

.table_responsive_center th
{
    font-size: .85em;
    letter-spacing: .1em;
    text-transform: uppercase;
}

@media screen and (max-width: 600px)
{
    .table_responsive_center
    {
        border: 0;
    }

    .table_responsive_center caption
    {
        font-size: 1.3em;
    }

    .table_responsive_center thead
    {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .table_responsive_center tr
    {
        border-bottom: 3px solid #ddd;
        display: block;
        margin-bottom: .625em;
    }

    .table_responsive_center td
    {
        border-bottom: 1px solid #ddd;
        display: block;
        font-size: .8em;
        text-align: right;
    }

    .table_responsive_center td::before
    {
        /*     * aria-label has no advantage, it won't be read inside a table     content: attr(aria-label);     */
        content: attr(data-label);
        float: left;
        font-weight: bold;
        text-transform: uppercase;
    }

    .table_responsive_center td:last-child
    {
        border-bottom: 0;
    }
}

/*Blue Background Button and Text White*/

.blue_button
{
    font-weight: bold;
    color: White;
    background: #408CFF;
    font-size: medium;
    font-weight: bold;
}

/*Make Profile photo circle*/


.circle_profile
{
    height: 100px;
    width: 100px;
    border-radius: 50%;
}

/*Menu Setting*/
.div_menu
{
    background-color: #408CFF;
}

.DynamicMenu
{
    display: none;
}
.menu ul li ul
{
    display: none;
}

.menu ul li
{
    position: relative;
    float: left;
    list-style: none;
}


/*Body Footer*/
.footer
{
    color: #FFFFFF;
    padding: 8px 0px 0px 0px;
    margin: 0px auto;
    text-align: center;
    line-height: normal;
    font-size: x-small;
}

/*Page Heading*/
.page_heading
{
    color: #0066CC;
    font-family: Century Gothic;
    font-size: medium;
    font-weight: bold;
}

.chart
{
    width: 100%;
    height: 100%;
    vertical-align: top;
}