diff --git a/animate/style.css b/animate/style.css index f717d7f..dc429ed 100644 --- a/animate/style.css +++ b/animate/style.css @@ -1,13 +1,7 @@ @keyframes colorRotate { - from { - opacity: 100%; - } - 80% { - opacity: 100%; - } - to { - opacity: 0; - } + from { opacity: 100%; } + 80% { opacity: 100%; } + to { opacity: 0; } } #path53926, @@ -35,3 +29,49 @@ #path53876 { animation-delay: 1.2s; } + +@keyframes toggleLight1 { + from { fill: #37c1ef; } + 50% { fill: #37c1ef; } + 51% { fill: #80e8f8; } + to { fill: #80e8f8; } +} + +@keyframes toggleLight2 { + from { fill: #36aed7; } + 50% { fill: #36aed7; } + 51% { fill: #70e0f0; } + to { fill: #70e0f0; } +} + +#path27272, +#path34452 { + animation-duration: 2s; + animation-direction: alternate; + animation-iteration-count: infinite; +} + +#path27272 { + animation-name: toggleLight1; +} + +#path34452 { + animation-name: toggleLight2; +} + +@keyframes lightSwitch { + from { transform: scaleY(1) translateY(0); } + 40% { transform: scaleY(1) translateY(0); } + 41% { transform: scaleY(1.4) translateY(-42px); } + 50% { transform: scaleY(1.4) translateY(-42px); } + 51% { transform: scaleY(1) translateY(0); } + to { transform: scaleY(1) translateY(0); } +} + +#rect36645, +#path36960 { + animation-name: lightSwitch; + animation-duration: 2s; + animation-direction: alternate; + animation-iteration-count: infinite; +}