123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130 |
- *{
- margin:0em;
- padding:0em;
- }
- body {
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
- /* background: #403833; */
- background:#2f3241;
- font-family: 'Open Sans';
- font-weight: 100;
- color:#f2f2f2;
- font-size:100%;
- margin:0em;
- padding:0em;
- }
- .loader {
- position: absolute;
- top: 50%;
- left: 50%;
- -webkit-transform: translate(-50%, -50%);
- -moz-transform: translate(-50%, -50%);
- -mos-transform: translate(-50%, -50%);
- -o-transform: translate(-50%, -50%);
- transform: translate(-50%, -50%);
- text-align:center;
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- cursor:default;
- }
- .line{
- white-space: nowrap;
- border-bottom:5px solid #f2f2f2;
- overflow:hidden;
- width:100%;
- -webkit-animation: line 2s ease-in-out infinite;
- -moz-animation: line 2s ease-in-out infinite;
- -mos-animation: line 2s ease-in-out infinite;
- -o-animation: line 2s ease-in-out infinite;
- animation: line 2s ease-in-out infinite;
- color:#f2f2f2;
- font-size:4em;
- text-shadow: 0 1px 0 #ccc,
- 0 2px 0 #c9c9c9,
- 0 3px 0 #bbb,
- 0 4px 0 #b9b9b9,
- 0 5px 0 #aaa,
- 0 6px 1px rgba(0,0,0,.1),
- 0 0 5px rgba(0,0,0,.1),
- 0 1px 3px rgba(0,0,0,.1),
- 0 3px 5px rgba(0,0,0,.1),
- 0 5px 10px rgba(0,0,0,.1),
- 0 10px 10px rgba(0,0,0,.1),
- 0 20px 20px rgba(0,0,0,.15);
- box-shadow: inset 0px -5px 10px -7px rgba(0,0,0,0.75), inset 0px 5px 10px -7px rgba(0,0,0,0.75);
- }
- .cap{
- position:absolute;
- left:-1px;
- height:100%;
- border-bottom:5px solid #403833;
- -webkit-animation: cap 2s ease-in-out infinite;
- -moz-animation: cap 2s ease-in-out infinite;
- -mos-animation: cap 2s ease-in-out infinite;
- -o-animation: cap 2s ease-in-out infinite;
- animation: cap 2s ease-in-out infinite;
- /* background:#403833; */
- background:#2f3241;
- }
- @-webkit-keyframes line{
- 0% {width:0%;}
- 50%,100% {width:100%;}
- }
- @-moz-keyframes line{
- 0% {width:0%;}
- 50%,100% {width:100%;}
- }
- @-mos-keyframes line{
- 0% {width:0%;}
- 50%,100% {width:100%;}
- }
- @-o-keyframes line{
- 0% {width:0%;}
- 50%,100% {width:100%;}
- }
- @keyframes line{
- 0% {width:0%;}
- 50%,100% {width:100%;}
- }
- @-webkit-keyframes cap{
- 0%,50% {width:0%;}
- 100% {width:100%;}
- }
- @-moz-keyframes cap{
- 0%,50% {width:0%;}
- 100% {width:100%;}
- }
- @-mos-keyframes cap{
- 0%,50% {width:0%;}
- 100% {width:100%;}
- }
- @-o-keyframes cap{
- 0%,50% {width:0%;}
- 100% {width:100%;}
- }
- @keyframes cap{
- 0%,50% {width:0%;}
- 100% {width:100%;}
- }
|