| html { |
| height: 100%; |
| } |
| body { |
| height: 100%; |
| width: 100%; |
| margin: 0px; |
| padding: 0px; |
| overflow:hidden; |
| } |
| |
| .preloading-page { |
| height: 100%; |
| width: 100%; |
| margin: 0px; |
| overflow:hidden; |
| background-image: linear-gradient(to bottom right, rgba(30, 36, 48, 1), rgba(59, 74, 93, 1)); |
| text-align: center; |
| display: flex; |
| align-items: center; |
| justify-content: center; |
| flex-direction: column; |
| color: #FFFFFF; |
| } |
| |
| .project-icon { |
| width: 200px; |
| height: 210px; |
| margin-top: 0%; |
| background-repeat: no-repeat; |
| } |
| |
| .preloading-page-loading { |
| font-size: 24px; |
| line-height: 44px; |
| font-family: Arial, Helvetica, sans-serif; |
| color: #1EB9F3; |
| margin-top: 10%; |
| margin-left: 3%; |
| } |
| |
| .preloading-page-loading span { |
| font-family: Arial, Helvetica, sans-serif; |
| font-size: 50px; |
| animation-name: blink; |
| animation-duration: 1.5s; |
| animation-iteration-count: infinite; |
| animation-fill-mode: both; |
| } |
| |
| .preloading-page-loading span:nth-child(2) { |
| animation-delay: .5s; |
| } |
| |
| .preloading-page-loading span:nth-child(3) { |
| animation-delay: 1.0s; |
| } |
| |
| @keyframes blink { |
| 0% { |
| opacity: .2; |
| } |
| 20% { |
| opacity: 1; |
| } |
| 100% { |
| opacity: .2; |
| } |
| } |