﻿section {
    padding: 30px 0;
}
.sno {
    width: 100px;
}
table {
    border: 1px solid #ccc;
    border-collapse: collapse;
    
    padding: 0;
    width: 100%;
    table-layout: fixed;
}
.css-serial {
    counter-reset: serial-number; /* Set the serial number counter to 0 */
}

    .css-serial td:first-child:before {
        counter-increment: serial-number; /* Increment the serial number counter */
        content: counter(serial-number); /* Display the counter */
    }
    table caption {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
        color: #6c757d;
        text-align: center;
        caption-side: top;
        position: relative;
        margin: .5em 0 1.75em;
        font-size: 25px;
        font-weight: 600;
        font-family: "Montserrat", sans-serif;
        color: #222222;
    }
.NodalEmailID-head:after {
    content: "";
    position: absolute;
    display: block;
    width: 50px;
    height: 3px;
    background: var(--color-primary);
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

    table tr {
        background-color: #f8f8f8;
        border: 1px solid #ddd;
        padding: .35em;
    }

   


    table th,
    table td {
        padding: .625em;
        text-align: center;
        border-width: 1px;
    }

    table th {
        font-size: 1em;
        letter-spacing: .1em;
        text-transform: uppercase;
    }

@media screen and (max-width: 600px) {
    section {
        padding: 10px 0;
    }
    table {
        border: 0;
    }
    /*td:nth-of-type(1) {
       text-align:left;
       width:5px;
    }*/


   table th{
       padding:5px 1px;
       font-size:12px;
       font-weight:bold;
        }

        .sno {
            width: 40px;
        }
    .Nodal{
        width:25%;
    }
    
    table caption {
        font-size: 1.3em;
        margin: .5em 0 0.95em;
    }

        table thead {
            border: none;
            clip: rect(0 0 0 0);
            height: 1px;
            margin: -1px;
            overflow: hidden;
            padding: 0;
            /*position: absolute;*/
            font-size:0.55em;
            width: 1px;

        }

        table tr {
            border-bottom: 3px solid #ddd;
            /*display: block;*/
            margin-bottom: .625em;
        }

    table td {
        border-bottom: 1px solid #ddd;
        /*display: block;*/
        font-size: .8em;
        text-align: center;
        word-break: break-word;
        padding: 5px 1px;
    }

            table td::before {
                /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */              
                content: attr(data-label);
               
                text-align:center;
                text-transform: uppercase;
            }

            table td:last-child {
                border-bottom: 0;
            }
}














/* general styling */
body {
    font-family: var(--font-default);
    line-height: 1.25;
}
