Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- #cloud, #dott_1, #dott_2{
- fill: #f8f8f8;
- stroke-width: 2;
- stroke: #f8f8f8;
- }
- #logo:hover #cloud, #logo:hover #dott_2, #logo:hover #dott_1 {
- fill: @color;
- }
- #cloud{
- stroke-dasharray: 370;
- stroke-dashoffset: 370;
- -webkit-animation: logoSVG 4s linear;
- -moz-animation: logoSVG 4s linear;
- -ms-animation: logoSVG 4s linear;
- -o-animation: logoSVG 4s linear;
- animation: logoSVG 4s linear;
- }
- #dott_1{
- stroke-dasharray: 100;
- stroke-dashoffset: 100;
- -webkit-animation: dott_1 2s linear;
- -moz-animation: dott_1 2s linear;
- -ms-animation: dott_1 2s linear;
- -o-animation: dott_1 2s linear;
- animation: dott_1 2s linear;
- }
- #dott_2{
- stroke-dasharray: 100;
- stroke-dashoffset: 100;
- -webkit-animation: dott_2 3s linear;
- -moz-animation: dott_2 3s linear;
- -ms-animation: dott_2 3s linear;
- -o-animation: dott_2 3s linear;
- animation: dott_2 3s linear;
- }
- @-webkit-keyframes logoSVG {
- 0% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 50% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-webkit-keyframes dott_1 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 0;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-webkit-keyframes dott_2 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 100;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-moz-keyframes logoSVG {
- 0% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 50% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-moz-keyframes dott_1 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 0;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-moz-keyframes dott_2 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 100;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-ms-keyframes logoSVG {
- 0% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 50% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-ms-keyframes dott_1 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 0;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-ms-keyframes dott_2 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 100;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-o-keyframes logoSVG {
- 0% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 50% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-o-keyframes dott_1 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 0;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @-o-keyframes dott_2 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 100;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @keyframes logoSVG {
- 0% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 50% {
- stroke-dashoffset: 370;
- stroke-opacity: 1;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @keyframes dott_1 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 0;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
- @keyframes dott_2 {
- 0% {
- stroke-dashoffset: 100;
- fill-opacity: 0;
- }
- 33% {
- stroke-dashoffset: 100;
- }
- 66%{
- stroke-dashoffset: 0;
- }
- 90%{
- stroke-dashoffset: 0;
- stroke-opacity: 1;
- fill-opacity: 0;
- }
- 100%{
- stroke-dashoffset: 0;
- fill-opacity: 1;
- stroke-opacity: 0;
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement