[Character] Receipt (Safehouse Code)

  <div class="mx-auto" style="max-width:400px;">
    
    <div class="col-12 card rounded-0 p-3">
        <div class="col justify-content-center text-center">
            <h1 style="font-family:helvetica; font-weight:bold; text-transform:uppercase; font-size:2.5em;">Thank you for your purchase!</h1></div>
        <div class="col justify-content-center"><div class="text-muted" style="font-style:italic; font-family:MS gothic; font-size:11px;">⚠️ This profile has not been updated yet.</div></div>
            
            <hr style="visibility:hidden;">
            
        <center><b>--- PURCHASED ---</b></center>
        <div class="row">
            
            <!-- DATE PURCHASED -->
            <div class="col-4 text-center">
                <p class="mb-0">{{!DATE PURCHASED!}}</p>
                <p class="text-uppercase" style="font-weight:700; font-size:10px;">On</p>
            </div>
            
            <!-- PREVIOUS OWNER -->
            <div class="col-4 text-center">
                <p class="mb-0"><a href="{{u!LINK TO PREV OWNER!}}">{{!PREVIOUS OWNER!}}</a></p>
                <p class="text-uppercase" style="font-weight:700; font-size:10px;">FROM</p>
            </div>
            
            <!-- VALUE PURCHASED FOR -->
            <div class="col-4 text-center">
                <p class="mb-0">{{!VALUE!}}</p>
                <p class="text-uppercase" style="font-weight:700; font-size:10px;">FOR</p>
            </div>
        </div>
        
        <hr style="visibility:hidden">
        
        <center><b>--- TRANSFERRED ---</b></center>
        <div class="row">
            <div class="col-6 text-center">
                <p class="mb-0">{{!DATE TRANSFERRED!}}</p>
                <p class="text-uppercase" style="font-weight:700; font-size:10px;">ON</p>
            </div>
            <div class="col-6 text-center">
                <p class="mb-0">{{!TRANSFERRED TO!}}</p>
                <p class="text-uppercase" style="font-weight:700; font-size:10px;">TO</p>
            </div>
        </div>
        
        <hr width=75%>
        
        <!-- ITEM DETAILS -->
        <div class="col-11 mx-auto">
            {{%Item Details%
            <div class="row p-2 justify-content-between">
            <span>{{%ITEM 1%}}</span>
            <span>{{%↳item 1 cost%}}</span>
            </div>
            %end%}}
            
        </div>
        
        <!-- TOTAL -->
        <div class="col py-2 justify-content-end">
                <span class="px-2"><b>TOTAL</b></span>
                <span>{{!TOTAL VALUE!}}</span>
            </div>
        
        <hr width=75%>
        
        <!-- ADVERTISEMENT -->
        
        <div class="col text-center">
            <b>★ LIKE THIS DESIGN?</b>
        <br>
        <a href="{{u!LINK TO OTHER SALES!}}">Check out my other sales!</a>
        
        <div class="row no-gutters my-2">
            <div class="col m-1"><img src="{{!IMG LINK 1!}}" class="img-thumbnail rounded-0"></div>
            <div class="col m-1"><img src="{{!IMG LINK 2!}}" class="img-thumbnail rounded-0"></div>
            <div class="col m-1"><img src="{{!IMG LINK 3!}}" class="img-thumbnail rounded-0"></div>
        </div>
        
        
        </div>
        
    </div>
    
</div>

<center><a href="https://toyhou.se/26178230.character-receipt" target="_blank" style="font-size:9px; color:#CCC;"><i class="fas fa-code"></i></a></center>