{literal}
<style>


    .prntbl2 {
        padding:0px !important;
        width:95% !important;
        margin:0px auto !important;
    }.prntbl2 table{
        border-collapse: collapse !important;
        width:100% !important;
        margin:0px !important;
        padding:0px !important;
    }
    .prntbl2 table th {
        background-color: #2D2D2D !important;
        background: #2D2D2D !important;
        border:0px solid #000000 !important;
        border-width:0px 0px 1px 1px !important;
        font-size:15px !important;
        font-family:Arial !important;
        font-weight:bold !important;
        color: #FFFFFF !important;
        text-align: center !important;
    }.prntbl2 tr:hover td{

    }
    .prntbl2 tr:nth-child(odd){background-color: #E0E0E0 !important;}
    .prntbl2 tr:nth-child(even)    { background-color:#ffffff !important; }
    .prntbl2 td{
        border:1px solid #000000 !important;
        padding: 0px 3px !important;
        font-size: 13px !important;
        font-family: tahoma !important;
        color:#000000 !important;
        //    text-align: left !important;
    }


    .prntbl2 th, .prntbl2 tt, .prntbl2 td {
        line-height: 20px !important;
        padding: 1px 5px !important;


    }

    .prntbl2 span {
        font-weight: 700;
    }

</style>

{/literal}
<div class="prntbl2">
    {literal}
    <style>


        .prntbl2 {
            padding:0px !important;
            width:95% !important;
            margin:0px auto !important;
        }.prntbl2 table{
            border-collapse: collapse !important;
            width:100% !important;
            margin:0px !important;
            padding:0px !important;
        }
        .prntbl2 table th {
            background-color: #2D2D2D !important;
            background: #2D2D2D !important;
            border:0px solid #000000 !important;
            border-width:0px 0px 1px 1px !important;
            font-size:15px !important;
            font-family:Arial !important;
            font-weight:bold !important;
            color: #FFFFFF !important;
            text-align: center !important;
        }.prntbl2 tr:hover td{

        }
        .prntbl2 tr:nth-child(odd){background-color: #E0E0E0 !important;}
        .prntbl2 tr:nth-child(even)    { background-color:#ffffff !important; }
        .prntbl2 td{
            border:1px solid #000000 !important;
            padding: 0px 3px !important;
            font-size: 13px !important;
            font-family: tahoma !important;
            color:#000000 !important;
            //       text-align: left !important;
        }


        .prntbl2 th, .prntbl2 tt, .prntbl2 td {
            line-height: 20px !important;
            padding: 1px 5px !important;


        }

        .prntbl2 span {
            font-weight: 700;
        }

    </style>

    {/literal}

    <div class="prntbl2">
        <center><h4 class="modal-title">وسيلة المعرفة بالمركز  </h4></center>
        <center><h4 class="modal-title">  الفترة من : {$fromDate}   -  إلى  :  {$toDate}    </h4></center>

        <table class="table table-hover portlet light bg-inverse rtl" id="repTable" style="width: 100%;">
            <thead>
                <tr>
                    <th  style="width: 10px !important;">#</th>
                    <th >  الخدمة  </th>
                    <th >  عدد المرضى   </th>
                </tr>
            </thead>
            <tbody>
                {assign var="i" value="1"}
                {foreach $knownfroms as $data}
                <tr>
                    <td>{$i}</td>
                    <td class="txtr"> {$data.name}</td>
                    <td class="txtc"> {$data.patCount}</td>
                </tr>
                {assign var="i" value={$i+1}}
                {/foreach}
            </tbody>
        </table>

    </div>