<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <h1>On earth there is no heaven, but there are pieces of it.</h1> <div class="globe_r"></div> </div>

body{ padding:30px 0 150px; background: url(https://img4.goodfon.com/original/1920x1200/c/7f/planet-moon-stars-nebula-galaxy-cosmos-digital-art-artwork-s.jpg); background-size:cover; } h1{ color:#fff; text-transform:uppercase;} .globe_r { width: 310px; height: 310px; background: url(https://c1.staticflickr.com/1/822/39104204560_02eb66da13_b.jpg); border-radius: 100%; background-size: 380px; animation: spin 15s infinite linear; } @keyframes spin { 0% { background-position-x: 0; } 100% { background-position-x: 380px; } }