body, html { width: 100%; height: 100%; background-color: #042a3a; } body { color: #fff; text-align: center; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); padding: 0; min-height: 100%; -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8); box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.8); display: table; font-family: "Open Sans", Arial, sans-serif; margin: 0; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } h1 { font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit; font-size: 36px; } h1 small { font-size: 68%; font-weight: 400; line-height: 1; color: #777; } a { text-decoration: none; color: #fff; font-size: inherit; border-bottom: dotted 1px #979797; } .lead { color: silver; font-size: 21px; line-height: 1.4; } .cover { display: table-cell; vertical-align: middle; padding: 0 20px; } img { width: 175px; } footer { position: fixed; width: 100%; left: 0; bottom: 0; color: #a0a0a0; font-size: 14px; } .lds-roller { display: inline-block; position: relative; width: 80px; height: 80px; } .lds-roller div { animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; transform-origin: 40px 40px; } .lds-roller div:after { content: " "; display: block; position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #fff; margin: -4px 0 0 -4px; } .lds-roller div:nth-child(1) { animation-delay: -0.036s; } .lds-roller div:nth-child(1):after { top: 63px; left: 63px; } .lds-roller div:nth-child(2) { animation-delay: -0.072s; } .lds-roller div:nth-child(2):after { top: 68px; left: 56px; } .lds-roller div:nth-child(3) { animation-delay: -0.108s; } .lds-roller div:nth-child(3):after { top: 71px; left: 48px; } .lds-roller div:nth-child(4) { animation-delay: -0.144s; } .lds-roller div:nth-child(4):after { top: 72px; left: 40px; } .lds-roller div:nth-child(5) { animation-delay: -0.18s; } .lds-roller div:nth-child(5):after { top: 71px; left: 32px; } .lds-roller div:nth-child(6) { animation-delay: -0.216s; } .lds-roller div:nth-child(6):after { top: 68px; left: 24px; } .lds-roller div:nth-child(7) { animation-delay: -0.252s; } .lds-roller div:nth-child(7):after { top: 63px; left: 17px; } .lds-roller div:nth-child(8) { animation-delay: -0.288s; } .lds-roller div:nth-child(8):after { top: 56px; left: 12px; } @keyframes lds-roller { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }