<div class="container h-75 d-flex justify-content-center main-content">
    <div class="mt-auto mb-6">
        <div class="row text-center">
            <div class="col">
                <div class="row text-center">
                    <div class="col">
                        <select class="form-control form-control-lg font-list mb-4">
                            <!-- Bug here with all options -->
                            <option id="fancy">𝙵𝚊𝚗𝚌𝚢</option>
                            <option id="gothic">𝔊𝔬𝔱𝔥𝔦𝔠</option>
                            <option id="gothic_bold">𝕲𝖔𝖙𝖍𝖎𝖈 𝕭𝖔𝖑𝖉</option>
                            <option id="lined">𝕃𝕚𝕟𝕖𝕕</option>
                            <option id="very_tiny">ⱽᵉʳʸ ᵀⁱⁿʸ</option>
                            <option id="tiny">ᴛɪɴʏ</option>
                            <option id="bold">𝐁𝐨𝐥𝐝</option>
                            <option id="italic">𝘐𝘵𝘢𝘭𝘪𝘤</option>
                            <option id="bold_italic">𝘽𝙤𝙡𝙙 𝙄𝙩𝙖𝙡𝙞𝙘</option>
                            <option id="underline">U̲n̲d̲e̲r̲l̲i̲n̲e̲</option>
                            <option id="cursive">𝒞𝓊𝓇𝓈𝒾𝓋𝑒</option>
                            <option id="cursive_bold">𝓒𝓾𝓻𝓼𝓲𝓿𝓮 𝓑𝓸𝓵𝓭</option>
                            <option id="blade">ᗷᒪᗩᗪE</option>
                            <option id="squared">🅂🅀🅄🄰🅁🄴🄳</option>
                            <option id="rounded">Ⓡⓞⓤⓝⓓⓔⓓ</option>
                            <option id="full_square">🅵🆄🅻🅻 🆂🆀🆄🅰🆁🅴</option>
                            <option id="wingdings">Wingdings</option>
                        </select>
                        <form style="width: 50vw;">
                            <div class="form-group">
                                <label for="exampleFormControlTextarea1" class="tr" key="normal_text">Normal Text</label>
                                <textarea class="form-control" id="NormalTextarea" placeholder="Normal text here…" rows="5"></textarea>
                            </div>
                        </form>
                        <form style="width: 50vw;">
                            <div class="form-group">
                                <label for="exampleFormControlTextarea1" class="tr" key="fancy_text">Fancy Text</label>
                                <textarea class="form-control" id="FancyTextarea" placeholder="Fancy text here…" rows="5" readonly></textarea>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>