<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="wrapper"> <div class="container"> <div class="row"> <div class="col-12 text-center"> <div class="main-body"> <div class="inner-svg"> <svg height="50px" class="font-overarea"> <text x="6" y="41">473,022,056</text> <text x="3" y="39">473,022,056</text> <text x="0" y="36">473,022,056</text> </svg> </div> </div> </div> </div> </div> </div>

@import url('https://fonts.googleapis.com/css?family=Bungee+Inline|Londrina+Outline|Monoton'); /* font-family: 'Monoton', cursive; font-family: 'Bungee Inline', cursive; font-family: 'Londrina Outline', cursive; */ body { background-color: #ffcd3c; padding: 5px 25px; font-size: 18px; margin: 0; color: #444; font-family: 'Bungee Inline', cursive; } body,h1,h2,h3,h4,h5,h6,ul,li { margin: 0; padding: 0; } .main-body { height: 100vh; display: flex; align-items: center; justify-content: center; } .font-overarea { font-weight: 700; font-size: 2.25em; line-height: 1; } .font-overarea text { fill: #fefed5; stroke: #35d0ba; }