/** * @name loading.css * @author Tobias Reich * @copyright 2014 by Tobias Reich */ #loading { position: fixed; width: 100%; height: 3px; background-size: 100px 3px; background-repeat: repeat-x; border-bottom: 1px solid rgba(0,0,0,.3); display: none; /* Animation */ -webkit-animation-name: moveBackground; -webkit-animation-duration: .3s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: moveBackground; -moz-animation-duration: .3s; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: linear; animation-name: moveBackground; animation-duration: .3s; animation-iteration-count: infinite; animation-timing-function: linear; } /* Modes ------------------------------------------------*/ #loading.loading { background-image: -webkit-linear-gradient(left, #153674 0%, #153674 47%, #2651AE 53%, #2651AE 100%); background-image: -moz-linear-gradient(left, #153674 0%, #153674 47%, #2651AE 53%, #2651AE 100%); background-image: linear-gradient(left right, #153674 0%, #153674 47%, #2651AE 53%, #2651AE 100%); z-index: 2; } #loading.error { background-color: #2f0d0e; background-image: -webkit-linear-gradient(left, #451317 0%, #451317 47%, #AA3039 53%, #AA3039 100%); background-image: -moz-linear-gradient(left, #451317 0%, #451317 47%, #AA3039 53%, #AA3039 100%); background-image: linear-gradient(left right, #451317 0%, #451317 47%, #AA3039 53%, #AA3039 100%); z-index: 1; } /* Content ------------------------------------------------*/ #loading h1 { margin: 13px; color: #ddd; font-size: 14px; font-weight: bold; text-shadow: 0px 1px 0px #000; text-transform: capitalize; } #loading h1 span { margin-left: 10px; font-weight: normal; text-transform: none; }