* { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; } html, body { min-height: 100%; display: flex; justify-content: center; align-items: center; } .product-launcher { min-height: 300px; max-width: 840px; margin: 0 auto; padding: 60px; box-sizing: border-box; text-align: center; } h1 { margin: 0; padding: 12px 0; color: #232333; font-weight: 400; font-size: 1.25rem; line-height: 2.5rem; } h3 { margin: 0; color: #232333; font-weight: 400; font-size: 0.875rem; line-height: 1.5rem; } .text-center { text-align: center; } .text-center .itunes-badge { display: block; } .itunes-badge img { height: 54px; margin: 0 auto; } .product-launcher hr { width: 100%; height: 1px; margin: 48px 0; border: none; background: #ededf4; } .product-launcher.preloader:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #FFFFFF; z-index: 1; } .product-launcher.preloader:after { content: ''; position: absolute; top: calc(50% - 40px); left: 0; right: 0; width: 40px; height: 40px; box-sizing: border-box; border-top: 2px solid rgba(255, 255, 255, 0); border-right: 2px solid #fff; border-bottom: 2px solid #111111; border-left: 2px solid #111111; border-radius: 25px; -webkit-animation-name: rotatePreloader; animation-name: rotatePreloader; -webkit-animation-duration: 0.6s; animation-duration: 0.6s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; margin: 0 auto; z-index: 2; } @-webkit-keyframes rotatePreloader { 0% { -moz-transform: rotateZ(0); -webkit-transform: rotateZ(0); -o-transform: rotateZ(0); -ms-transform: rotateZ(0); transform: rotateZ(0); } 100% { -moz-transform: rotateZ(360deg); -webkit-transform: rotateZ(360deg); -o-transform: rotateZ(360deg); -ms-transform: rotateZ(360deg); transform: rotateZ(360deg); } } @keyframes rotatePreloader { 0% { -moz-transform: rotateZ(0); -webkit-transform: rotateZ(0); -o-transform: rotateZ(0); -ms-transform: rotateZ(0); transform: rotateZ(0); } 100% { -moz-transform: rotateZ(360deg); -webkit-transform: rotateZ(360deg); -o-transform: rotateZ(360deg); -ms-transform: rotateZ(360deg); transform: rotateZ(360deg); } } @media (max-width: 575px) { .product-launcher { padding: 60px 20px; } }