/* Animation =========================== */ @-webkit-keyframes pulse { 0% { -webkit-box-shadow: 0 0 0 0 $color3; } 70% { -webkit-box-shadow: 0 0 0 10px rgba(204,169,44, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0); } } @keyframes pulse { 0% { -moz-box-shadow: 0 0 0 0 $color3; box-shadow: 0 0 0 0 $color3; } 70% { -moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0); box-shadow: 0 0 0 10px rgba(204,169,44, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0); box-shadow: 0 0 0 0 rgba(204,169,44, 0); } } @keyframes blip1 { to { transform: scale(3); opacity: 0; } } @keyframes blip2 { to { transform: scale(2); opacity: 0; } } @-moz-keyframes pulsate { 0% { -webkit-transform: scale(0.1, 0.1); -moz-transform: scale(0.1, 0.1); -ms-transform: scale(0.1, 0.1); transform: scale(0.1, 0.1); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } 50% { opacity: 1; -ms-filter: none; filter: none; } 100% { -webkit-transform: scale(1.2, 1.2); -moz-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } } @-webkit-keyframes pulsate { 0% { -webkit-transform: scale(0.1, 0.1); -moz-transform: scale(0.1, 0.1); -ms-transform: scale(0.1, 0.1); transform: scale(0.1, 0.1); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } 50% { opacity: 1; -ms-filter: none; filter: none; } 100% { -webkit-transform: scale(1.2, 1.2); -moz-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } } @-o-keyframes pulsate { 0% { -webkit-transform: scale(0.1, 0.1); -moz-transform: scale(0.1, 0.1); -ms-transform: scale(0.1, 0.1); transform: scale(0.1, 0.1); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } 50% { opacity: 1; -ms-filter: none; filter: none; } 100% { -webkit-transform: scale(1.2, 1.2); -moz-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } } @keyframes pulsate { 0% { -webkit-transform: scale(0.1, 0.1); -moz-transform: scale(0.1, 0.1); -ms-transform: scale(0.1, 0.1); transform: scale(0.1, 0.1); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } 50% { opacity: 1; -ms-filter: none; filter: none; } 100% { -webkit-transform: scale(1.2, 1.2); -moz-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } } @-moz-keyframes bounce { 0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -webkit-transform: translateY(-2000px) rotate(-45deg); -moz-transform: translateY(-2000px) rotate(-45deg); -ms-transform: translateY(-2000px) rotate(-45deg); transform: translateY(-2000px) rotate(-45deg); } 60% { opacity: 1; -ms-filter: none; filter: none; -webkit-transform: translateY(30px) rotate(-45deg); -moz-transform: translateY(30px) rotate(-45deg); -ms-transform: translateY(30px) rotate(-45deg); transform: translateY(30px) rotate(-45deg); } 80% { -webkit-transform: translateY(-10px) rotate(-45deg); -moz-transform: translateY(-10px) rotate(-45deg); -ms-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } 100% { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -ms-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); } } @-webkit-keyframes bounce { 0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -webkit-transform: translateY(-2000px) rotate(-45deg); -moz-transform: translateY(-2000px) rotate(-45deg); -ms-transform: translateY(-2000px) rotate(-45deg); transform: translateY(-2000px) rotate(-45deg); } 60% { opacity: 1; -ms-filter: none; filter: none; -webkit-transform: translateY(30px) rotate(-45deg); -moz-transform: translateY(30px) rotate(-45deg); -ms-transform: translateY(30px) rotate(-45deg); transform: translateY(30px) rotate(-45deg); } 80% { -webkit-transform: translateY(-10px) rotate(-45deg); -moz-transform: translateY(-10px) rotate(-45deg); -ms-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } 100% { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -ms-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); } } @-o-keyframes bounce { 0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -webkit-transform: translateY(-2000px) rotate(-45deg); -moz-transform: translateY(-2000px) rotate(-45deg); -ms-transform: translateY(-2000px) rotate(-45deg); transform: translateY(-2000px) rotate(-45deg); } 60% { opacity: 1; -ms-filter: none; filter: none; -webkit-transform: translateY(30px) rotate(-45deg); -moz-transform: translateY(30px) rotate(-45deg); -ms-transform: translateY(30px) rotate(-45deg); transform: translateY(30px) rotate(-45deg); } 80% { -webkit-transform: translateY(-10px) rotate(-45deg); -moz-transform: translateY(-10px) rotate(-45deg); -ms-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } 100% { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -ms-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); } } @keyframes bounce { 0% { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -webkit-transform: translateY(-2000px) rotate(-45deg); -moz-transform: translateY(-2000px) rotate(-45deg); -ms-transform: translateY(-2000px) rotate(-45deg); transform: translateY(-2000px) rotate(-45deg); } 60% { opacity: 1; -ms-filter: none; filter: none; -webkit-transform: translateY(30px) rotate(-45deg); -moz-transform: translateY(30px) rotate(-45deg); -ms-transform: translateY(30px) rotate(-45deg); transform: translateY(30px) rotate(-45deg); } 80% { -webkit-transform: translateY(-10px) rotate(-45deg); -moz-transform: translateY(-10px) rotate(-45deg); -ms-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } 100% { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -ms-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); } }