????
| Current Path : /home2/morganrand/www/wp-content/plugins/pinwheel-slider/css/skins/multi/ |
| Current File : /home2/morganrand/www/wp-content/plugins/pinwheel-slider/css/skins/multi/style.css |
/*
Version: 3.1.6
Upgrade: Using new file.
*/
/*basic styles*/
.pinwheel_slider.pinwheel_multi div,
.pinwheel_slider.pinwheel_multi p,
.pinwheel_slider.pinwheel_multi li,
.pinwheel_slider.pinwheel_multi span,
.pinwheel_slider.pinwheel_multi img,
.pinwheel_slider.pinwheel_multi h2,
.pinwheel_slider.pinwheel_multi ul {
list-style: none;
vertical-align: baseline;
}
.pinwheel_slider.pinwheel_multi {
overflow: hidden;
margin: 0 0 0 0;
line-height: 18px;
position: relative;
width: 100%;
}
.pinwheel_slider.pinwheel_multi .pinwheel_slider_handle {
width: 100%;
height: 100%;
position: relative;
}
.pinwheel_slider.pinwheel_multi .pinwheel_slider_thumbnail {
border: 0;
display: block;
padding: 0px !important;
max-width: 100%;
max-height: 100%;
width: 100%;
height: 100%;
}
.pinwheel_slider.pinwheel_multi .focuscrop {
overflow:hidden !important;
}
.pinwheel_slider.pinwheel_multi .focuscrop .pinwheel_slider_thumbnail{
position: absolute;
left: 0;
top: 0;
margin: 0;
display: block;
width: auto !important;
height: auto !important;
min-width: 100%;
min-height: 100%;
max-width: none;
max-height: none;
box-sizing: border-box;
}
.pinwheel_slider.pinwheel_multi span {
display: inline;
}
.pinwheel_slider.pinwheel_multi a {
border: none !important;
text-decoration: none !important;
}
.pinwheel_slider.pinwheel_multi a:hover {
text-decoration: underline !important;
}
.pinwheel_slider.pinwheel_multi h2 {
clear: none;
display: block;
padding: 0px;
border: none;
text-shadow: none
}
.pinwheel_slider.pinwheel_multi p.more a {
text-decoration: underline;
float: right;
}
.pinwheel_slider.pinwheel_multi p.more a:hover {
text-decoration: none;
}
.pinwheel_slider.pinwheel_multi .pinwheel_slideri {
overflow: hidden;
position: absolute;
top: -1000px;
left: -1000px;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
-ms-box-sizing: content-box;
box-sizing: content-box;
}
.pinwheel_slider.pinwheel_multi .pinwheel_text {
position: absolute;
bottom: 0;
width: 100%;
box-sizing:border-box;
padding: 5px;
}
.pinwheel_slider.pinwheel_multi .pinwheel_text span{
display:inline-block;
}
.pinwheel_slider.pinwheel_multi .pinwheel_text h2,
.pinwheel_slider.pinwheel_multi .pinwheel_text p {
opacity: 1;
}
/* Content Hide */
.pinwheel_slider.pinwheel_multi .texthide {
z-index: 200;
color: #ffffff;
position: absolute;
right: 0;
top: 0;
cursor: pointer;
background: #000000 url(images/close.png) no-repeat center center;
height: 18px;
width: 18px;
text-align: center;
font-family: "Trebuchet MS", Arial, Helvetica, san-serif;
font-weight: bold;
font-size: 16px;
line-height: 30px;
display: none;
}
/* Content Show */
.pinwheel_slider.pinwheel_multi .textshow {
color: #ffffff;
z-index: 200;
position: absolute;
right: 0;
background: #000000 url(images/info.png) no-repeat center center;
height: 18px;
width: 18px;
text-align: center;
cursor: pointer;
bottom: 0;
font-family: "Trebuchet MS", Arial, Helvetica, san-serif;
font-weight: bold;
font-size: 16px;
line-height: 30px;
display: none;
}
/* Next and Previous navigational arrows */
.pinwheel_slider.pinwheel_multi .pinwheel_next {
position: absolute;
top: 40%;
right: 5%;
cursor: pointer;
z-index: 10;
}
.pinwheel_slider.pinwheel_multi .pinwheel_prev {
position: absolute;
top: 40%;
left: 5%;
cursor: pointer;
z-index: 10;
}
/* Navigation Numbers */
.pinwheel_slider.pinwheel_multi .tracker-summation-container {
position: absolute;
right: 5px;
bottom: 0;
padding: 3px;
margin: 0 0 10px 0 !important;
background-color: #777;
font-family: Arial, Helvetica, sans-serif;
color: #fff;
font-size: 12px;
padding: 2px 5px;
font-weight: bold;
z-index: 2;
}
.pinwheel_slider.pinwheel_multi .tracker-individual-container {
position: absolute;
color: white;
left: 5px;
bottom: 0;
padding: 0;
margin: 0 0 10px 0 !important;
z-index: 2;
}
.pinwheel_slider.pinwheel_multi .tracker-individual-container li {
list-style: none !important;
margin: 0 !important;
}
.pinwheel_slider.pinwheel_multi .tracker-individual-container .tracker-individual-blip {
margin: 0 3px;
padding: 0 5px !important;
text-align: center;
background-color: #777;
font-family: Arial, Helvetica, sans-serif;
color: #fff;
font-size: 12px
}
.pinwheel_slider.pinwheel_multi .tracker-individual-container .tracker-individual-blip-selected {
color: white;
font-weight: bold;
background-color: #222;
}
.pinwheel_slider.pinwheel_multi .sldr_clearlt {
display: block;
visibility: hidden;
clear: left;
height: 0;
content: ".";
}
.pinwheel_slider.pinwheel_multi .sldr_clearrt {
display: block;
visibility: hidden;
clear: right;
height: 0;
content: ".";
}
.pinwheel_slider.pinwheel_multi .pinwheel_video,
.pinwheel_slider.pinwheel_multi .wp-video-shortcode {
margin: 0 !important;
position: absolute !important;
top: 0;
left: 0;
height: 100% !important;
}
.pinwheel_slider.pinwheel_multi .pinwheel_eshortcode {
margin: 0 !important;
position: absolute !important;
top: 0;
left: 0;
max-height: 100%;
width: 100%;
height: 100%;
}
.pinwheel_slider.pinwheel_multi .pinwheel_eshortcode img{
max-width: 100% !important;
}
.pinwheel_slider.pinwheel_multi .mejs-overlay-button {
margin-left: -50px;
top: 50%;
margin-top: -50px !important;
}
.mejs-overlay {
height: 100% !important;
}
.pinwheel_feature_slide .mejs-overlay-button {
display: none;
}
.pinwheel_slider.pinwheel_multi iframe {
position: absolute !important;
top: 0 !important;
max-width: 100% !important;
max-height: 100% !important;
width: 100% !important;
height: 100% !important;
}
.pinwheel_slider.youtube .pinwheel_eshortcode .mejs-overlay-button{
display: none;
}
.pinwheel_slider.pinwheel_multi div.mejs-inner,.pinwheel_slider.pinwheel_multi div.wp-video-shortcode,.pinwheel_slider.pinwheel_multi div.wp-video,.pinwheel_slider.pinwheel_multi .mejs-layers,.pinwheel_slider.pinwheel_multi .mejs-overlay-play,.pinwheel_slider.pinwheel_multi .me-plugin,.pinwheel_slider.pinwheel_multi .me-plugin * {
height: 100% !important;
width: 421px !important;
}
.pinwheel_slider.pinwheel_multi .pinwheel_zoom {
position: absolute;
top: 50%;
left: 50%;
margin-top: -20px;
margin-left: -21px;
display: none;
}
/* Validation Error */
#pinwheel_slider_form input.error {
border: 1px solid #D8000C;
padding: 5px 0
}
/**
* --------------------------------------------------------------------------------------------------------------
* V3.0
*
* Added for wooCommerce skin
* --------------------------------------------------------------------------------------------------------------
**/
div.pinwheel-active .slidernav_htitle.eshop {
background: none;
margin-bottom: 4px !important;
}
.pinwheel_slider.pinwheel_multi .pinwheel_woocat_wrap {
}
.pinwheel_slider.pinwheel_multi .pinwheel_woocat {
padding: 5px 0 2px 20px;
background: url(images/category.png) no-repeat center left;
margin-right: 3em;
}
.pinwheel_slider.pinwheel_multi .woo_sale {
height: 35px ;
position: absolute;
width: 180px ;
margin-left: -65px;
background-color: green;
z-index: 99;
-ms-transform: rotate(320deg); /* IE 9 */
-webkit-transform: rotate(320deg); /* Chrome, Safari, Opera */
transform: rotate(320deg); /* Standard syntax */
}
.pinwheel_slider.pinwheel_multi .woo_sale span {
padding: 8px 0px 0px 66px;
display: block;
font-size: 19px;
color: white;
}
.pinwheel_slider.pinwheel_multi .slidewoorate {
display: block;
}
.pinwheel_slider.pinwheel_multi .wooreview {
padding-left: 7px;
color: #ffffff;
font-size: 12px;
line-height: 25px;
}
.pinwheel_slider.pinwheel_multi .rateit {
vertical-align: bottom;
}
.pinwheel_slider.pinwheel_multi .woonavprice {
display: table-cell;
}
.pinwheel_slider.pinwheel_multi .pinwheel_text.carousel-caption .pinwheel_inner_content{
bottom: 0;
min-height: 90px;
}
.pinwheel_inner_content {
background-color: #333333;
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#AAECECEC',endColorstr='#AAECECEC');
box-shadow: 0 -5px 5px -5px #333;
padding: 10px 0px 0px 0px;
z-index: 2; width:38%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
height:100%;
float:left;
position:absolute;
}
.pinwheel_slider.pinwheel_multi .pinwheel_text.carousel-caption .all-content{
margin-left:40%;
float:left;
width:60%;
position: relative;
min-height: 90px;
}
.pinwheel_slider.pinwheel_multi .add_to_cart_button{
display:block;
text-align:center;
}
.pinwheel_slider.pinwheel_multi .add_to_cart_button button{
background: #519d42;
font-size: 12px;
color: #ffffff;
border: 1px solid #519d42;
border-radius: 0;
padding: 4px 10px;
}
.pinwheel_slider.pinwheel_multi .forwoocal{
padding:0 !important;
}
.pinwheel_slider.pinwheel_multi span.regular{
display:block;
text-align: center;
margin-bottom: 5px;
}
.pinwheel_slider.pinwheel_multi span.sale-price{
display:block;
text-align: center;
margin-bottom: 5px;
}
/**
* --------------------------------------------------------------------------------------------------------------
* V3.0
*
* Added for eCommerce skin
* --------------------------------------------------------------------------------------------------------------
**/
.pinwheel_slider.pinwheel_multi .wpsc_buy_button {
border-radius: 0;
padding: 4px 10px;
}
.pinwheel_slider.pinwheel_multi .wpsc-add-to-cart-button{
text-align: center;
display: inline;
}
.pinwheel_slider.pinwheel_multi .pinwheel-woocat {
float: right;
margin-bottom: 2px;
padding: 5px 0 2px 20px;
background: url(images/category.png) no-repeat center left;
margin-right: 3em;
}
.pinwheel_slider.pinwheel_multi .checkout_link {
display:none;
color:#ffffff;
}
/**
* --------------------------------------------------------------------------------------------------------------
* V3.0 :
*
* Added for eCommerce and WooCommerce Star rating
* --------------------------------------------------------------------------------------------------------------
**/
/*star gold*/
.pinwheel_slider.pinwheel_multi div.gold div.rateit-selected {
background: url(../../../images/star/gold.png);
}
.pinwheel_slider.pinwheel_multi div.gold div.rateit-range {
background: url(../../../images/star/range.png);
height: 32px;
}
/*star black*/
.pinwheel_slider.pinwheel_multi div.black div.rateit-selected {
background: url(../../../images/star/black.png);
}
.pinwheel_slider.pinwheel_multi div.black div.rateit-range {
background: url(../../../images/star/range.png);
height: 32px;
}
/*star red*/
.pinwheel_slider.pinwheel_multi div.red div.rateit-selected {
background: url(../../../images/star/red.png);
}
.pinwheel_slider.pinwheel_multi div.red div.rateit-range {
background: url(../../../images/star/range.png);
height: 32px;
}
/*star green*/
.pinwheel_slider.pinwheel_multi div.green div.rateit-selected {
background: url(../../../images/star/green.png);
}
.pinwheel_slider.pinwheel_multi div.green div.rateit-range {
background: url(../../../images/star/range.png);
height: 32px;
}
/*star yellow*/
.pinwheel_slider.pinwheel_multi div.yellow div.rateit-selected {
background: url(../../../images/star/yellow.png);
}
.pinwheel_slider.pinwheel_multi div.yellow div.rateit-range {
background: url(../../../images/star/range.png);
height: 32px;
}
/*star grogreen*/
.pinwheel_slider.pinwheel_multi div.grogreen div.rateit-selected {
background: url(../../../images/star/grogreen.png);
}
.pinwheel_slider.pinwheel_multi div.grogreen div.rateit-range {
background: url(../../../images/star/rangegro.png);
height: 32px;
}
/*star grored*/
.pinwheel_slider.pinwheel_multi div.grored div.rateit-selected {
background: url(../../../images/star/grored.png);
}
.pinwheel_slider.pinwheel_multi div.grored div.rateit-range {
background: url(../../../images/star/rangegro.png);
height: 32px;
}
/*star groyellow*/
.pinwheel_slider.pinwheel_multi div.groyellow div.rateit-selected {
background: url(../../../images/star/groyellow.png);
}
.pinwheel_slider.pinwheel_multi div.groyellow div.rateit-range {
background: url(../../../images/star/rangegro.png);
height: 32px;
}
/**
* --------------------------------------------------------------------------------------------------------------
* V3.0 :
*
* Added for events skin
*
* --------------------------------------------------------------------------------------------------------------
**/
.pinwheel_slider.pinwheel_multi .pinwheel_eventcat_wrap {
margin-bottom:7px;
}
.pinwheel_slider.pinwheel_multi .pinwheel_eventcat {
padding: 0px 0 0px 20px;
background: url(images/category.png) no-repeat center left;
}
.pinwheel_slider.pinwheel_multi div.pinwheel-excerpt div.eventwrap {
width: 100%;
display: flex;
}
.pinwheel_slider.pinwheel_multi div.pinwheel-excerpt div.eventwrap p {
width: 60%;
float: left;
}
.pinwheel_slider.pinwheel_multi .pinwheel_eventaddr {
padding: 20px 0px 0px 22px;
float: left;
background: url(images/pin.png) no-repeat center left;
margin-top: 2px;
}
.pinwheel_slider.pinwheel_multi .event_addr {
display:block;
}
.pinwheel_slider.pinwheel_multi .event_address_wrap {
margin-bottom:7px;
}
.pinwheel_slider.pinwheel_multi .slidedatetime {
display: block;
margin-left: 5px;
}
.pinwheel_slider.pinwheel_multi .event_heading {
width: 90%;
}
/*
Added for pinwheel slider edit link
*/
.pinwheel-edit {
margin: 5px 0;
display: block;
}
.pinwheel_slider.pinwheel_multi .eventday{
font-size: 30px;
display: inline;
}
.pinwheel_slider.pinwheel_multi .eventday::before{
content:url(images/calendar.png) no-repeat center left;
}
.pinwheel_slider.pinwheel_multi .etime::before{
content:url(images/clock.png) no-repeat center left;
}
.pinwheel_slider.pinwheel_multi .eventdate ,.pinwheel_slider.pinwheel_multi .eventtime{
display:block;
}
.pinwheel_slider.pinwheel_multi .etime{
margin:0;
}
/**
* --------------------------------------------------------------------------------------------------------------
* V3.0
*
* Style For Animation Effects (Transitions) *
* --------------------------------------------------------------------------------------------------------------
**/
.pinwheel-animated {
-webkit-animation-duration: 1s;
-moz-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode: both;
animation-fill-mode: both;
}
.pinwheel-animated.infinite {
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.pinwheel-animated.pinwheel-hinge {
-webkit-animation-duration: 2s;
-moz-animation-duration: 2s;
animation-duration: 2s;
}
@-webkit-keyframes svbounce {
0%, 20%, 53%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
40%, 43% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0,-4px,0);
transform: translate3d(0,-4px,0);
}
}
@-moz-keyframes svbounce {
0%, 20%, 53%, 80%, 100% {
-moz-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-moz-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
40%, 43% {
-moz-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-moz-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-moz-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-moz-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-moz-transform: translate3d(0,-4px,0);
transform: translate3d(0,-4px,0);
}
}
@keyframes svbounce {
0%, 20%, 53%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
40%, 43% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0,-4px,0);
transform: translate3d(0,-4px,0);
}
}
.pinwheel-bounce {
-webkit-animation-name: svbounce;
-moz-animation-name: svbounce;
animation-name: svbounce;
-webkit-transform-origin: center bottom;
-moz-transform-origin: center bottom;
-ms-transform-origin: center bottom;
transform-origin: center bottom;
}
@-webkit-keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@-moz-keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
.pinwheel-flash {
-webkit-animation-name: flash;
-moz-animation-name: flash;
animation-name: flash;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-moz-keyframes pulse {
0% {
-moz-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-moz-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-moz-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes pulse {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pinwheel-pulse {
-webkit-animation-name: pulse;
-moz-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes rubberBand {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(.95, 1.05, 1);
transform: scale3d(.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, .95, 1);
transform: scale3d(1.05, .95, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-moz-keyframes rubberBand {
0% {
-moz-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-moz-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-moz-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-moz-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-moz-transform: scale3d(.95, 1.05, 1);
transform: scale3d(.95, 1.05, 1);
}
75% {
-moz-transform: scale3d(1.05, .95, 1);
transform: scale3d(1.05, .95, 1);
}
100% {
-moz-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes rubberBand {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(.95, 1.05, 1);
transform: scale3d(.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, .95, 1);
transform: scale3d(1.05, .95, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pinwheel-rubberBand {
-webkit-animation-name: rubberBand;
-moz-animation-name: rubberBand;
animation-name: rubberBand;
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@-moz-keyframes shake {
0%, 100% {
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-moz-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-moz-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@keyframes shake {
0%, 100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
.pinwheel-shake {
-webkit-animation-name: shake;
-moz-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
@-moz-keyframes swing {
20% {
-moz-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-moz-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-moz-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-moz-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-moz-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
.pinwheel-swing {
-webkit-transform-origin: top center;
-moz-transform-origin: top center;
-ms-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
-moz-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-moz-keyframes tada {
0% {
-moz-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-moz-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-moz-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-moz-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-moz-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes tada {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pinwheel-tada {
-webkit-animation-name: tada;
-moz-animation-name: tada;
animation-name: tada;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
0% {
-webkit-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes wobble {
0% {
-moz-transform: none;
transform: none;
}
15% {
-moz-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-moz-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-moz-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-moz-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-moz-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-moz-transform: none;
transform: none;
}
}
@keyframes wobble {
0% {
-webkit-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.pinwheel-wobble {
-webkit-animation-name: wobble;
-moz-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes svbounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(.97, .97, .97);
transform: scale3d(.97, .97, .97);
}
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-moz-keyframes svbounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-moz-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-moz-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
20% {
-moz-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-moz-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
60% {
opacity: 1;
-moz-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-moz-transform: scale3d(.97, .97, .97);
transform: scale3d(.97, .97, .97);
}
100% {
opacity: 1;
-moz-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes svbounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(.97, .97, .97);
transform: scale3d(.97, .97, .97);
}
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pinwheel-bounceIn {
-webkit-animation-name: svbounceIn;
-moz-animation-name: svbounceIn;
animation-name: svbounceIn;
-webkit-animation-duration: .75s;
-moz-animation-duration: .75s;
animation-duration: .75s;
}
@-webkit-keyframes svbounceInDown {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svbounceInDown {
0%, 60%, 75%, 90%, 100% {
-moz-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-moz-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-moz-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-moz-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-moz-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
100% {
-moz-transform: none;
transform: none;
}
}
@keyframes svbounceInDown {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.pinwheel-bounceInDown {
-webkit-animation-name: svbounceInDown;
-moz-animation-name: svbounceInDown;
animation-name: svbounceInDown;
}
@-webkit-keyframes svbounceInLeft {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svbounceInLeft {
0%, 60%, 75%, 90%, 100% {
-moz-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-moz-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-moz-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-moz-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-moz-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
100% {
-moz-transform: none;
transform: none;
}
}
@keyframes svbounceInLeft {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.pinwheel-bounceInLeft {
-webkit-animation-name: svbounceInLeft;
-moz-animation-name: svbounceInLeft;
animation-name: svbounceInLeft;
}
@-webkit-keyframes svbounceInRight {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svbounceInRight {
0%, 60%, 75%, 90%, 100% {
-moz-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-moz-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-moz-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-moz-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-moz-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
100% {
-moz-transform: none;
transform: none;
}
}
@keyframes svbounceInRight {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.pinwheel-bounceInRight {
-webkit-animation-name: svbounceInRight;
-moz-animation-name: svbounceInRight;
animation-name: svbounceInRight;
}
@-webkit-keyframes svbounceInUp {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@-moz-keyframes svbounceInUp {
0%, 60%, 75%, 90%, 100% {
-moz-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-moz-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-moz-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-moz-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-moz-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
100% {
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes svbounceInUp {
0%, 60%, 75%, 90%, 100% {
-webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.pinwheel-bounceInUp {
-webkit-animation-name: svbounceInUp;
-moz-animation-name: svbounceInUp;
animation-name: svbounceInUp;
}
@-webkit-keyframes svfadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@-moz-keyframes svfadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes svfadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
.pinwheel-fadeIn {
-webkit-animation-name: svfadeIn;
-moz-animation-name: svfadeIn;
animation-name: svfadeIn;
}
@-webkit-keyframes svfadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svfadeInDown {
0% {
opacity: 0;
-moz-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
@keyframes svfadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.pinwheel-fadeInDown {
-webkit-animation-name: svfadeInDown;
-moz-animation-name: svfadeInDown;
animation-name: svfadeInDown;
}
@-webkit-keyframes svfadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svfadeInDownBig {
0% {
opacity: 0;
-moz-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
@keyframes svfadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.pinwheel-fadeInDownBig {
-webkit-animation-name: svfadeInDownBig;
-moz-animation-name: svfadeInDownBig;
animation-name: svfadeInDownBig;
}
@-webkit-keyframes svfadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svfadeInLeft {
0% {
opacity: 0;
-moz-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
@keyframes svfadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.pinwheel-fadeInLeft {
-webkit-animation-name: svfadeInLeft;
-moz-animation-name: svfadeInLeft;
animation-name: svfadeInLeft;
}
@-webkit-keyframes svfadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svfadeInLeftBig {
0% {
opacity: 0;
-moz-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
.pinwheel-fadeInLeftBig {
-webkit-animation-name: svfadeInLeftBig;
-moz-animation-name: svfadeInLeftBig;
animation-name: svfadeInLeftBig;
}
@-webkit-keyframes svfadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svfadeInRight {
0% {
opacity: 0;
-moz-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
@keyframes svfadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.pinwheel-fadeInRight {
-webkit-animation-name: svfadeInRight;
-moz-animation-name: svfadeInRight;
animation-name: svfadeInRight;
}
@-webkit-keyframes svfadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svfadeInRightBig {
0% {
opacity: 0;
-moz-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
@keyframes svfadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.pinwheel-fadeInRightBig {
-webkit-animation-name: svfadeInRightBig;
-moz-animation-name: svfadeInRightBig;
animation-name: svfadeInRightBig;
}
@-webkit-keyframes svfadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svfadeInUp {
0% {
opacity: 0;
-moz-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
@keyframes svfadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.pinwheel-fadeInUp {
-webkit-animation-name: svfadeInUp;
-moz-animation-name: svfadeInUp;
animation-name: svfadeInUp;
}
@-webkit-keyframes svfadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svfadeInUpBig {
0% {
opacity: 0;
-moz-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
@keyframes svfadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.pinwheel-fadeInUpBig {
-webkit-animation-name: svfadeInUpBig;
-moz-animation-name: svfadeInUpBig;
animation-name: svfadeInUpBig;
}
@-webkit-keyframes svflip {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(.95, .95, .95);
transform: perspective(400px) scale3d(.95, .95, .95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@-moz-keyframes svflip {
0% {
-moz-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-moz-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-moz-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-moz-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-moz-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-moz-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-moz-transform: perspective(400px) scale3d(.95, .95, .95);
transform: perspective(400px) scale3d(.95, .95, .95);
-moz-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-moz-transform: perspective(400px);
transform: perspective(400px);
-moz-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes svflip {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(.95, .95, .95);
transform: perspective(400px) scale3d(.95, .95, .95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.pinwheel-animated.pinwheel-flip {
-webkit-backface-visibility: visible;
-moz-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: svflip;
-moz-animation-name: svflip;
animation-name: svflip;
}
@-webkit-keyframes svflipInX {
0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@-moz-keyframes svflipInX {
0% {
-moz-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-moz-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-moz-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-moz-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-moz-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-moz-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-moz-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes svflipInX {
0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.pinwheel-flipInX {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: svflipInX;
-moz-animation-name: svflipInX;
animation-name: svflipInX;
}
@-webkit-keyframes svflipInY {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@-moz-keyframes svflipInY {
0% {
-moz-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-moz-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-moz-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-moz-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-moz-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-moz-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-moz-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes svflipInY {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.pinwheel-flipInY {
-webkit-backface-visibility: visible !important;
-moz-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: svflipInY;
-moz-animation-name: svflipInY;
animation-name: svflipInY;
}
@-webkit-keyframes svlightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes svlightSpeedIn {
0% {
-moz-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-moz-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-moz-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes svlightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.pinwheel-lightSpeedIn {
-webkit-animation-name: svlightSpeedIn;
-moz-animation-name: svlightSpeedIn;
animation-name: svlightSpeedIn;
-webkit-animation-timing-function: ease-out;
-moz-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes svrotateIn {
0% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes svrotateIn {
0% {
-moz-transform-origin: center;
transform-origin: center;
-moz-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-moz-transform-origin: center;
transform-origin: center;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes svrotateIn {
0% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.pinwheel-rotateIn {
-webkit-animation-name: svrotateIn;
-moz-animation-name: svrotateIn;
animation-name: svrotateIn;
}
@-webkit-keyframes svrotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes svrotateInDownLeft {
0% {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-moz-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes svrotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.pinwheel-rotateInDownLeft {
-webkit-animation-name: svrotateInDownLeft;
-moz-animation-name: svrotateInDownLeft;
animation-name: svrotateInDownLeft;
}
@-webkit-keyframes svrotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes svrotateInDownRight {
0% {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-moz-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes svrotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.pinwheel-rotateInDownRight {
-webkit-animation-name: svrotateInDownRight;
-moz-animation-name: svrotateInDownRight;
animation-name: svrotateInDownRight;
}
@-webkit-keyframes svrotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes svrotateInUpLeft {
0% {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-moz-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-moz-transform-origin: left bottom;
transform-origin: left bottom;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes svrotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.pinwheel-rotateInUpLeft {
-webkit-animation-name: svrotateInUpLeft;
-moz-animation-name: svrotateInUpLeft;
animation-name: svrotateInUpLeft;
}
@-webkit-keyframes svrotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@-moz-keyframes svrotateInUpRight {
0% {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-moz-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-moz-transform-origin: right bottom;
transform-origin: right bottom;
-moz-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes svrotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.pinwheel-rotateInUpRight {
-webkit-animation-name: svrotateInUpRight;
-moz-animation-name: svrotateInUpRight;
animation-name: svrotateInUpRight;
}
@-webkit-keyframes svhinge {
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% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
100% {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@-moz-keyframes svhinge {
0% {
-moz-transform-origin: top left;
transform-origin: top left;
-moz-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-moz-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-moz-transform-origin: top left;
transform-origin: top left;
-moz-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-moz-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-moz-transform-origin: top left;
transform-origin: top left;
-moz-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
100% {
-moz-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@keyframes svhinge {
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% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
100% {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
.pinwheel-hinge {
-webkit-animation-name: svhinge;
-moz-animation-name: svhinge;
animation-name: svhinge;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes svrollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@-moz-keyframes svrollIn {
0% {
opacity: 0;
-moz-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-moz-transform: none;
transform: none;
}
}
@keyframes svrollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.pinwheel-rollIn {
-webkit-animation-name: svrollIn;
-moz-animation-name: svrollIn;
animation-name: svrollIn;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes svzoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
50% {
opacity: 1;
}
}
@-moz-keyframes svzoomIn {
0% {
opacity: 0;
-moz-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
50% {
opacity: 1;
}
}
@keyframes svzoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
50% {
opacity: 1;
}
}
.pinwheel-zoomIn {
-webkit-animation-name: svzoomIn;
-moz-animation-name: svzoomIn;
animation-name: svzoomIn;
}
@-webkit-keyframes svzoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@-moz-keyframes svzoomInDown {
0% {
opacity: 0;
-moz-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-moz-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-moz-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes svzoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.pinwheel-zoomInDown {
-webkit-animation-name: svzoomInDown;
-moz-animation-name: svzoomInDown;
animation-name: svzoomInDown;
}
@-webkit-keyframes svzoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@-moz-keyframes svzoomInLeft {
0% {
opacity: 0;
-moz-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-moz-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-moz-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes svzoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.pinwheel-zoomInLeft {
-webkit-animation-name: svzoomInLeft;
-moz-animation-name: svzoomInLeft;
animation-name: svzoomInLeft;
}
@-webkit-keyframes svzoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@-moz-keyframes svzoomInRight {
0% {
opacity: 0;
-moz-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-moz-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-moz-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes svzoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.pinwheel-zoomInRight {
-webkit-animation-name: svzoomInRight;
-moz-animation-name: svzoomInRight;
animation-name: svzoomInRight;
}
@-webkit-keyframes svzoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@-moz-keyframes svzoomInUp {
0% {
opacity: 0;
-moz-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-moz-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-moz-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-moz-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes svzoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.pinwheel-zoomInUp {
-webkit-animation-name: svzoomInUp;
-moz-animation-name: svzoomInUp;
animation-name: svzoomInUp;
}
@-webkit-keyframes svslideInDown {
0% {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@-moz-keyframes svslideInDown {
0% {
-moz-transform: translateY(-100%);
transform: translateY(-100%);
visibility: visible;
}
100% {
-moz-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes svslideInDown {
0% {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
.pinwheel-slideInDown {
-webkit-animation-name: svslideInDown;
-moz-animation-name: svslideInDown;
animation-name: svslideInDown;
}
@-webkit-keyframes svslideInLeft {
0% {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-moz-keyframes svslideInLeft {
0% {
-moz-transform: translateX(-100%);
transform: translateX(-100%);
visibility: visible;
}
100% {
-moz-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes svslideInLeft {
0% {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.pinwheel-slideInLeft {
-webkit-animation-name: svslideInLeft;
-moz-animation-name: svslideInLeft;
animation-name: svslideInLeft;
}
@-webkit-keyframes svslideInRight {
0% {
-webkit-transform: translateX(100%);
transform: translateX(100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@-moz-keyframes svslideInRight {
0% {
-moz-transform: translateX(100%);
transform: translateX(100%);
visibility: visible;
}
100% {
-moz-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes svslideInRight {
0% {
-webkit-transform: translateX(100%);
transform: translateX(100%);
visibility: visible;
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.pinwheel-slideInRight {
-webkit-animation-name: svslideInRight;
-moz-animation-name: svslideInRight;
animation-name: svslideInRight;
}
@-webkit-keyframes svslideInUp {
0% {
-webkit-transform: translateY(100%);
transform: translateY(100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@-moz-keyframes svslideInUp {
0% {
-moz-transform: translateY(100%);
transform: translateY(100%);
visibility: visible;
}
100% {
-moz-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes svslideInUp {
0% {
-webkit-transform: translateY(100%);
transform: translateY(100%);
visibility: visible;
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
.pinwheel-slideInUp {
-webkit-animation-name: svslideInUp;
-moz-animation-name: svslideInUp;
animation-name: svslideInUp;
}
/* END - Animation Effect */
/* M e d i a Q u e r i e s */
@media only screen and (max-width: 480px) {
.pinwheel_center_slide .carousel-caption {
display: none !important;
}
.pinwheel_center_slide .carousel-caption span,
.pinwheel_center_slide .carousel-caption .more {
display: none;
}
.pinwheel_center_slide .carousel-caption h2 a {
font-size: 10px!important;
}
.pinwheel_slider.pinwheel_multi .mejs-overlay-button {
background: url(images/bigplay_small.png) no-repeat !important;
margin-left: -13px;
top: 50%;
margin-top: -13px !important;
}
.pinwheel_slider.pinwheel_multi .pinwheel_next img {
width: 20px;
height: 20px;
}
.pinwheel_slider.pinwheel_multi .pinwheel_prev img {
width: 20px;
height: 20px;
}
.pinwheel_slider.pinwheel_multi .tracker-individual-container {
display: none !important;
}
}
@media only screen and (min-width: 481px) and (max-width: 768px) {
.pinwheel_center_slide .carousel-caption span,
.pinwheel_center_slide .carousel-caption .more {
display: none;
}
.pinwheel_center_slide .carousel-caption h2 a {
font-size: 12px!important;
}
.pinwheel_slider.pinwheel_multi .mejs-overlay-button {
background: url(images/bigplay.png) no-repeat !important;
margin-left: -25px;
top: 50%;
margin-top: -25px !important;
}
}