I'm using FileSaver.js library and WordExport.js for exporting the word documents using JavaScript, jQuery, everything is working fine, but page margin is not working, i have tried it with multiple ways but couldn't get success, here is the code. following div will be exported

<div class="col-md-12" id="page-content">
    <style type="text/css">
        @page {
            mso-page-orientation: portrait;
            size: 21cm 29.7cm;
            margin: 1cm 1cm 1cm 1cm;
        }
        @page Section1 {
            mso-header-margin: .2in;
            mso-footer-margin: .5in;
            mso-header: h1;
            mso-footer: f1;
        }

        div.Section1 {
            page: Section1;
        }

    </style>
    <div class="firstpage Section1" style="margin:10.0pt 20.0pt 10.0pt 20.0pt; !important">
        <h2>Topic of template</h2>
        <h5>Prepared for</h5>
        <h5>Name of Company</h5>
        
        <br clear=all style='mso-special-character:line-break; page-break-before:always'>
    </div>
    <br clear=all style='page-break-before:always; mso-break-type:section-break'>
    <div class="otherpages"> 
        <p>other pages stuff</p> 
    </div>
</div>

Thanks in advance.