/* --------fadeIn05----------Появление------------------------------- */ @keyframes fadeIn05 { 0% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadeIn05 { 0% { opacity:0; } 100% { opacity:1; } } #fadeIn05 div { opacity:0; } #fadeIn05.animated div { -webkit-animation-name:fadeIn05; animation-name:fadeIn05; } #fadeIn05.animated div { -webkit-animation-duration:0.5s; animation-duration:0.5s; } #fadeIn05.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeIn05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeIn05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeIn05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeIn05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeIn05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeIn05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeIn05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeIn05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeIn05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------*/ /* --------fadeIn1----------------------------------------- */ @keyframes fadeIn1 { 0% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadeIn1 { 0% { opacity:0; } 100% { opacity:1; } } #fadeIn1 div { opacity:0; } #fadeIn1.animated div { -webkit-animation-name:fadeIn1; animation-name:fadeIn1; } #fadeIn1.animated div { -webkit-animation-duration:1s; animation-duration:1s; } #fadeIn1.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeIn1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeIn1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeIn1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeIn1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeIn1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeIn1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeIn1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeIn1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeIn1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------*/ /* --------fadeIn15----------------------------------------- */ @keyframes fadeIn15 { 0% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadeIn15 { 0% { opacity:0; } 100% { opacity:1; } } #fadeIn15 div { opacity:0; } #fadeIn15.animated div { -webkit-animation-name:fadeIn15; animation-name:fadeIn15; } #fadeIn15.animated div { -webkit-animation-duration:1.5s; animation-duration:1.5s; } #fadeIn15.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeIn15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeIn15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeIn15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeIn15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeIn15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeIn15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeIn15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeIn15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeIn15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------*/ /* --------fadeIn2----------------------------------------- */ @keyframes fadeIn2 { 0% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadeIn2 { 0% { opacity:0; } 100% { opacity:1; } } #fadeIn2 div { opacity:0; } #fadeIn2.animated div { -webkit-animation-name:fadeIn2; animation-name:fadeIn2; } #fadeIn2.animated div { -webkit-animation-duration:2s; animation-duration:2s; } #fadeIn2.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeIn2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeIn2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeIn2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeIn2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeIn2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeIn2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeIn2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeIn2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeIn2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------*//* --------fadeIn3----------------------------------------- */ @keyframes fadeIn3 { 0% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadeIn3 { 0% { opacity:0; } 100% { opacity:1; } } #fadeIn3 div { opacity:0; } #fadeIn3.animated div { -webkit-animation-name:fadeIn3; animation-name:fadeIn3; } #fadeIn3.animated div { -webkit-animation-duration:3s; animation-duration:3s; } #fadeIn3.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeIn3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeIn3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeIn3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeIn3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeIn3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeIn3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeIn3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeIn3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeIn3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------*/ /* --------------------------------------------------------------------------------------- */ /* --------------pulse1--------Пульс-------------- */ @keyframes pulse1 { 0% { opacity:1; transform:scale(0.9); } 50% { opacity:1; transform:scale(1); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes pulse1 { 0% { opacity:1; -webkit-transform:scale(0.9); } 50% { opacity:1; -webkit-transform:scale(1); } 100% { opacity:1; -webkit-transform:scale(0.9); } } #pulse1 div { opacity:0; } #pulse1.animated div { -webkit-animation-name:pulse1; animation-name:pulse1; } #pulse1.animated div { -webkit-animation-duration:1s; animation-duration:1s; } #pulse1.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #pulse1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #pulse1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #pulse1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #pulse1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #pulse1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #pulse1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #pulse1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #pulse1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #pulse1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* --------------pulse15---------------------- */ @keyframes pulse15 { 0% { opacity:1; transform:scale(0.9); } 50% { opacity:1; transform:scale(1); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes pulse15 { 0% { opacity:1; -webkit-transform:scale(0.9); } 50% { opacity:1; -webkit-transform:scale(1); } 100% { opacity:1; -webkit-transform:scale(0.9); } } #pulse15 div { opacity:0; } #pulse15.animated div { -webkit-animation-name:pulse15; animation-name:pulse15; } #pulse15.animated div { -webkit-animation-duration:1.5s; animation-duration:1.5s; } #pulse15.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #pulse15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #pulse15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #pulse15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #pulse15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #pulse15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #pulse15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #pulse15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #pulse15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #pulse15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* --------------pulse2---------------------- */ @keyframes pulse2 { 0% { opacity:1; transform:scale(0.9); } 50% { opacity:1; transform:scale(1); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes pulse2 { 0% { opacity:1; -webkit-transform:scale(0.9); } 50% { opacity:1; -webkit-transform:scale(1); } 100% { opacity:1; -webkit-transform:scale(0.9); } } #pulse2 div { opacity:0; } #pulse2.animated div { -webkit-animation-name:pulse2; animation-name:pulse2; } #pulse2.animated div { -webkit-animation-duration:2s; animation-duration:2s; } #pulse2.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #pulse2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #pulse2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #pulse2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #pulse2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #pulse2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #pulse2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #pulse2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #pulse2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #pulse2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* --------------pulse3---------------------- */ @keyframes pulse3 { 0% { opacity:1; transform:scale(0.9); } 50% { opacity:1; transform:scale(1); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes pulse3 { 0% { opacity:1; -webkit-transform:scale(0.9); } 50% { opacity:1; -webkit-transform:scale(1); } 100% { opacity:1; -webkit-transform:scale(0.9); } } #pulse3 div { opacity:0; } #pulse3.animated div { -webkit-animation-name:pulse3; animation-name:pulse3; } #pulse3.animated div { -webkit-animation-duration:3s; animation-duration:3s; } #pulse3.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #pulse3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #pulse3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #pulse3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #pulse3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #pulse3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #pulse3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #pulse3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #pulse3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #pulse3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* --------------pulse05---------------------- */ @keyframes pulse05 { 0% { opacity:1; transform:scale(0.9); } 50% { opacity:1; transform:scale(1); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes pulse05 { 0% { opacity:1; -webkit-transform:scale(0.9); } 50% { opacity:1; -webkit-transform:scale(1); } 100% { opacity:1; -webkit-transform:scale(0.9); } } #pulse05 div { opacity:0; } #pulse05.animated div { -webkit-animation-name:pulse05; animation-name:pulse05; } #pulse05.animated div { -webkit-animation-duration:0.5s; animation-duration:0.5s; } #pulse05.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #pulse05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #pulse05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #pulse05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #pulse05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #pulse05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #pulse05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #pulse05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #pulse05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #pulse05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* shake1-----------Встряска--------- */ @-webkit-keyframes shake1 { 0%,100% { opacity:1; -webkit-transform:translateX(0); } 10%, 30%, 50%, 70%, 90% { opacity:1; -webkit-transform:translateX(-10px); } 20%, 40%, 60%, 80% { opacity:1; -webkit-transform:translateX(10px); } } @keyframes shake1 { 0%,100% { opacity:1; -ms-transform:translateX(0); transform:translateX(0);} 10%, 30%, 50%, 70%, 90% { opacity:1; -ms-transform:translateX(-10px); transform:translateX(-10px);} 20%, 40%, 60%, 80% { opacity:1; -ms-transform:translateX(10px); transform:translateX(10px); } } #shake1 div { opacity:0; } #shake1.animated div { -webkit-animation-name:shake1; animation-name:shake1; } #shake1.animated div { -webkit-animation-duration:1s; animation-duration:1s; } #shake1.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #shake1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #shake1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #shake1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #shake1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #shake1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #shake1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #shake1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #shake1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #shake1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* shake15 */ @-webkit-keyframes shake15 { 0%,100% { opacity:1; -webkit-transform:translateX(0); } 10%, 30%, 50%, 70%, 90% { opacity:1; -webkit-transform:translateX(-10px); } 20%, 40%, 60%, 80% { opacity:1; -webkit-transform:translateX(10px); } } @keyframes shake15 { 0%,100% { opacity:1; -ms-transform:translateX(0); transform:translateX(0);} 10%, 30%, 50%, 70%, 90% { opacity:1; -ms-transform:translateX(-10px); transform:translateX(-10px);} 20%, 40%, 60%, 80% { opacity:1; -ms-transform:translateX(10px); transform:translateX(10px); } } #shake15 div { opacity:0; } #shake15.animated div { -webkit-animation-name:shake15; animation-name:shake15; } #shake15.animated div { -webkit-animation-duration:1.5s; animation-duration:1.5s; } #shake15.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #shake15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #shake15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #shake15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #shake15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #shake15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #shake15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #shake15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #shake15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #shake15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* shake2 */ @-webkit-keyframes shake2 { 0%,100% { opacity:1; -webkit-transform:translateX(0); } 10%, 30%, 50%, 70%, 90% { opacity:1; -webkit-transform:translateX(-10px); } 20%, 40%, 60%, 80% { opacity:1; -webkit-transform:translateX(10px); } } @keyframes shake2 { 0%,100% { opacity:1; -ms-transform:translateX(0); transform:translateX(0);} 10%, 30%, 50%, 70%, 90% { opacity:1; -ms-transform:translateX(-10px); transform:translateX(-10px);} 20%, 40%, 60%, 80% { opacity:1; -ms-transform:translateX(10px); transform:translateX(10px); } } #shake2 div { opacity:0; } #shake2.animated div { -webkit-animation-name:shake2; animation-name:shake2; } #shake2.animated div { -webkit-animation-duration:2s; animation-duration:2s; } #shake2.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #shake2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #shake2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #shake2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #shake2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #shake2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #shake2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #shake2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #shake2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #shake2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* shake3 */ @-webkit-keyframes shake3 { 0%,100% { opacity:1; -webkit-transform:translateX(0); } 10%, 30%, 50%, 70%, 90% { opacity:1; -webkit-transform:translateX(-10px); } 20%, 40%, 60%, 80% { opacity:1; -webkit-transform:translateX(10px); } } @keyframes shake3 { 0%,100% { opacity:1; -ms-transform:translateX(0); transform:translateX(0);} 10%, 30%, 50%, 70%, 90% { opacity:1; -ms-transform:translateX(-10px); transform:translateX(-10px);} 20%, 40%, 60%, 80% { opacity:1; -ms-transform:translateX(10px); transform:translateX(10px); } } #shake3 div { opacity:0; } #shake3.animated div { -webkit-animation-name:shake3; animation-name:shake3; } #shake3.animated div { -webkit-animation-duration:3s; animation-duration:3s; } #shake3.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #shake3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #shake3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #shake3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #shake3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #shake3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #shake3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #shake3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #shake3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #shake3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* shake05 */ @-webkit-keyframes shake05 { 0%,100% { opacity:1; -webkit-transform:translateX(0); } 10%, 30%, 50%, 70%, 90% { opacity:1; -webkit-transform:translateX(-10px); } 20%, 40%, 60%, 80% { opacity:1; -webkit-transform:translateX(10px); } } @keyframes shake05 { 0%,100% { opacity:1; -ms-transform:translateX(0); transform:translateX(0);} 10%, 30%, 50%, 70%, 90% { opacity:1; -ms-transform:translateX(-10px); transform:translateX(-10px);} 20%, 40%, 60%, 80% { opacity:1; -ms-transform:translateX(10px); transform:translateX(10px); } } #shake05 div { opacity:0; } #shake05.animated div { -webkit-animation-name:shake05; animation-name:shake05; } #shake05.animated div { -webkit-animation-duration:0.5s; animation-duration:0.5s; } #shake05.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #shake05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #shake05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #shake05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #shake05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #shake05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #shake05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #shake05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #shake05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #shake05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*------------------ */ /* ----------------------------------------------------------------------------------- */ /* ----------fadeInDown1--Падение------------------------------------ */ @-webkit-keyframes fadeInDown1 { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown1 { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown1 { -webkit-animation-name: fadeInDown1; animation-name: fadeInDown1; } #fadeInDown1 div { opacity:0; } #fadeInDown1.animated div { -webkit-animation-name:fadeInDown1; animation-name:fadeInDown1; } #fadeInDown1.animated div { -webkit-animation-duration:1s; animation-duration:1s; } #fadeInDown1.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDown1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDown1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDown1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDown1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDown1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDown1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDown1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDown1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDown1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* ----------fadeInDown15--Падение------------------------------------ */ @-webkit-keyframes fadeInDown15 { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown15 { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown15 { -webkit-animation-name: fadeInDown15; animation-name: fadeInDown15; } #fadeInDown15 div { opacity:0; } #fadeInDown15.animated div { -webkit-animation-name:fadeInDown15; animation-name:fadeInDown15; } #fadeInDown15.animated div { -webkit-animation-duration:1.5s; animation-duration:1.5s; } #fadeInDown15.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDown15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDown15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDown15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDown15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDown15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDown15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDown15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDown15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDown15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* ----------fadeInDown2--Падение------------------------------------ */ @-webkit-keyframes fadeInDown2 { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown2 { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown2 { -webkit-animation-name: fadeInDown2; animation-name: fadeInDown2; } #fadeInDown2 div { opacity:0; } #fadeInDown2.animated div { -webkit-animation-name:fadeInDown2; animation-name:fadeInDown2; } #fadeInDown2.animated div { -webkit-animation-duration:2s; animation-duration:2s; } #fadeInDown2.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDown2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDown2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDown2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDown2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDown2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDown2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDown2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDown2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDown2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* ----------fadeInDown3--Падение------------------------------------ */ @-webkit-keyframes fadeInDown3 { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown3 { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown3 { -webkit-animation-name: fadeInDown3; animation-name: fadeInDown3; } #fadeInDown3 div { opacity:0; } #fadeInDown3.animated div { -webkit-animation-name:fadeInDown3; animation-name:fadeInDown3; } #fadeInDown3.animated div { -webkit-animation-duration:3s; animation-duration:3s; } #fadeInDown3.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDown3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDown3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDown3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDown3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDown3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDown3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDown3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDown3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDown3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* ----------fadeInDown05--Падение------------------------------------ */ @-webkit-keyframes fadeInDown05 { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown05 { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown05 { -webkit-animation-name: fadeInDown05; animation-name: fadeInDown05; } #fadeInDown05 div { opacity:0; } #fadeInDown05.animated div { -webkit-animation-name:fadeInDown05; animation-name:fadeInDown05; } #fadeInDown05.animated div { -webkit-animation-duration:0.5s; animation-duration:0.5s; } #fadeInDown05.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDown05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDown05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDown05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDown05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDown05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDown05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDown05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDown05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDown05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* -----------fadeInDownBig05---- Падение свысока-------------- */ @-webkit-keyframes fadeInDownBig05 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig05 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig05 { -webkit-animation-name: fadeInDownBig05; animation-name: fadeInDownBig05; } #fadeInDownBig05 div { opacity:0; } #fadeInDownBig05.animated div { -webkit-animation-name:fadeInDownBig05; animation-name:fadeInDownBig05; } #fadeInDownBig05.animated div { -webkit-animation-duration:0.5s; animation-duration:0.5s; } #fadeInDownBig05.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDownBig05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDownBig05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDownBig05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDownBig05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDownBig05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDownBig05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDownBig05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDownBig05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDownBig05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* -----------------fadeInDownBig15---- Падение свысока------------------------------------ */ @-webkit-keyframes fadeInDownBig15 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig15 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig15 { -webkit-animation-name: fadeInDownBig15; animation-name: fadeInDownBig15; } #fadeInDownBig15 div { opacity:0; } #fadeInDownBig15.animated div { -webkit-animation-name:fadeInDownBig15; animation-name:fadeInDownBig15; } #fadeInDownBig15.animated div { -webkit-animation-duration:1.5s; animation-duration:1.5s; } #fadeInDownBig15.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDownBig15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDownBig15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDownBig15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDownBig15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDownBig15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDownBig15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDownBig15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDownBig15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDownBig15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------- */ /* -----------------fadeInDownBig1---- Падение свысока------------------------------------ */ @-webkit-keyframes fadeInDownBig1 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig1 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig1 { -webkit-animation-name: fadeInDownBig1; animation-name: fadeInDownBig1; } #fadeInDownBig1 div { opacity:0; } #fadeInDownBig1.animated div { -webkit-animation-name:fadeInDownBig1; animation-name:fadeInDownBig1; } #fadeInDownBig1.animated div { -webkit-animation-duration:1s; animation-duration:1s; } #fadeInDownBig1.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDownBig1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDownBig1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDownBig1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDownBig1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDownBig1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDownBig1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDownBig1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDownBig1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDownBig1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* -----------------fadeInDownBig2---- Падение свысока-------------------------------------------------------------- */ @-webkit-keyframes fadeInDownBig2 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig2 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig2 { -webkit-animation-name: fadeInDownBig2; animation-name: fadeInDownBig2; } #fadeInDownBig2 div { opacity:0; } #fadeInDownBig2.animated div { -webkit-animation-name:fadeInDownBig2; animation-name:fadeInDownBig2; } #fadeInDownBig2.animated div { -webkit-animation-duration:2s; animation-duration:2s; } #fadeInDownBig2.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDownBig2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDownBig2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDownBig2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDownBig2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDownBig2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDownBig2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDownBig2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDownBig2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDownBig2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* -----------------fadeInDownBig3---- Падение свысока------------------------------- */ @-webkit-keyframes fadeInDownBig3 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig3 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig3 { -webkit-animation-name: fadeInDownBig3; animation-name: fadeInDownBig3; } #fadeInDownBig3 div { opacity:0; } #fadeInDownBig3.animated div { -webkit-animation-name:fadeInDownBig3; animation-name:fadeInDownBig3; } #fadeInDownBig3.animated div { -webkit-animation-duration:3s; animation-duration:3s; } #fadeInDownBig3.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInDownBig3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInDownBig3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInDownBig3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInDownBig3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInDownBig3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInDownBig3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInDownBig3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInDownBig3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInDownBig3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* -----------------------------fadIn------------------------------------------------------ */ @keyframes fadIn { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } #fadIn div { opacity:0; } #fadIn.animated div { -webkit-animation-name:fadIn; animation-name:fadIn; } #fadIn.animated div { -webkit-animation-duration:2s; animation-duration:2s; } #fadIn.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadIn.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadIn.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadIn.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadIn.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadIn.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadIn.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadIn.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadIn.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadIn.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------------------------------------------------------------------------------- */ /* bounceOut */ @keyframes bounceOut { 0% { opacity:0; transform:scale(0); } /* Изначально блок скрыт и уменьшен на 100%. */ 100% { opacity:1; transform:scale(1); } /* Затем он плавно появляется и увеличивается в размере. */ } @-webkit-keyframes bounceOut { 0% { opacity:0; -webkit-transform:scale(0); } 100% { opacity:1; -webkit-transform:scale(1); } } #bounceOut div { opacity:0; text-align:center;} #bounceOut.animated div { -webkit-animation-name:bounceOut; animation-name:bounceOut; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOut.animated div.block10 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOut.animated div.block2 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOut.animated div.block3 { -webkit-animation-delay:1s; animation-delay:1s; } /* ----------------------------------------------------------------------------------- */ /* riseLeft1 Слева направо*/ @keyframes riseLeft1 { 0% { -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeft1 { 0% { -webkit-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeft1 div { opacity:0; } #riseLeft1.animated div { -webkit-animation-name:riseLeft1; animation-name:riseLeft1; } #riseLeft1.animated div { -webkit-animation-duration:1s; animation-duration:1s; } #riseLeft1.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeft1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeft1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeft1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeft1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeft1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeft1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeft1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeft1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeft1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*----------------------------------------------------*/ /* riseLeft15 Слева направо*/ @keyframes riseLeft15 { 0% { -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeft15 { 0% { -webkit-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeft15 div { opacity:0; } #riseLeft15.animated div { -webkit-animation-name:riseLeft15; animation-name:riseLeft15; } #riseLeft15.animated div { -webkit-animation-duration:1.5s; animation-duration:1.5s; } #riseLeft15.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeft15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeft15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeft15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeft15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeft15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeft15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeft15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeft15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeft15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*----------------------------------------------------*/ /* riseLeft05 Слева направо*/ @keyframes riseLeft05 { 0% { -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeft05 { 0% { -webkit-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeft05 div { opacity:0; } #riseLeft05.animated div { -webkit-animation-name:riseLeft05; animation-name:riseLeft05; } #riseLeft05.animated div { -webkit-animation-duration:0.5s; animation-duration:0.5s; } #riseLeft05.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeft05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeft05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeft05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeft05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeft05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeft05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeft05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeft05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeft05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*----------------------------------------------------*/ /* riseLeft2 Слева направо*/ @keyframes riseLeft2 { 0% { -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeft2 { 0% { -webkit-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeft2 div { opacity:0; } #riseLeft2.animated div { -webkit-animation-name:riseLeft2; animation-name:riseLeft2; } #riseLeft2.animated div { -webkit-animation-duration:2s; animation-duration:2s; } #riseLeft2.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeft2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeft2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeft2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeft2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeft2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeft2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeft2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeft2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeft2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*----------------------------------------------------*/ /* riseLeft3 Слева направо*/ @keyframes riseLeft3 { 0% { -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeft3 { 0% { -webkit-transform: translateX(-200px); transform: translateX(-200px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeft3 div { opacity:0; } #riseLeft3.animated div { -webkit-animation-name:riseLeft3; animation-name:riseLeft3; } #riseLeft3.animated div { -webkit-animation-duration:1s; animation-duration:1s; } #riseLeft3.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeft3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeft3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeft3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeft3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeft3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeft3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeft3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeft3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeft3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*----------------------------------------------------*/ /*----------------------------------------------------*/ /* riseLeftBig05-----------Слева направо 2-----*/ @keyframes riseLeftBig05 { 0% { -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeftBig05 { 0% { -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeftBig05 div { opacity:0; } #riseLeftBig05.animated div { -webkit-animation-name:riseLeftBig05; animation-name:riseLeftBig05; } #riseLeftBig05.animated div { -webkit-animation-duration:0.5s; animation-duration:0.5s; } #riseLeftBig05.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeftBig05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeftBig05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeftBig05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeftBig05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeftBig05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeftBig05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeftBig05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeftBig05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeftBig05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------------------*/ /* riseLeftBig1-----------Слева направо 2*/ @keyframes riseLeftBig1 { 0% { -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeftBig1 { 0% { -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeftBig1 div { opacity:0; } #riseLeftBig1.animated div { -webkit-animation-name:riseLeftBig1; animation-name:riseLeftBig1; } #riseLeftBig1.animated div { -webkit-animation-duration:1s; animation-duration:1s; } #riseLeftBig1.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeftBig1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeftBig1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeftBig1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeftBig1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeftBig1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeftBig1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeftBig1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeftBig1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeftBig1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------------------*/ /* riseLeftBig2-----------Слева направо 2*/ @keyframes riseLeftBig2 { 0% { -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeftBig2 { 0% { -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeftBig2 div { opacity:0; } #riseLeftBig2.animated div { -webkit-animation-name:riseLeftBig2; animation-name:riseLeftBig2; } #riseLeftBig2.animated div { -webkit-animation-duration:2s; animation-duration:2s; } #riseLeftBig2.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeftBig2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeftBig2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeftBig2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeftBig2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeftBig2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeftBig2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeftBig2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeftBig2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeftBig2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------------------*/ /* riseLeftBig2-----------Слева направо 2*/ @keyframes riseLeftBig15 { 0% { -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeftBig15 { 0% { -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeftBig15 div { opacity:0; } #riseLeftBig15.animated div { -webkit-animation-name:riseLeftBig15; animation-name:riseLeftBig15; } #riseLeftBig15.animated div { -webkit-animation-duration:1.5s; animation-duration:1.5s; } #riseLeftBig15.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeftBig15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeftBig15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeftBig15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeftBig15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeftBig15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeftBig15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeftBig15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeftBig15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeftBig15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------------------*/ /* riseLeftBig3-----------Слева направо 2*/ @keyframes riseLeftBig3 { 0% { -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes riseLeftBig3 { 0% { -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { opacity: 1; -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } #riseLeftBig3 div { opacity:0; } #riseLeftBig3.animated div { -webkit-animation-name:riseLeftBig3; animation-name:riseLeftBig3; } #riseLeftBig3.animated div { -webkit-animation-duration:3s; animation-duration:3s; } #riseLeftBig3.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseLeftBig3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseLeftBig3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseLeftBig3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseLeftBig3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseLeftBig3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseLeftBig3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseLeftBig3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseLeftBig3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseLeftBig3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*--------------------------------------------*/ /* riseRight */ @keyframes riseRight { 0% { opacity:0; transform:translateX(120px); } 100% { opacity:1; transform:translateX(0); } } @-webkit-keyframes riseRight { 0% { opacity:0; -webkit-transform:translateX(120px); } 100% { opacity:1; -webkit-transform:translateX(0); } } #riseRight div { opacity:0; } /* Указываем, что нужые блоки изначально невидимы, это избавит от нежелательного эффекта при быстой прокрутке страницы, когда блок изначально видим, потом внезапно пропадает и только потом начинается анимация. */ #riseRight.animated div { -webkit-animation-name:riseRight; animation-name:riseRight; } /* Указываем для нужных блоков название анимации, которую необходимо програть. */ #riseRight.animated div { -webkit-animation-duration:2s; animation-duration:2s; } /* Указываем скорость воспроизведения анимации. В данном случае 2 секунды. */ #riseRight.animated div { -webkit-animation-fill-mode:both; animation-fill-mode:both; } /* Это нужно обязательно, чтобы блоки с анимацией не пропадали после того, как она прогирает. */ /* Ниже прописана задержка в анимации для нужных блоков, чтобы они появлялись не все сразу, но постепенно. */ #riseRight.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseRight.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseRight.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseRight.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseRight.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseRight.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseRight.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseRight.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseRight.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ----------riseUp05------------Восход */ @keyframes riseUp05 { 0% { opacity:0; transform:translateY(60px); } 100% { opacity:1; transform:translateY(0); } } @-webkit-keyframes riseUp05 { 0% { opacity:0; -webkit-transform:translateY(60px); } 100% { opacity:1; -webkit-transform:translateY(0); } } #riseUp05 div { opacity:0; } #riseUp05.animated div { -webkit-animation-name:riseUp05; animation-name:riseUp05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseUp05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseUp05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseUp05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseUp05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseUp05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseUp05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseUp05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseUp05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseUp05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------------------------------------------------------------- */ /* ----------riseUp1------------Восход */ @keyframes riseUp1 { 0% { opacity:0; transform:translateY(60px); } 100% { opacity:1; transform:translateY(0); } } @-webkit-keyframes riseUp1 { 0% { opacity:0; -webkit-transform:translateY(60px); } 100% { opacity:1; -webkit-transform:translateY(0); } } #riseUp1 div { opacity:0; } #riseUp1.animated div { -webkit-animation-name:riseUp1; animation-name:riseUp1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseUp1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseUp1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseUp1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseUp1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseUp1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseUp1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseUp1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseUp1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseUp1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------------------------------------------------------------- *//* ----------riseUp15------------Восход */ @keyframes riseUp15 { 0% { opacity:0; transform:translateY(60px); } 100% { opacity:1; transform:translateY(0); } } @-webkit-keyframes riseUp15 { 0% { opacity:0; -webkit-transform:translateY(60px); } 100% { opacity:1; -webkit-transform:translateY(0); } } #riseUp15 div { opacity:0; } #riseUp15.animated div { -webkit-animation-name:riseUp15; animation-name:riseUp15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseUp15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseUp15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseUp15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseUp15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseUp15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseUp15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseUp15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseUp15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseUp15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------------------------------------------------------------- *//* ----------riseUp2------------Восход */ @keyframes riseUp2 { 0% { opacity:0; transform:translateY(60px); } 100% { opacity:1; transform:translateY(0); } } @-webkit-keyframes riseUp2 { 0% { opacity:0; -webkit-transform:translateY(60px); } 100% { opacity:1; -webkit-transform:translateY(0); } } #riseUp2 div { opacity:0; } #riseUp2.animated div { -webkit-animation-name:riseUp2; animation-name:riseUp2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseUp2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseUp2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseUp2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseUp2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseUp2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseUp2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseUp2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseUp2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseUp2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------------------------------------------------------------- *//* ----------riseUp3------------Восход */ @keyframes riseUp3 { 0% { opacity:0; transform:translateY(60px); } 100% { opacity:1; transform:translateY(0); } } @-webkit-keyframes riseUp3 { 0% { opacity:0; -webkit-transform:translateY(60px); } 100% { opacity:1; -webkit-transform:translateY(0); } } #riseUp3 div { opacity:0; } #riseUp3.animated div { -webkit-animation-name:riseUp3; animation-name:riseUp3; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #riseUp3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #riseUp3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #riseUp3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #riseUp3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #riseUp3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #riseUp3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #riseUp3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #riseUp3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #riseUp3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------------------------------------------------------------- */ /* fadeInOut05 Увеличение*/ @keyframes fadeInOut05 { 0% { opacity:0; transform:scale(0); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes fadeInOut05 { 0% { opacity:0; -webkit-transform:scale(0); } 100% { opacity:1; -webkit-transform:scale(1); } } #fadeInOut05 div { opacity:0; } #fadeInOut05.animated div { -webkit-animation-name:fadeInOut05; animation-name:fadeInOut05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #fadeInOut05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInOut05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInOut05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInOut05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInOut05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInOut05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInOut05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInOut05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInOut05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* fadeInOut1 Увеличение*/ @keyframes fadeInOut1 { 0% { opacity:0; transform:scale(0); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes fadeInOut1 { 0% { opacity:0; -webkit-transform:scale(0); } 100% { opacity:1; -webkit-transform:scale(1); } } #fadeInOut1 div { opacity:0; } #fadeInOut1.animated div { -webkit-animation-name:fadeInOut1; animation-name:fadeInOut1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%;} #fadeInOut1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInOut1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInOut1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInOut1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInOut1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInOut1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInOut1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInOut1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInOut1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* fadeInOut15 Увеличение*/ @keyframes fadeInOut15 { 0% { opacity:0; transform:scale(0); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes fadeInOut15 { 0% { opacity:0; -webkit-transform:scale(0); } 100% { opacity:1; -webkit-transform:scale(1); } } #fadeInOut15 div { opacity:0; } #fadeInOut15.animated div { -webkit-animation-name:fadeInOut15; animation-name:fadeInOut15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both;-moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #fadeInOut15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInOut15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInOut15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInOut15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInOut15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInOut15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInOut15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInOut15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInOut15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* fadeInOut2 Увеличение*/ @keyframes fadeInOut2 { 0% { opacity:0; transform:scale(0); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes fadeInOut2 { 0% { opacity:0; -webkit-transform:scale(0); } 100% { opacity:1; -webkit-transform:scale(1); } } #fadeInOut2 div { opacity:0; } #fadeInOut2.animated div { -webkit-animation-name:fadeInOut2; animation-name:fadeInOut2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%;} #fadeInOut2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInOut2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInOut2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInOut2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInOut2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInOut2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInOut2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInOut2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInOut2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* fadeInOut3 Увеличение*/ @keyframes fadeInOut3 { 0% { opacity:0; transform:scale(0); } 100% { opacity:1; transform:scale(1); } } @-webkit-keyframes fadeInOut3 { 0% { opacity:0; -webkit-transform:scale(0); } 100% { opacity:1; -webkit-transform:scale(1); } } #fadeInOut3 div { opacity:0; } #fadeInOut3.animated div { -webkit-animation-name:fadeInOut3; animation-name:fadeInOut3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%;} #fadeInOut3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInOut3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInOut3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInOut3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInOut3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInOut3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInOut3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInOut3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInOut3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------bounce05------------------------------------*/ @-webkit-keyframes bounce05 { 0%, {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce05 { 0%, {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } #bounce05 div { opacity:1; } #bounce05.animated div { -webkit-animation-name:bounce05; animation-name:bounce05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounce05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounce05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounce05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounce05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounce05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounce05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounce05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounce05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounce05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------bounce1------------------------------------*/ @-webkit-keyframes bounce1 { 0%, {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce1 { 0%, {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } #bounce1 div { opacity:1; } #bounce1.animated div { -webkit-animation-name:bounce1; animation-name:bounce1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounce1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounce1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounce1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounce1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounce1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounce1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounce1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounce1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounce1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------bounce15------------------------------------*/ @-webkit-keyframes bounce15 { 0%, {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce15 { 0%, {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } #bounce15 div { opacity:1; } #bounce15.animated div { -webkit-animation-name:bounce15; animation-name:bounce15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounce15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounce15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounce15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounce15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounce15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounce15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounce15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounce15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounce15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------bounce2------------------------------------*/ @-webkit-keyframes bounce2 { 0%, {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce2 { 0%, {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } #bounce2 div { opacity:1; } #bounce2.animated div { -webkit-animation-name:bounce2; animation-name:bounce2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounce2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounce2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounce2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounce2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounce2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounce2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounce2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounce2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounce2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------bounce3------------------------------------*/ @-webkit-keyframes bounce3 { 0%, {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); transform: translateY(0); } ц 40% {opacity:1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce3 { 0%, {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20%, 50%, 80%, 100% {opacity:1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% {opacity:1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% {opacity:1; -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } #bounce3 div { opacity:1; } #bounce3.animated div { -webkit-animation-name:bounce3; animation-name:bounce3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounce3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounce3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounce3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounce3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounce3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounce3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounce3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounce3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounce3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------swing05------Качание------------------------------------*/ @-webkit-keyframes swing05 { 20% {opacity:1; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing05 { 20% {opacity:1; -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } #swing05 div { opacity:1; } #swing05.animated div { -webkit-animation-name:swing05; animation-name:swing05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #swing05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #swing05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #swing05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #swing05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #swing05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #swing05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #swing05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #swing05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #swing05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------swing1------Качание------------------------------------*/ @-webkit-keyframes swing1 { 20% {opacity:1; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing1 { 20% {opacity:1; -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } #swing1 div { opacity:1; } #swing1.animated div { -webkit-animation-name:swing1; animation-name:swing1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #swing1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #swing1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #swing1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #swing1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #swing1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #swing1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #swing1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #swing1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #swing1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------swing15------Качание------------------------------------*/ @-webkit-keyframes swing15 { 20% {opacity:1; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing15 { 20% {opacity:1; -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } #swing15 div { opacity:1; } #swing15.animated div { -webkit-animation-name:swing15; animation-name:swing15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #swing15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #swing15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #swing15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #swing15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #swing15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #swing15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #swing15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #swing15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #swing15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------swing2------Качание------------------------------------*/ @-webkit-keyframes swing2 { 20% {opacity:1; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing2 { 20% {opacity:1; -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } #swing2 div { opacity:1; } #swing2.animated div { -webkit-animation-name:swing2; animation-name:swing2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #swing2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #swing2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #swing2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #swing2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #swing2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #swing2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #swing2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #swing2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #swing2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ---------------swing3------Качание------------------------------------*/ @-webkit-keyframes swing3 { 20% {opacity:1; -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing3 { 20% {opacity:1; -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% {opacity:1; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% {opacity:1; -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% {opacity:1; -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } #swing3 div { opacity:1; } #swing3.animated div { -webkit-animation-name:swing3; animation-name:swing3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #swing3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #swing3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #swing3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #swing3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #swing3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #swing3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #swing3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #swing3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #swing3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ------------------bounceInDown05 ---------- Падение свысока+отскок---------------------------------*/ @-webkit-keyframes bounceInDown05 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); } } @keyframes bounceInDown05 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInDown05 div { opacity:0; } #bounceInDown05.animated div { -webkit-animation-name:bounceInDown05; animation-name:bounceInDown05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInDown05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInDown05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInDown05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInDown05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInDown05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInDown05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInDown05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInDown05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInDown05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ------------------bounceInDown1 ---------- Падение свысока+отскок---------------------------------*/ @-webkit-keyframes bounceInDown1 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); } } @keyframes bounceInDown1 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInDown1 div { opacity:0; } #bounceInDown1.animated div { -webkit-animation-name:bounceInDown1; animation-name:bounceInDown1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInDown1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInDown1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInDown1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInDown1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInDown1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInDown1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInDown1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInDown1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInDown1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ------------------bounceInDown15 ---------- Падение свысока+отскок---------------------------------*/ @-webkit-keyframes bounceInDown15 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); } } @keyframes bounceInDown15 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% {opacity: 1; opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInDown15 div { opacity:0; } #bounceInDown15.animated div { -webkit-animation-name:bounceInDown15; animation-name:bounceInDown15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInDown15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInDown15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInDown15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInDown15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInDown15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInDown15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInDown15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInDown15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInDown15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ------------------bounceInDown2 ---------- Падение свысока+отскок---------------------------------*/ @-webkit-keyframes bounceInDown2 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); } } @keyframes bounceInDown2 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInDown2 div { opacity:0; } #bounceInDown2.animated div { -webkit-animation-name:bounceInDown2; animation-name:bounceInDown2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInDown2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInDown2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInDown2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInDown2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInDown2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInDown2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInDown2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInDown2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInDown2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* ------------------bounceInDown3 ---------- Падение свысока+отскок---------------------------------*/ @-webkit-keyframes bounceInDown3 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); } } @keyframes bounceInDown3 { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% {opacity: 1; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInDown3 div { opacity:0; } #bounceInDown3.animated div { -webkit-animation-name:bounceInDown3; animation-name:bounceInDown3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInDown3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInDown3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInDown3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInDown3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInDown3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInDown3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInDown3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInDown3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInDown3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* ---------------------------------------------------*/ /* -------------------bounceInUp05 -------Восход+отскок-------------------------*/ @-webkit-keyframes bounceInUp05 { 0% { opacity: 0; -webkit-transform: translateY(200px); transform: translateY(200px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp05 { 0% { opacity: 0; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 60% {opacity: 1; opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInUp05 div { opacity:0; } #bounceInUp05.animated div { -webkit-animation-name:bounceInUp05; animation-name:bounceInUp05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInUp05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInUp05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInUp05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInUp05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInUp05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInUp05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInUp05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInUp05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInUp05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* -------------------bounceInUp1 -------Восход+отскок-------------------------*/ @-webkit-keyframes bounceInUp1 { 0% { opacity: 0; -webkit-transform: translateY(200px); transform: translateY(200px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp1 { 0% { opacity: 0; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 60% {opacity: 1; opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInUp1 div { opacity:0; } #bounceInUp1.animated div { -webkit-animation-name:bounceInUp1; animation-name:bounceInUp1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInUp1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInUp1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInUp1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInUp1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInUp1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInUp1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInUp1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInUp1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInUp1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* -------------------bounceInUp15 -------Восход+отскок-------------------------*/ @-webkit-keyframes bounceInUp15 { 0% { opacity: 0; -webkit-transform: translateY(200px); transform: translateY(200px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp15 { 0% { opacity: 0; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 60% {opacity: 1; opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInUp15 div { opacity:0; } #bounceInUp15.animated div { -webkit-animation-name:bounceInUp15; animation-name:bounceInUp15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInUp15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInUp15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInUp15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInUp15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInUp15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInUp15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInUp15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInUp15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInUp15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* -------------------bounceInUp2 -------Восход+отскок-------------------------*/ @-webkit-keyframes bounceInUp2 { 0% { opacity: 0; -webkit-transform: translateY(200px); transform: translateY(200px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp2 { 0% { opacity: 0; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 60% {opacity: 1; opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInUp2 div { opacity:0; } #bounceInUp2.animated div { -webkit-animation-name:bounceInUp2; animation-name:bounceInUp2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInUp2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInUp2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInUp2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInUp2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInUp2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInUp2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInUp2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInUp2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInUp2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /* -------------------bounceInUp3 -------Восход+отскок-------------------------*/ @-webkit-keyframes bounceInUp3 { 0% { opacity: 0; -webkit-transform: translateY(200px); transform: translateY(200px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp3 { 0% { opacity: 0; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 60% {opacity: 1; opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% {opacity: 1; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } #bounceInUp3 div { opacity:0; } #bounceInUp3.animated div { -webkit-animation-name:bounceInUp3; animation-name:bounceInUp3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceInUp3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceInUp3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceInUp3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceInUp3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceInUp3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceInUp3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceInUp3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceInUp3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceInUp3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*-----------------------------------------*/ /*---------------fadeInRight05 ---- Справа налево--------------------------*/ @-webkit-keyframes fadeInRight05 { 0% { opacity: 0; -webkit-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight05 { 0% { opacity: 0; -webkit-transform: translateX(80px); -ms-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } #fadeInRight05 div { opacity:0; } #fadeInRight05.animated div { -webkit-animation-name:fadeInRight05; animation-name:fadeInRight05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInRight05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInRight05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInRight05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInRight05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInRight05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInRight05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInRight05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInRight05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInRight05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------------fadeInRight1 ---- Справа налево--------------------------*/ @-webkit-keyframes fadeInRight1 { 0% { opacity: 0; -webkit-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight1 { 0% { opacity: 0; -webkit-transform: translateX(80px); -ms-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } #fadeInRight1 div { opacity:0; } #fadeInRight1.animated div { -webkit-animation-name:fadeInRight1; animation-name:fadeInRight1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInRight1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInRight1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInRight1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInRight1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInRight1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInRight1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInRight1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInRight1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInRight1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------------fadeInRight15 ---- Справа налево--------------------------*/ @-webkit-keyframes fadeInRight15 { 0% { opacity: 0; -webkit-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight15 { 0% { opacity: 0; -webkit-transform: translateX(80px); -ms-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } #fadeInRight15 div { opacity:0; } #fadeInRight15.animated div { -webkit-animation-name:fadeInRight15; animation-name:fadeInRight15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInRight15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInRight15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInRight15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInRight15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInRight15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInRight15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInRight15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInRight15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInRight15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------------fadeInRight2 ---- Справа налево--------------------------*/ @-webkit-keyframes fadeInRight2 { 0% { opacity: 0; -webkit-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight2 { 0% { opacity: 0; -webkit-transform: translateX(80px); -ms-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } #fadeInRight2 div { opacity:0; } #fadeInRight2.animated div { -webkit-animation-name:fadeInRight2; animation-name:fadeInRight2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInRight2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInRight2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInRight2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInRight2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInRight2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInRight2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInRight2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInRight2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInRight2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------------fadeInRight3 ---- Справа налево--------------------------*/ @-webkit-keyframes fadeInRight3 { 0% { opacity: 0; -webkit-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight3 { 0% { opacity: 0; -webkit-transform: translateX(80px); -ms-transform: translateX(80px); transform: translateX(80px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } #fadeInRight3 div { opacity:0; } #fadeInRight3.animated div { -webkit-animation-name:fadeInRight3; animation-name:fadeInRight3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #fadeInRight3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #fadeInRight3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #fadeInRight3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #fadeInRight3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #fadeInRight3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #fadeInRight3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #fadeInRight3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #fadeInRight3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #fadeInRight3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flip05----------------*/ @-webkit-keyframes flip05 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip05 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } #flip05 div { opacity:0; } #flip05.animated div { -webkit-animation-name:flip05; animation-name:flip05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flip05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flip05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flip05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flip05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flip05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flip05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flip05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flip05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flip05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flip1----------------*/ @-webkit-keyframes flip1 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip1 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } #flip1 div { opacity:0; } #flip1.animated div { -webkit-animation-name:flip1; animation-name:flip1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flip1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flip1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flip1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flip1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flip1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flip1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flip1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flip1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flip1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flip15----------------*/ @-webkit-keyframes flip15 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip15 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } #flip15 div { opacity:0; } #flip15.animated div { -webkit-animation-name:flip15; animation-name:flip15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flip15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flip15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flip15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flip15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flip15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flip15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flip15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flip15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flip15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flip2----------------*/ @-webkit-keyframes flip2 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip2 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } #flip2 div { opacity:0; } #flip2.animated div { -webkit-animation-name:flip2; animation-name:flip2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flip2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flip2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flip2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flip2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flip2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flip2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flip2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flip2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flip2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flip3--------1606--------*/ @-webkit-keyframes flip3 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip3 { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% {opacity: 1; -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% {opacity: 1; -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } #flip3 div { opacity:0; } #flip3.animated div { -webkit-animation-name:flip3; animation-name:flip3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flip3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flip3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flip3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flip3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flip3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flip3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flip3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flip3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flip3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flipInX05----------------*/ @-webkit-keyframes flipInX05 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX05 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } #flipInX05 div { opacity:0; } #flipInX05.animated div { -webkit-animation-name:flipInX05; animation-name:flipInX05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flipInX05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flipInX05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flipInX05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flipInX05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flipInX05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flipInX05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flipInX05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flipInX05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flipInX05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flipInX1----------------*/ @-webkit-keyframes flipInX1 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX1 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } #flipInX1 div { opacity:0; } #flipInX1.animated div { -webkit-animation-name:flipInX1; animation-name:flipInX1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flipInX1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flipInX1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flipInX1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flipInX1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flipInX1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flipInX1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flipInX1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flipInX1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flipInX1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flipInX15----------------*/ @-webkit-keyframes flipInX15 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX15 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } #flipInX15 div { opacity:0; } #flipInX15.animated div { -webkit-animation-name:flipInX15; animation-name:flipInX15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flipInX15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flipInX15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flipInX15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flipInX15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flipInX15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flipInX15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flipInX15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flipInX15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flipInX15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flipInX2----------------*/ @-webkit-keyframes flipInX2 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX2 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } #flipInX2 div { opacity:0; } #flipInX2.animated div { -webkit-animation-name:flipInX2; animation-name:flipInX2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flipInX2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flipInX2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flipInX2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flipInX2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flipInX2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flipInX2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flipInX2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flipInX2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flipInX2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------flipInX3----------------*/ @-webkit-keyframes flipInX3 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX3 { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% {opacity: 1; -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% {opacity: 1; -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% {opacity: 1; -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } #flipInX3 div { opacity:0; } #flipInX3.animated div { -webkit-animation-name:flipInX3; animation-name:flipInX3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flipInX3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flipInX3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flipInX3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flipInX3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flipInX3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flipInX3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flipInX3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flipInX3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flipInX3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------lightSpeedIn05---------Скорость---------------*/ @-webkit-keyframes lightSpeedIn05 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn05 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } #lightSpeedIn05 div { opacity:0; } #lightSpeedIn05.animated div { -webkit-animation-name:lightSpeedIn05; animation-name:lightSpeedIn05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #lightSpeedIn05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #lightSpeedIn05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #lightSpeedIn05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #lightSpeedIn05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #lightSpeedIn05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #lightSpeedIn05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #lightSpeedIn05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #lightSpeedIn05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #lightSpeedIn05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------lightSpeedIn---------Скорость---------------*/ @-webkit-keyframes lightSpeedIn1 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn1 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } #lightSpeedIn1 div { opacity:0; } #lightSpeedIn1.animated div { -webkit-animation-name:lightSpeedIn1; animation-name:lightSpeedIn1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #lightSpeedIn1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #lightSpeedIn1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #lightSpeedIn1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #lightSpeedIn1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #lightSpeedIn1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #lightSpeedIn1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #lightSpeedIn1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #lightSpeedIn1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #lightSpeedIn1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------lightSpeedIn---------Скорость---------------*/ @-webkit-keyframes lightSpeedIn15 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn15 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } #lightSpeedIn15 div { opacity:0; } #lightSpeedIn15.animated div { -webkit-animation-name:lightSpeedIn15; animation-name:lightSpeedIn15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #lightSpeedIn15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #lightSpeedIn15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #lightSpeedIn15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #lightSpeedIn15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #lightSpeedIn15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #lightSpeedIn15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #lightSpeedIn15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #lightSpeedIn15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #lightSpeedIn15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------lightSpeedIn---------Скорость---------------*/ @-webkit-keyframes lightSpeedIn2 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn2 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } #lightSpeedIn2 div { opacity:0; } #lightSpeedIn2.animated div { -webkit-animation-name:lightSpeedIn2; animation-name:lightSpeedIn2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #lightSpeedIn2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #lightSpeedIn2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #lightSpeedIn2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #lightSpeedIn2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #lightSpeedIn2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #lightSpeedIn2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #lightSpeedIn2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #lightSpeedIn2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #lightSpeedIn2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------lightSpeedIn---------Скорость---------------*/ @-webkit-keyframes lightSpeedIn3 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn3 { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% {opacity: 1; -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% {opacity: 1; -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% {opacity: 1; -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } #lightSpeedIn3 div { opacity:0; } #lightSpeedIn3.animated div { -webkit-animation-name:lightSpeedIn3; animation-name:lightSpeedIn3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #lightSpeedIn3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #lightSpeedIn3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #lightSpeedIn3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #lightSpeedIn3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #lightSpeedIn3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #lightSpeedIn3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #lightSpeedIn3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #lightSpeedIn3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #lightSpeedIn3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------rotateIn05----Колесо-----------*/ @-webkit-keyframes rotateIn05 { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn05 { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } #rotateIn05 div { opacity:0; } #rotateIn05.animated div { -webkit-animation-name:rotateIn05; animation-name:rotateIn05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateIn05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateIn05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateIn05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateIn05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateIn05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateIn05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateIn05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateIn05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateIn05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------rotateIn1----Колесо-----------*/ @-webkit-keyframes rotateIn1 { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn1 { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } #rotateIn1 div { opacity:0; } #rotateIn1.animated div { -webkit-animation-name:rotateIn1; animation-name:rotateIn1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateIn1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateIn1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateIn1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateIn1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateIn1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateIn1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateIn1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateIn1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateIn1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------rotateIn1----Колесо-----------*/ @-webkit-keyframes rotateIn15 { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn15 { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } #rotateIn15 div { opacity:0; } #rotateIn15.animated div { -webkit-animation-name:rotateIn15; animation-name:rotateIn15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateIn15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateIn15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateIn15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateIn15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateIn15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateIn15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateIn15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateIn15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateIn15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------rotateIn15----Колесо-----------*/ @-webkit-keyframes rotateIn2 { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn2 { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } #rotateIn2 div { opacity:0; } #rotateIn2.animated div { -webkit-animation-name:rotateIn2; animation-name:rotateIn2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateIn2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateIn2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateIn2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateIn2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateIn2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateIn2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateIn2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateIn2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateIn2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------rotateIn3----Колесо-----------*/ @-webkit-keyframes rotateIn3 { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn3 { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } #rotateIn3 div { opacity:0; } #rotateIn3.animated div { -webkit-animation-name:rotateIn3; animation-name:rotateIn3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateIn3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateIn3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateIn3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateIn3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateIn3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateIn3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateIn3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateIn3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateIn3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------------hinge05---- Отпад---------*/ @-webkit-keyframes hinge05 { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge05 { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } #hinge05 div { opacity:0; } #hinge05.animated div { -webkit-animation-name:hinge05; animation-name:hinge05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #hinge05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hinge05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hinge05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hinge05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hinge05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hinge05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hinge05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hinge05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hinge05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------------hinge1---- Отпад---------*/ @-webkit-keyframes hinge1 { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge1 { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } #hinge1 div { opacity:0; } #hinge1.animated div { -webkit-animation-name:hinge1; animation-name:hinge1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #hinge1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hinge1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hinge1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hinge1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hinge1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hinge1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hinge1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hinge1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hinge1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------------hinge15---- Отпад---------*/ @-webkit-keyframes hinge15 { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge15 { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } #hinge15 div { opacity:0; } #hinge15.animated div { -webkit-animation-name:hinge15; animation-name:hinge15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #hinge15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hinge15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hinge15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hinge15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hinge15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hinge15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hinge15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hinge15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hinge15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------------hinge2---- Отпад---------*/ @-webkit-keyframes hinge2 { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge2 { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } #hinge2 div { opacity:0; } #hinge2.animated div { -webkit-animation-name:hinge2; animation-name:hinge2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #hinge2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hinge2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hinge2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hinge2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hinge2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hinge2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hinge2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hinge2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hinge2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------------hinge3---- Отпад---------*/ @-webkit-keyframes hinge3 { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge3 { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% {opacity: 1; -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% {opacity: 1; -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% {opacity: 1; -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } #hinge3 div { opacity:0; } #hinge3.animated div { -webkit-animation-name:hinge3; animation-name:hinge3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #hinge3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hinge3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hinge3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hinge3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hinge3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hinge3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hinge3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hinge3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hinge3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------rollIn05------Прилет------------*/ @-webkit-keyframes rollIn05 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn05 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } #rollIn05 div { opacity:0; } #rollIn05.animated div { -webkit-animation-name:rollIn05; animation-name:rollIn05; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollIn05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollIn05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollIn05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollIn05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollIn05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollIn05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollIn05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollIn05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollIn05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------rollIn1------Прилет------------*/ @-webkit-keyframes rollIn1 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn1 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } #rollIn1 div { opacity:0; } #rollIn1.animated div { -webkit-animation-name:rollIn1; animation-name:rollIn1; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollIn1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollIn1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollIn1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollIn1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollIn1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollIn1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollIn1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollIn1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollIn1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------rollIn15------Прилет------------*/ @-webkit-keyframes rollIn15 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn15 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } #rollIn15 div { opacity:0; } #rollIn15.animated div { -webkit-animation-name:rollIn15; animation-name:rollIn15; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollIn15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollIn15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollIn15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollIn15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollIn15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollIn15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollIn15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollIn15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollIn15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------rollIn2------Прилет------------*/ @-webkit-keyframes rollIn2 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn2 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } #rollIn2 div { opacity:0; } #rollIn2.animated div { -webkit-animation-name:rollIn2; animation-name:rollIn2; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollIn2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollIn2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollIn2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollIn2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollIn2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollIn2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollIn2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollIn2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollIn2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------rollIn3------Прилет------------*/ @-webkit-keyframes rollIn3 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn3 { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } #rollIn3 div { opacity:0; } #rollIn3.animated div { -webkit-animation-name:rollIn3; animation-name:rollIn3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollIn3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollIn3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollIn3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollIn3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollIn3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollIn3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollIn3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollIn3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollIn3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------------rollOut05-----Улет-----*/ @-webkit-keyframes rollOut05 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut05 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } #rollOut05 div { opacity:0; } #rollOut05.animated div { -webkit-animation-name:rollOut05; animation-name:rollOut05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollOut05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollOut05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollOut05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollOut05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollOut05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollOut05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollOut05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollOut05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollOut05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------------rollOut1-----Улет-----*/ @-webkit-keyframes rollOut1 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut1 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } #rollOut1 div { opacity:0; } #rollOut1.animated div { -webkit-animation-name:rollOut1; animation-name:rollOut1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollOut1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollOut1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollOut1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollOut1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollOut1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollOut1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollOut1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollOut1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollOut1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------------rollOut15-----Улет-----*/ @-webkit-keyframes rollOut15 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut15 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } #rollOut15 div { opacity:0; } #rollOut15.animated div { -webkit-animation-name:rollOut15; animation-name:rollOut15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollOut15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollOut15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollOut15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollOut15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollOut15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollOut15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollOut15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollOut15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollOut15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------------rollOut2-----Улет-----*/ @-webkit-keyframes rollOut2 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut2 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } #rollOut2 div { opacity:0; } #rollOut2.animated div { -webkit-animation-name:rollOut2; animation-name:rollOut2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollOut2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollOut2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollOut2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollOut2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollOut2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollOut2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollOut2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollOut2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollOut2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------------rollOut3-----Улет-----*/ @-webkit-keyframes rollOut3 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut3 { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } #rollOut3 div { opacity:0; } #rollOut3.animated div { -webkit-animation-name:rollOut3; animation-name:rollOut3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rollOut3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rollOut3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rollOut3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rollOut3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rollOut3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rollOut3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rollOut3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rollOut3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rollOut3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------flash05----Вспышка-------------*/ @-webkit-keyframes flash05 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } @keyframes flash05 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } #flash05 div { opacity:0; } #flash05.animated div { -webkit-animation-name:flash05; animation-name:flash05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flash05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flash05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flash05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flash05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flash05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flash05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flash05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flash05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flash05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------flash1----Вспышка-------------*/ @-webkit-keyframes flash1 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } @keyframes flash1 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } #flash1 div { opacity:0; } #flash1.animated div { -webkit-animation-name:flash1; animation-name:flash1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flash1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flash1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flash1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flash1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flash1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flash1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flash1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flash1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flash1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------flash15----Вспышка-------------*/ @-webkit-keyframes flash15 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } @keyframes flash15 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } #flash15 div { opacity:0; } #flash15.animated div { -webkit-animation-name:flash15; animation-name:flash15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flash15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flash15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flash15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flash15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flash15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flash15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flash15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flash15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flash15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------flash2----Вспышка-------------*/ @-webkit-keyframes flash2 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } @keyframes flash2 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } #flash2 div { opacity:0; } #flash2.animated div { -webkit-animation-name:flash2; animation-name:flash2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flash2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flash2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flash2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flash2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flash2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flash2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flash2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flash2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flash2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------flash3----Вспышка-------------*/ @-webkit-keyframes flash3 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } @keyframes flash3 { 0%, { opacity: 0; } 20%, 60%, 100% { opacity: 1; } 40%, 80% { opacity: 0; } } #flash3 div { opacity:0; } #flash3.animated div { -webkit-animation-name:flash3; animation-name:flash3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #flash3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #flash3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #flash3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #flash3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #flash3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #flash3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #flash3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #flash3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #flash3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------rubberBand05--------Резинка------------*/ @-webkit-keyframes rubberBand05 { 0% { -webkit-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes rubberBand05 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); -ms-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); -ms-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); -ms-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } #rubberBand05 div { opacity:0; } #rubberBand05.animated div { -webkit-animation-name:rubberBand05; animation-name:rubberBand05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rubberBand05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rubberBand05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rubberBand05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rubberBand05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rubberBand05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rubberBand05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rubberBand05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rubberBand05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rubberBand05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------rubberBand1--------Резинка------------*/ @-webkit-keyframes rubberBand1 { 0% { -webkit-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes rubberBand1 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); -ms-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); -ms-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); -ms-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } #rubberBand1 div { opacity:0; } #rubberBand1.animated div { -webkit-animation-name:rubberBand1; animation-name:rubberBand1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rubberBand1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rubberBand1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rubberBand1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rubberBand1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rubberBand1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rubberBand1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rubberBand1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rubberBand1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rubberBand1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------rubberBand15--------Резинка------------*/ @-webkit-keyframes rubberBand15 { 0% { -webkit-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes rubberBand15 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); -ms-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); -ms-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); -ms-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } #rubberBand15 div { opacity:0; } #rubberBand15.animated div { -webkit-animation-name:rubberBand15; animation-name:rubberBand15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rubberBand15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rubberBand15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rubberBand15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rubberBand15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rubberBand15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rubberBand15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rubberBand15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rubberBand15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rubberBand15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------rubberBand2--------Резинка------------*/ @-webkit-keyframes rubberBand2 { 0% { -webkit-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes rubberBand2 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); -ms-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); -ms-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); -ms-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } #rubberBand2 div { opacity:0; } #rubberBand2.animated div { -webkit-animation-name:rubberBand2; animation-name:rubberBand2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rubberBand2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rubberBand2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rubberBand2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rubberBand2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rubberBand2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rubberBand2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rubberBand2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rubberBand2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rubberBand2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------rubberBand3--------Резинка------------*/ @-webkit-keyframes rubberBand3 { 0% { -webkit-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes rubberBand3 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 30% {opacity: 1; -webkit-transform: scaleX(1.25) scaleY(0.75); -ms-transform: scaleX(1.25) scaleY(0.75); transform: scaleX(1.25) scaleY(0.75); } 40% {opacity: 1; -webkit-transform: scaleX(0.75) scaleY(1.25); -ms-transform: scaleX(0.75) scaleY(1.25); transform: scaleX(0.75) scaleY(1.25); } 60% {opacity: 1; -webkit-transform: scaleX(1.15) scaleY(0.85); -ms-transform: scaleX(1.15) scaleY(0.85); transform: scaleX(1.15) scaleY(0.85); } 100% {opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } #rubberBand3 div { opacity:0; } #rubberBand3.animated div { -webkit-animation-name:rubberBand3; animation-name:rubberBand3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rubberBand3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rubberBand3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rubberBand3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rubberBand3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rubberBand3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rubberBand3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rubberBand3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rubberBand3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rubberBand3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------tada05------Тада!-------------*/ @-webkit-keyframes tada05 { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada05 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } #tada05 div { opacity:0; } #tada05.animated div { -webkit-animation-name:tada05; animation-name:tada05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tada05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tada05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tada05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tada05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tada05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tada05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tada05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tada05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tada05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------tada1------Тада!-------------*/ @-webkit-keyframes tada1 { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada1 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } #tada1 div { opacity:0; } #tada1.animated div { -webkit-animation-name:tada1; animation-name:tada1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tada1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tada1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tada1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tada1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tada1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tada1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tada1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tada1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tada1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------tada15------Тада!-------------*/ @-webkit-keyframes tada15 { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada15 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } #tada15 div { opacity:0; } #tada15.animated div { -webkit-animation-name:tada15; animation-name:tada15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tada15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tada15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tada15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tada15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tada15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tada15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tada15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tada15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tada15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------tada2------Тада!-------------*/ @-webkit-keyframes tada2 { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada2 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } #tada2 div { opacity:0; } #tada2.animated div { -webkit-animation-name:tada2; animation-name:tada2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tada2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tada2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tada2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tada2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tada2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tada2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tada2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tada2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tada2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------tada3------Тада!-------------*/ @-webkit-keyframes tada3 { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada3 { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% {opacity: 1; -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% {opacity: 1; -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% {opacity: 1; -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% {opacity: 1; -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } #tada3 div { opacity:0; } #tada3.animated div { -webkit-animation-name:tada3; animation-name:tada3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tada3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tada3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tada3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tada3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tada3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tada3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tada3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tada3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tada3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------bounceIn05------Появление+Отскок--------------*/ @-webkit-keyframes bounceIn05 { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -webkit-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn05 { 0% { opacity: 0; -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; opacity: 1; -ms-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -ms-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -ms-transform: scale(1); transform: scale(1); } } #bounceIn05 div { opacity:0; } #bounceIn05.animated div { -webkit-animation-name:bounceIn05; animation-name:bounceIn05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #bounceIn05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceIn05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceIn05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceIn05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceIn05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceIn05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceIn05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceIn05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceIn05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------bounceIn1------Появление+Отскок--------------*/ @-webkit-keyframes bounceIn1 { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -webkit-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn1 { 0% { opacity: 0; -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; opacity: 1; -ms-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -ms-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -ms-transform: scale(1); transform: scale(1); } } #bounceIn1 div { opacity:0; } #bounceIn1.animated div { -webkit-animation-name:bounceIn1; animation-name:bounceIn1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%;} #bounceIn1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceIn1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceIn1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceIn1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceIn1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceIn1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceIn1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceIn1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceIn1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------bounceIn15------Появление+Отскок--------------*/ @-webkit-keyframes bounceIn15 { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -webkit-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn15 { 0% { opacity: 0; -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; opacity: 1; -ms-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -ms-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -ms-transform: scale(1); transform: scale(1); } } #bounceIn15 div { opacity:0; } #bounceIn15.animated div { -webkit-animation-name:bounceIn15; animation-name:bounceIn15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both;-moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #bounceIn15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceIn15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceIn15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceIn15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceIn15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceIn15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceIn15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceIn15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceIn15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------bounceIn2------Появление+Отскок--------------*/ @-webkit-keyframes bounceIn2 { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -webkit-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn2 { 0% { opacity: 0; -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; opacity: 1; -ms-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -ms-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -ms-transform: scale(1); transform: scale(1); } } #bounceIn2 div { opacity:0; } #bounceIn2.animated div { -webkit-animation-name:bounceIn2; animation-name:bounceIn2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; -moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%;} #bounceIn2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceIn2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceIn2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceIn2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceIn2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceIn2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceIn2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceIn2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceIn2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-------bounceIn3------Появление+Отскок--------------*/ @-webkit-keyframes bounceIn3 { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -webkit-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn3 { 0% { opacity: 0; -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; opacity: 1; -ms-transform: scale(1.05); transform: scale(1.05); } 70% { opacity: 1; -ms-transform: scale(.9); transform: scale(.9); } 100% { opacity: 1; -ms-transform: scale(1); transform: scale(1); } } #bounceIn3 div { opacity:0; } #bounceIn3.animated div { -webkit-animation-name:bounceIn3; animation-name:bounceIn3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both;-moz-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } #bounceIn3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceIn3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceIn3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceIn3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceIn3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceIn3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceIn3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceIn3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceIn3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------bounceOutLeft05----------Улет Влево---------*/ @-webkit-keyframes bounceOutLeft05 { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft05 { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } #bounceOutLeft05 div { opacity:0; } #bounceOutLeft05.animated div { -webkit-animation-name:bounceOutLeft05; animation-name:bounceOutLeft05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutLeft05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutLeft05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutLeft05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutLeft05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutLeft05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutLeft05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutLeft05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutLeft05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutLeft05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------bounceOutLeft1----------Улет Влево---------*/ @-webkit-keyframes bounceOutLeft1 { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft1 { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } #bounceOutLeft1 div { opacity:0; } #bounceOutLeft1.animated div { -webkit-animation-name:bounceOutLeft1; animation-name:bounceOutLeft1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutLeft1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutLeft1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutLeft1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutLeft1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutLeft1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutLeft1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutLeft1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutLeft1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutLeft1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------bounceOutLeft15----------Улет Влево---------*/ @-webkit-keyframes bounceOutLeft15 { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft15 { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } #bounceOutLeft15 div { opacity:0; } #bounceOutLeft15.animated div { -webkit-animation-name:bounceOutLeft15; animation-name:bounceOutLeft15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutLeft15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutLeft15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutLeft15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutLeft15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutLeft15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutLeft15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutLeft15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutLeft15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutLeft15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------bounceOutLeft2----------Улет Влево---------*/ @-webkit-keyframes bounceOutLeft2 { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft2 { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } #bounceOutLeft2 div { opacity:0; } #bounceOutLeft2.animated div { -webkit-animation-name:bounceOutLeft2; animation-name:bounceOutLeft2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutLeft2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutLeft2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutLeft2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutLeft2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutLeft2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutLeft2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutLeft2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutLeft2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutLeft2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------bounceOutLeft3----------Улет Влево---------*/ @-webkit-keyframes bounceOutLeft3 { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft3 { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } #bounceOutLeft3 div { opacity:0; } #bounceOutLeft3.animated div { -webkit-animation-name:bounceOutLeft3; animation-name:bounceOutLeft3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutLeft3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutLeft3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutLeft3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutLeft3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutLeft3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutLeft3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutLeft3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutLeft3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutLeft3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------bounceOutUp05-------Улет Вверх----------*/ @-webkit-keyframes bounceOutUp05 { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp05 { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } #bounceOutUp05 div { opacity:0; } #bounceOutUp05.animated div { -webkit-animation-name:bounceOutUp05; animation-name:bounceOutUp05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutUp05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutUp05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutUp05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutUp05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutUp05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutUp05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutUp05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutUp05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutUp05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------bounceOutUp1-------Улет Вверх----------*/ @-webkit-keyframes bounceOutUp1 { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp1 { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } #bounceOutUp1 div { opacity:0; } #bounceOutUp1.animated div { -webkit-animation-name:bounceOutUp1; animation-name:bounceOutUp1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutUp1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutUp1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutUp1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutUp1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutUp1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutUp1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutUp1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutUp1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutUp1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------bounceOutUp15-------Улет Вверх----------*/ @-webkit-keyframes bounceOutUp15 { 0% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp15 { 0% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } #bounceOutUp15 div { opacity:0; } #bounceOutUp15.animated div { -webkit-animation-name:bounceOutUp15; animation-name:bounceOutUp15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutUp15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutUp15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutUp15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutUp15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutUp15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutUp15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutUp15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutUp15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutUp15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------bounceOutUp2-------Улет Вверх----------*/ @-webkit-keyframes bounceOutUp2 { 0% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 20% {opacity: 1; opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp2 { 0% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } #bounceOutUp2 div { opacity:0; } #bounceOutUp2.animated div { -webkit-animation-name:bounceOutUp2; animation-name:bounceOutUp2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutUp2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutUp2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutUp2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutUp2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutUp2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutUp2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutUp2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutUp2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutUp2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------bounceOutUp3-------Улет Вверх----------*/ @-webkit-keyframes bounceOutUp3 { 0% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp3 { 0% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } #bounceOutUp3 div { opacity:0; } #bounceOutUp3.animated div { -webkit-animation-name:bounceOutUp3; animation-name:bounceOutUp3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #bounceOutUp3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #bounceOutUp3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #bounceOutUp3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #bounceOutUp3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #bounceOutUp3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #bounceOutUp3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #bounceOutUp3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #bounceOutUp3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #bounceOutUp3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----rotateOutUpLeft05---------Улет Влево Вверх-------------*/ @-webkit-keyframes rotateOutUpLeft05 { 0% {opacity: 1; -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft05 { 0% {opacity: 1; -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } #rotateOutUpLeft05 div { opacity:0; } #rotateOutUpLeft05.animated div { -webkit-animation-name:rotateOutUpLeft05; animation-name:rotateOutUpLeft05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOutUpLeft05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOutUpLeft05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOutUpLeft05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOutUpLeft05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOutUpLeft05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOutUpLeft05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOutUpLeft05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOutUpLeft05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOutUpLeft05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----rotateOutUpLeft1---------Улет Влево Вверх-------------*/ @-webkit-keyframes rotateOutUpLeft1 { 0% {opacity: 1; -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft1 { 0% {opacity: 1; -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } #rotateOutUpLeft1 div { opacity:0; } #rotateOutUpLeft1.animated div { -webkit-animation-name:rotateOutUpLeft1; animation-name:rotateOutUpLeft1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOutUpLeft1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOutUpLeft1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOutUpLeft1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOutUpLeft1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOutUpLeft1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOutUpLeft1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOutUpLeft1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOutUpLeft1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOutUpLeft1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----rotateOutUpLeft15---------Улет Влево Вверх-------------*/ @-webkit-keyframes rotateOutUpLeft15 { 0% {opacity: 1; -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft15 { 0% {opacity: 1; -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } #rotateOutUpLeft15 div { opacity:0; } #rotateOutUpLeft15.animated div { -webkit-animation-name:rotateOutUpLeft15; animation-name:rotateOutUpLeft15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOutUpLeft15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOutUpLeft15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOutUpLeft15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOutUpLeft15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOutUpLeft15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOutUpLeft15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOutUpLeft15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOutUpLeft15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOutUpLeft15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----rotateOutUpLeft2---------Улет Влево Вверх-------------*/ @-webkit-keyframes rotateOutUpLeft2 { 0% {opacity: 1; -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft2 { 0% {opacity: 1; -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } #rotateOutUpLeft2 div { opacity:0; } #rotateOutUpLeft2.animated div { -webkit-animation-name:rotateOutUpLeft2; animation-name:rotateOutUpLeft2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOutUpLeft2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOutUpLeft2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOutUpLeft2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOutUpLeft2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOutUpLeft2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOutUpLeft2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOutUpLeft2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOutUpLeft2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOutUpLeft2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----rotateOutUpLeft3---------Улет Влево Вверх-------------*/ @-webkit-keyframes rotateOutUpLeft3 { 0% {opacity: 1; -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft3 { 0% {opacity: 1; -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } #rotateOutUpLeft3 div { opacity:0; } #rotateOutUpLeft3.animated div { -webkit-animation-name:rotateOutUpLeft3; animation-name:rotateOutUpLeft3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOutUpLeft3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOutUpLeft3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOutUpLeft3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOutUpLeft3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOutUpLeft3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOutUpLeft3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOutUpLeft3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOutUpLeft3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOutUpLeft3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------rotateOut05-------Улет в глубь------------*/ @-webkit-keyframes rotateOut05 { 0% {opacity: 1; -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut05 { 0% {opacity: 1; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } #rotateOut05 div { opacity:0; } #rotateOut05.animated div { -webkit-animation-name:rotateOut05; animation-name:rotateOut05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOut05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOut05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOut05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOut05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOut05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOut05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOut05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOut05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOut05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------rotateOut1-------Улет в глубь------------*/ @-webkit-keyframes rotateOut1 { 0% {opacity: 1; -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut1 { 0% {opacity: 1; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } #rotateOut1 div { opacity:0; } #rotateOut1.animated div { -webkit-animation-name:rotateOut1; animation-name:rotateOut1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOut1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOut1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOut1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOut1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOut1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOut1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOut1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOut1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOut1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------rotateOut15-------Улет в глубь------------*/ @-webkit-keyframes rotateOut15 { 0% {opacity: 1; -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut15 { 0% {opacity: 1; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } #rotateOut15 div { opacity:0; } #rotateOut15.animated div { -webkit-animation-name:rotateOut15; animation-name:rotateOut15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOut15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOut15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOut15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOut15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOut15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOut15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOut15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOut15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOut15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------rotateOut2-------Улет в глубь------------*/ @-webkit-keyframes rotateOut2 { 0% {opacity: 1; -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut2 { 0% {opacity: 1; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } #rotateOut2 div { opacity:0; } #rotateOut2.animated div { -webkit-animation-name:rotateOut2; animation-name:rotateOut2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOut2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOut2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOut2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOut2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOut2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOut2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOut2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOut2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOut2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*--------rotateOut3-------Улет в глубь------------*/ @-webkit-keyframes rotateOut3 { 0% {opacity: 1; -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut3 { 0% {opacity: 1; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } #rotateOut3 div { opacity:0; } #rotateOut3.animated div { -webkit-animation-name:rotateOut3; animation-name:rotateOut3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #rotateOut3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #rotateOut3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #rotateOut3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #rotateOut3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #rotateOut3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #rotateOut3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #rotateOut3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #rotateOut3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #rotateOut3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------transformRight05---Колесо Слева направо--------------*/ @keyframes transformRight05 { 0% { opacity:0; transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; transform:translateX(0) rotate(0); } } @-webkit-keyframes transformRight05 { 0% { opacity:0; -webkit-transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; -webkit-transform:translateX(0) rotate(0); } } #transformRight05 div { opacity:0; } #transformRight05.animated div { -webkit-animation-name:transformRight05; animation-name:transformRight05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #transformRight05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #transformRight05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #transformRight05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #transformRight05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #transformRight05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #transformRight05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #transformRight05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #transformRight05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #transformRight05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------transformRight1---Колесо Слева направо--------------*/ @keyframes transformRight1 { 0% { opacity:0; transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; transform:translateX(0) rotate(0); } } @-webkit-keyframes transformRight1 { 0% { opacity:0; -webkit-transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; -webkit-transform:translateX(0) rotate(0); } } #transformRight1 div { opacity:0; } #transformRight1.animated div { -webkit-animation-name:transformRight1; animation-name:transformRight1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #transformRight1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #transformRight1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #transformRight1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #transformRight1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #transformRight1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #transformRight1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #transformRight1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #transformRight1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #transformRight1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------transformRight15---Колесо Слева направо--------------*/ @keyframes transformRight15 { 0% { opacity:0; transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; transform:translateX(0) rotate(0); } } @-webkit-keyframes transformRight15 { 0% { opacity:0; -webkit-transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; -webkit-transform:translateX(0) rotate(0); } } #transformRight15 div { opacity:0; } #transformRight15.animated div { -webkit-animation-name:transformRight15; animation-name:transformRight15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #transformRight15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #transformRight15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #transformRight15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #transformRight15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #transformRight15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #transformRight15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #transformRight15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #transformRight15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #transformRight15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------transformRight2---Колесо Слева направо--------------*/ @keyframes transformRight2 { 0% { opacity:0; transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; transform:translateX(0) rotate(0); } } @-webkit-keyframes transformRight2 { 0% { opacity:0; -webkit-transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; -webkit-transform:translateX(0) rotate(0); } } #transformRight2 div { opacity:0; } #transformRight2.animated div { -webkit-animation-name:transformRight2; animation-name:transformRight2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #transformRight2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #transformRight2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #transformRight2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #transformRight2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #transformRight2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #transformRight2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #transformRight2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #transformRight2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #transformRight2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------transformRight3---Колесо Слева направо--------------*/ @keyframes transformRight3 { 0% { opacity:0; transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; transform:translateX(0) rotate(0); } } @-webkit-keyframes transformRight3 { 0% { opacity:0; -webkit-transform:translateX(-1200px) rotate(-280deg); } 100% { opacity:1; -webkit-transform:translateX(0) rotate(0); } } #transformRight3 div { opacity:0; } #transformRight3.animated div { -webkit-animation-name:transformRight3; animation-name:transformRight3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #transformRight3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #transformRight3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #transformRight3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #transformRight3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #transformRight3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #transformRight3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #transformRight3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #transformRight3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #transformRight3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------expandOpen05--------Прилет 2---------*/ @keyframes expandOpen05 { 0% { transform: scale(1.8); } 50% {opacity:1; transform: scale(0.95); } 80% {opacity:1; transform: scale(1.05); } 90% {opacity:1; transform: scale(0.98); } 100% {opacity:1; transform: scale(1); } } @-webkit-keyframes expandOpen05 { 0% { -webkit-transform: scale(1.8); } 50% {opacity:1; -webkit-transform: scale(0.95); } 80% {opacity:1; -webkit-transform: scale(1.05); } 90% {opacity:1; -webkit-transform: scale(0.98); } 100% {opacity:1; -webkit-transform: scale(1); } } #expandOpen05 div { opacity:0; } #expandOpen05.animated div { -webkit-animation-name:expandOpen05; animation-name:expandOpen05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #expandOpen05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #expandOpen05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #expandOpen05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #expandOpen05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #expandOpen05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #expandOpen05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #expandOpen05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #expandOpen05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #expandOpen05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------expandOpen1--------Прилет 2---------*/ @keyframes expandOpen1 { 0% { transform: scale(1.8); } 50% {opacity:1; transform: scale(0.95); } 80% {opacity:1; transform: scale(1.05); } 90% {opacity:1; transform: scale(0.98); } 100% {opacity:1; transform: scale(1); } } @-webkit-keyframes expandOpen1 { 0% { -webkit-transform: scale(1.8); } 50% {opacity:1; -webkit-transform: scale(0.95); } 80% {opacity:1; -webkit-transform: scale(1.05); } 90% {opacity:1; -webkit-transform: scale(0.98); } 100% {opacity:1; -webkit-transform: scale(1); } } #expandOpen1 div { opacity:0; } #expandOpen1.animated div { -webkit-animation-name:expandOpen1; animation-name:expandOpen1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #expandOpen1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #expandOpen1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #expandOpen1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #expandOpen1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #expandOpen1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #expandOpen1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #expandOpen1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #expandOpen1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #expandOpen1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------expandOpen15--------Прилет 2---------*/ @keyframes expandOpen15 { 0% { transform: scale(1.8); } 50% {opacity:1; transform: scale(0.95); } 80% {opacity:1; transform: scale(1.05); } 90% {opacity:1; transform: scale(0.98); } 100% {opacity:1; transform: scale(1); } } @-webkit-keyframes expandOpen15 { 0% { -webkit-transform: scale(1.8); } 50% {opacity:1; -webkit-transform: scale(0.95); } 80% {opacity:1; -webkit-transform: scale(1.05); } 90% {opacity:1; -webkit-transform: scale(0.98); } 100% {opacity:1; -webkit-transform: scale(1); } } #expandOpen15 div { opacity:0; } #expandOpen15.animated div { -webkit-animation-name:expandOpen15; animation-name:expandOpen15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #expandOpen15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #expandOpen15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #expandOpen15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #expandOpen15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #expandOpen15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #expandOpen15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #expandOpen15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #expandOpen15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #expandOpen15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------expandOpen2--------Прилет 2---------*/ @keyframes expandOpen2 { 0% { transform: scale(1.8); } 50% {opacity:1; transform: scale(0.95); } 80% {opacity:1; transform: scale(1.05); } 90% {opacity:1; transform: scale(0.98); } 100% {opacity:1; transform: scale(1); } } @-webkit-keyframes expandOpen2 { 0% { -webkit-transform: scale(1.8); } 50% {opacity:1; -webkit-transform: scale(0.95); } 80% {opacity:1; -webkit-transform: scale(1.05); } 90% {opacity:1; -webkit-transform: scale(0.98); } 100% {opacity:1; -webkit-transform: scale(1); } } #expandOpen2 div { opacity:0; } #expandOpen2.animated div { -webkit-animation-name:expandOpen2; animation-name:expandOpen2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #expandOpen2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #expandOpen2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #expandOpen2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #expandOpen2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #expandOpen2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #expandOpen2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #expandOpen2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #expandOpen2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #expandOpen2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------expandOpen3--------Прилет 2---------*/ @keyframes expandOpen3 { 0% { transform: scale(1.8); } 50% {opacity:1; transform: scale(0.95); } 80% {opacity:1; transform: scale(1.05); } 90% {opacity:1; transform: scale(0.98); } 100% {opacity:1; transform: scale(1); } } @-webkit-keyframes expandOpen3 { 0% { -webkit-transform: scale(1.8); } 50% {opacity:1; -webkit-transform: scale(0.95); } 80% {opacity:1; -webkit-transform: scale(1.05); } 90% {opacity:1; -webkit-transform: scale(0.98); } 100% {opacity:1; -webkit-transform: scale(1); } } #expandOpen3 div { opacity:0; } #expandOpen3.animated div { -webkit-animation-name:expandOpen3; animation-name:expandOpen3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #expandOpen3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #expandOpen3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #expandOpen3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #expandOpen3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #expandOpen3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #expandOpen3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #expandOpen3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #expandOpen3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #expandOpen3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------floating05------Болванчик----------*/ @keyframes floating05 { 0% {opacity:1; transform: translateY(0%); } 50% {opacity:1; transform: translateY(8%); } 100% {opacity:1; transform: translateY(0%); } } @-webkit-keyframes floating05 { 0% {opacity:1; -webkit-transform: translateY(0%); } 50% {opacity:1; -webkit-transform: translateY(8%); } 100% {opacity:1; -webkit-transform: translateY(0%); } } #floating05 div { opacity:0; } #floating05.animated div { -webkit-animation-name:floating05; animation-name:floating05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #floating05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #floating05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #floating05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #floating05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #floating05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #floating05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #floating05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #floating05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #floating05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------floating1------Болванчик----------*/ @keyframes floating1 { 0% {opacity:1; transform: translateY(0%); } 50% {opacity:1; transform: translateY(8%); } 100% {opacity:1; transform: translateY(0%); } } @-webkit-keyframes floating1 { 0% {opacity:1; -webkit-transform: translateY(0%); } 50% {opacity:1; -webkit-transform: translateY(8%); } 100% {opacity:1; -webkit-transform: translateY(0%); } } #floating1 div { opacity:0; } #floating1.animated div { -webkit-animation-name:floating1; animation-name:floating1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #floating1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #floating1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #floating1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #floating1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #floating1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #floating1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #floating1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #floating1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #floating1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------floating15------Болванчик----------*/ @keyframes floating15 { 0% {opacity:1; transform: translateY(0%); } 50% {opacity:1; transform: translateY(8%); } 100% {opacity:1; transform: translateY(0%); } } @-webkit-keyframes floating15 { 0% {opacity:1; -webkit-transform: translateY(0%); } 50% {opacity:1; -webkit-transform: translateY(8%); } 100% {opacity:1; -webkit-transform: translateY(0%); } } #floating15 div { opacity:0; } #floating15.animated div { -webkit-animation-name:floating15; animation-name:floating15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #floating15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #floating15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #floating15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #floating15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #floating15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #floating15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #floating15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #floating15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #floating15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------floating2------Болванчик----------*/ @keyframes floating2 { 0% {opacity:1; transform: translateY(0%); } 50% {opacity:1; transform: translateY(8%); } 100% {opacity:1; transform: translateY(0%); } } @-webkit-keyframes floating2 { 0% {opacity:1; -webkit-transform: translateY(0%); } 50% {opacity:1; -webkit-transform: translateY(8%); } 100% {opacity:1; -webkit-transform: translateY(0%); } } #floating2 div { opacity:0; } #floating2.animated div { -webkit-animation-name:floating2; animation-name:floating2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #floating2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #floating2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #floating2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #floating2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #floating2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #floating2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #floating2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #floating2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #floating2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*-----------floating3------Болванчик----------*/ @keyframes floating3 { 0% {opacity:1; transform: translateY(0%); } 50% {opacity:1; transform: translateY(8%); } 100% {opacity:1; transform: translateY(0%); } } @-webkit-keyframes floating3 { 0% {opacity:1; -webkit-transform: translateY(0%); } 50% {opacity:1; -webkit-transform: translateY(8%); } 100% {opacity:1; -webkit-transform: translateY(0%); } } #floating3 div { opacity:0; } #floating3.animated div { -webkit-animation-name:floating3; animation-name:floating3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #floating3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #floating3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #floating3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #floating3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #floating3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #floating3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #floating3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #floating3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #floating3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------tossing05---------Болванчик 2---------*/ @keyframes tossing05 { 0% {opacity:1; transform: rotate(-4deg); } 50% {opacity:1; transform: rotate(4deg); } 100% {opacity:1; transform: rotate(-4deg); } } @-webkit-keyframes tossing05 { 0% {opacity:1; -webkit-transform: rotate(-4deg); } 50% {opacity:1; -webkit-transform: rotate(4deg); } 100% {opacity:1; -webkit-transform: rotate(-4deg); } } #tossing05 div { opacity:0; } #tossing05.animated div { -webkit-animation-name:tossing05; animation-name:tossing05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tossing05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tossing05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tossing05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tossing05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tossing05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tossing05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tossing05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tossing05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tossing05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------tossing1---------Болванчик 2---------*/ @keyframes tossing1 { 0% {opacity:1; transform: rotate(-4deg); } 50% {opacity:1; transform: rotate(4deg); } 100% {opacity:1; transform: rotate(-4deg); } } @-webkit-keyframes tossing1 { 0% {opacity:1; -webkit-transform: rotate(-4deg); } 50% {opacity:1; -webkit-transform: rotate(4deg); } 100% {opacity:1; -webkit-transform: rotate(-4deg); } } #tossing1 div { opacity:0; } #tossing1.animated div { -webkit-animation-name:tossing1; animation-name:tossing1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tossing1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tossing1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tossing1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tossing1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tossing1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tossing1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tossing1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tossing1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tossing1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------tossing15---------Болванчик 2---------*/ @keyframes tossing15 { 0% {opacity:1; transform: rotate(-4deg); } 50% {opacity:1; transform: rotate(4deg); } 100% {opacity:1; transform: rotate(-4deg); } } @-webkit-keyframes tossing15 { 0% {opacity:1; -webkit-transform: rotate(-4deg); } 50% {opacity:1; -webkit-transform: rotate(4deg); } 100% {opacity:1; -webkit-transform: rotate(-4deg); } } #tossing15 div { opacity:0; } #tossing15.animated div { -webkit-animation-name:tossing15; animation-name:tossing15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tossing15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tossing15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tossing15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tossing15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tossing15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tossing15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tossing15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tossing15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tossing15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------tossing2---------Болванчик 2---------*/ @keyframes tossing2 { 0% {opacity:1; transform: rotate(-4deg); } 50% {opacity:1; transform: rotate(4deg); } 100% {opacity:1; transform: rotate(-4deg); } } @-webkit-keyframes tossing2 { 0% {opacity:1; -webkit-transform: rotate(-4deg); } 50% {opacity:1; -webkit-transform: rotate(4deg); } 100% {opacity:1; -webkit-transform: rotate(-4deg); } } #tossing2 div { opacity:0; } #tossing2.animated div { -webkit-animation-name:tossing2; animation-name:tossing2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tossing2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tossing2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tossing2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tossing2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tossing2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tossing2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tossing2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tossing2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tossing2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*---------tossing3---------Болванчик 2---------*/ @keyframes tossing3 { 0% {opacity:1; transform: rotate(-4deg); } 50% {opacity:1; transform: rotate(4deg); } 100% {opacity:1; transform: rotate(-4deg); } } @-webkit-keyframes tossing3 { 0% {opacity:1; -webkit-transform: rotate(-4deg); } 50% {opacity:1; -webkit-transform: rotate(4deg); } 100% {opacity:1; -webkit-transform: rotate(-4deg); } } #tossing3 div { opacity:0; } #tossing3.animated div { -webkit-animation-name:tossing3; animation-name:tossing3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; } #tossing3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #tossing3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #tossing3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #tossing3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #tossing3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #tossing3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #tossing3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #tossing3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #tossing3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------hatch05---------------*/ @keyframes hatch05 { 0% { transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; transform: rotate(2deg) scaleY(1); } 50% {opacity:1; transform: rotate(-2deg); } 65% {opacity:1; transform: rotate(1deg); } 80% {opacity:1; transform: rotate(-1deg); } 100% {opacity:1; transform: rotate(0deg); } } @-webkit-keyframes hatch05 { 0% { -webkit-transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; -webkit-transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; -webkit-transform: rotate(2deg) scaleY(1); } 50% {opacity:1; -webkit-transform: rotate(-2deg); } 65% {opacity:1; -webkit-transform: rotate(1deg); } 80% {opacity:1; -webkit-transform: rotate(-1deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); } } #hatch05 div { opacity:0; } #hatch05.animated div { -webkit-animation-name:hatch05; animation-name:hatch05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; } #hatch05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hatch05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hatch05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hatch05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hatch05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hatch05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hatch05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hatch05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hatch05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------hatch1---------------*/ @keyframes hatch1 { 0% { transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; transform: rotate(2deg) scaleY(1); } 50% {opacity:1; transform: rotate(-2deg); } 65% {opacity:1; transform: rotate(1deg); } 80% {opacity:1; transform: rotate(-1deg); } 100% {opacity:1; transform: rotate(0deg); } } @-webkit-keyframes hatch1 { 0% { -webkit-transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; -webkit-transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; -webkit-transform: rotate(2deg) scaleY(1); } 50% {opacity:1; -webkit-transform: rotate(-2deg); } 65% {opacity:1; -webkit-transform: rotate(1deg); } 80% {opacity:1; -webkit-transform: rotate(-1deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); } } #hatch1 div { opacity:0; } #hatch1.animated div { -webkit-animation-name:hatch1; animation-name:hatch1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; } #hatch1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hatch1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hatch1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hatch1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hatch1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hatch1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hatch1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hatch1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hatch1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------hatch15---------------*/ @keyframes hatch15 { 0% { transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; transform: rotate(2deg) scaleY(1); } 50% {opacity:1; transform: rotate(-2deg); } 65% {opacity:1; transform: rotate(1deg); } 80% {opacity:1; transform: rotate(-1deg); } 100% {opacity:1; transform: rotate(0deg); } } @-webkit-keyframes hatch15 { 0% { -webkit-transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; -webkit-transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; -webkit-transform: rotate(2deg) scaleY(1); } 50% {opacity:1; -webkit-transform: rotate(-2deg); } 65% {opacity:1; -webkit-transform: rotate(1deg); } 80% {opacity:1; -webkit-transform: rotate(-1deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); } } #hatch15 div { opacity:0; } #hatch15.animated div { -webkit-animation-name:hatch15; animation-name:hatch15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; } #hatch15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hatch15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hatch15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hatch15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hatch15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hatch15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hatch15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hatch15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hatch15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------hatch2---------------*/ @keyframes hatch2 { 0% { transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; transform: rotate(2deg) scaleY(1); } 50% {opacity:1; transform: rotate(-2deg); } 65% {opacity:1; transform: rotate(1deg); } 80% {opacity:1; transform: rotate(-1deg); } 100% {opacity:1; transform: rotate(0deg); } } @-webkit-keyframes hatch2 { 0% { -webkit-transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; -webkit-transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; -webkit-transform: rotate(2deg) scaleY(1); } 50% {opacity:1; -webkit-transform: rotate(-2deg); } 65% {opacity:1; -webkit-transform: rotate(1deg); } 80% {opacity:1; -webkit-transform: rotate(-1deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); } } #hatch2 div { opacity:0; } #hatch2.animated div { -webkit-animation-name:hatch2; animation-name:hatch2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; } #hatch2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hatch2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hatch2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hatch2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hatch2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hatch2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hatch2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hatch2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hatch2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*------------hatch3---------------*/ @keyframes hatch3 { 0% { transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; transform: rotate(2deg) scaleY(1); } 50% {opacity:1; transform: rotate(-2deg); } 65% {opacity:1; transform: rotate(1deg); } 80% {opacity:1; transform: rotate(-1deg); } 100% {opacity:1; transform: rotate(0deg); } } @-webkit-keyframes hatch3 { 0% { -webkit-transform: rotate(0deg) scaleY(0.6); } 20% {opacity:1; -webkit-transform: rotate(-2deg) scaleY(1.05); } 35% {opacity:1; -webkit-transform: rotate(2deg) scaleY(1); } 50% {opacity:1; -webkit-transform: rotate(-2deg); } 65% {opacity:1; -webkit-transform: rotate(1deg); } 80% {opacity:1; -webkit-transform: rotate(-1deg); } 100% {opacity:1; -webkit-transform: rotate(0deg); } } #hatch3 div { opacity:0; } #hatch3.animated div { -webkit-animation-name:hatch3; animation-name:hatch3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; } #hatch3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #hatch3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #hatch3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #hatch3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #hatch3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #hatch3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #hatch3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #hatch3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #hatch3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------stretchRight05----------Растяжка Слева Направо-------*/ @keyframes stretchRight05 { 0% { transform: scaleX(0.3); } 40% {opacity:1; transform: scaleX(1.02); } 60% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(1); } } @-webkit-keyframes stretchRight05 { 0% { -webkit-transform: scaleX(0.3); } 40% {opacity:1; -webkit-transform: scaleX(1.02); } 60% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(1); } } #stretchRight05 div { opacity:0; } #stretchRight05.animated div { -webkit-animation-name:stretchRight05; animation-name:stretchRight05; -webkit-animation-duration:0.5s; animation-duration:0.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out; transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; } #stretchRight05.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #stretchRight05.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #stretchRight05.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #stretchRight05.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #stretchRight05.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #stretchRight05.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #stretchRight05.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #stretchRight05.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #stretchRight05.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------stretchRight1----------Растяжка Слева Направо-------*/ @keyframes stretchRight1 { 0% { transform: scaleX(0.3); } 40% {opacity:1; transform: scaleX(1.02); } 60% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(1); } } @-webkit-keyframes stretchRight1 { 0% { -webkit-transform: scaleX(0.3); } 40% {opacity:1; -webkit-transform: scaleX(1.02); } 60% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(1); } } #stretchRight1 div { opacity:0; } #stretchRight1.animated div { -webkit-animation-name:stretchRight1; animation-name:stretchRight1; -webkit-animation-duration:1s; animation-duration:1s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out; transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; } #stretchRight1.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #stretchRight1.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #stretchRight1.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #stretchRight1.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #stretchRight1.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #stretchRight1.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #stretchRight1.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #stretchRight1.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #stretchRight1.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------stretchRight15----------Растяжка Слева Направо-------*/ @keyframes stretchRight15 { 0% { transform: scaleX(0.3); } 40% {opacity:1; transform: scaleX(1.02); } 60% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(1); } } @-webkit-keyframes stretchRight15 { 0% { -webkit-transform: scaleX(0.3); } 40% {opacity:1; -webkit-transform: scaleX(1.02); } 60% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(1); } } #stretchRight15 div { opacity:0; } #stretchRight15.animated div { -webkit-animation-name:stretchRight15; animation-name:stretchRight15; -webkit-animation-duration:1.5s; animation-duration:1.5s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out; transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; } #stretchRight15.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #stretchRight15.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #stretchRight15.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #stretchRight15.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #stretchRight15.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #stretchRight15.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #stretchRight15.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #stretchRight15.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #stretchRight15.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------stretchRight2----------Растяжка Слева Направо-------*/ @keyframes stretchRight2 { 0% { transform: scaleX(0.3); } 40% {opacity:1; transform: scaleX(1.02); } 60% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(1); } } @-webkit-keyframes stretchRight2 { 0% { -webkit-transform: scaleX(0.3); } 40% {opacity:1; -webkit-transform: scaleX(1.02); } 60% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(1); } } #stretchRight2 div { opacity:0; } #stretchRight2.animated div { -webkit-animation-name:stretchRight2; animation-name:stretchRight2; -webkit-animation-duration:2s; animation-duration:2s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out; transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; } #stretchRight2.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #stretchRight2.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #stretchRight2.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #stretchRight2.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #stretchRight2.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #stretchRight2.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #stretchRight2.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #stretchRight2.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #stretchRight2.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/ /*----------stretchRight3----------Растяжка Слева Направо-------*/ @keyframes stretchRight3 { 0% { transform: scaleX(0.3); } 40% {opacity:1; transform: scaleX(1.02); } 60% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(0.98); } 80% {opacity:1; transform: scaleX(1.01); } 100% {opacity:1; transform: scaleX(1); } } @-webkit-keyframes stretchRight3 { 0% { -webkit-transform: scaleX(0.3); } 40% {opacity:1; -webkit-transform: scaleX(1.02); } 60% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(0.98); } 80% {opacity:1; -webkit-transform: scaleX(1.01); } 100% {opacity:1; -webkit-transform: scaleX(1); } } #stretchRight3 div { opacity:0; } #stretchRight3.animated div { -webkit-animation-name:stretchRight3; animation-name:stretchRight3; -webkit-animation-duration:3s; animation-duration:3s; -webkit-animation-fill-mode:both; animation-fill-mode:both; animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out; transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; } #stretchRight3.animated div.block10 {-webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; } #stretchRight3.animated div.block2 { -webkit-animation-delay:0.2s; animation-delay:0.2s; } #stretchRight3.animated div.block3 { -webkit-animation-delay:0.4s; animation-delay:0.4s; } #stretchRight3.animated div.block4 { -webkit-animation-delay:0.6s; animation-delay:0.6s; } #stretchRight3.animated div.block5 { -webkit-animation-delay:0.8s; animation-delay:0.8s; } #stretchRight3.animated div.block6 { -webkit-animation-delay:1s; animation-delay:1s; } #stretchRight3.animated div.block7 { -webkit-animation-delay:1.2s; animation-delay:1.2s; } #stretchRight3.animated div.block8 { -webkit-animation-delay:1.6s; animation-delay:1.6s; } #stretchRight3.animated div.block9 { -webkit-animation-delay:2s; animation-delay:2s; } /*---------------------------*/