html{position:relative;min-height:100%}body{margin:0 0 60px 0}p,ul{font-size:1.2em}a,button,a:hover,a:focus{-webkit-transition:background .8s ease-in-out;transition:background .8s ease-in-out}a{color:#999d8e}.contact-details a,.legal a{color:#333}.legal a{text-decoration:underline}a:hover,a:focus{color:#605a5d;text-decoration:none}.header .navbar-default{background:rgba(153,157,142,.9)}.header{position:absolute;top:0;z-index:10;width:100%}.logo{margin-left:30px;margin-top:10px;margin-bottom:0}.header .header-top-bar{font-size:18px;color:#fff;position:absolute;right:0;top:0;padding-top:10px}.header-top-bar a{color:#fff;text-decoration:none;margin-left:10px;margin-right:10px}.header-top-bar a:hover{opacity:.6}.header-top-bar .header-contact{background-color:#605a5d;display:inline;border-radius:0 5px 0;padding:20px 0 10px 10px}.header-contact-mobile a{font-size:18px;text-decoration:none;color:#fff;padding-top:10px;padding-bottom:10px}.navbar{margin-bottom:0;border:none;border-radius:0}.nav.navbar-nav li a,.navbar-nav .open .dropdown-menu>li>a{color:#fff!important;font-size:18px}.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>.active>a:focus,.navbar-default .navbar-nav>li>a:hover,.navbar-default .navbar-nav>li>a:focus,.navbar-default .navbar-nav>.open>a,.navbar-default .navbar-nav>.open>a:hover,.navbar-default .navbar-nav>.open>a:focus{background:none;opacity:.6}.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>.open>a,.navbar-default .navbar-nav>.open>a:hover{opacity:.6}.dropdown-menu{background:#999d8e;font-size:1em}.navbar-nav .open .dropdown-menu>li>a:hover,.navbar-nav .open .dropdown-menu>li>a:focus{background-color:#999d8e!important;color:#fff!important}.navbar-default .navbar-toggle{margin-left:auto;margin-right:auto;margin-bottom:20px;float:none;color:#fff;border-color:#fff;background-color:#605a5d}.navbar-default .navbar-toggle:hover,.navbar-default .navbar-toggle:focus{background:#3a3638}footer{background:#605a5d;padding:20px 0}footer p{font-size:1em;color:#fff}footer p a,footer p a:hover{color:#fff}footer.footer{position:absolute;bottom:0;width:100%;height:60px}#social-networking-side{position:fixed;right:0;width:32px;z-index:20}#social-networking-side img{margin-bottom:10px}#social-networking-bottom{margin:20px 0;text-align:center}#social-networking-bottom img{margin-left:5px;margin-right:5px}h1{color:#333}h2{color:#999d8e}#contact-map h2,.contact-form h2{color:#333}#large-carousel{position:absolute;width:100%}#large-carousel .carousel-inner img{width:100%}#large-carousel .carousel-inner .item::after{display:block;position:relative;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(255,255,255,0)),to(#fff));background-image:linear-gradient(to bottom,rgba(255,255,255,0) 0,#fff 100%);margin-top:-130px;height:130px;width:100%;content:''}#large-carousel.carousel-fade .carousel-inner .item{opacity:0;-webkit-transition-property:opacity;transition-property:opacity}#large-carousel.carousel-fade .carousel-inner .active{opacity:1}#large-carousel.carousel-fade .carousel-inner .active.left,#large-carousel.carousel-fade .carousel-inner .active.right{left:0;opacity:0;z-index:1}#large-carousel.carousel-fade .carousel-inner .next.left,#large-carousel.carousel-fade .carousel-inner .prev.right{opacity:1}#large-carousel.carousel-fade .carousel-control{z-index:2}.search-facility{padding:10px 20px 20px;background:rgba(255,255,255,.7)}.search-facility .heading{font-size:1.8em;color:#333;margin-bottom:20px}.search-facility .nav-tabs{border-bottom:0;margin-bottom:20px}.search-facility .nav-tabs>li>a{border:none;border-radius:5px;font-size:1em;padding-top:10px;padding-bottom:10px;text-transform:uppercase;margin-left:1px;margin-right:1px}.search-facility .nav-tabs{margin-top:20px}.search-facility .nav-tabs li a:link,.search-facility .nav-tabs li a:visited{background:#999d8e!important;color:#fff!important;text-decoration:none;border:none}.search-facility .nav-tabs li a:hover,.search-facility .nav-tabs li a:active{background:#605a5d!important;border:none!important}.search-facility .nav-tabs li.active a{background:#605a5d!important;border:none!important}.search-facility .btn-default{font-size:1.2em}.draw-search-container{margin:30px 0}.draw-search-container .btn{font-size:1.2em}.btn-draw-search{background-color:#605a5d;color:#fff!important;border:none}.btn-draw-search:hover,.btn-draw-search.focus,.btn-draw-search:focus,.btn-draw-search.active,.btn-draw-search:active,.btn-draw-search.active.focus,.btn-draw-search.active:focus,.btn-draw-search.active:hover,.btn-draw-search:active.focus,.btn-draw-search:active:focus,.btn-draw-search:active:hover{background-color:#255e69!important;color:#fff;border:none}.box1,.box2,.box3{margin-top:30px;color:#fff;padding:20px}.box1{background:rgba(153,157,142,.9) url(/images/bird-small.png.pagespeed.ce.-SHSEX7SsI.png) top 5px right 5px no-repeat}.box2{background:rgba(96,90,93,.9)}.box3{background:rgba(221,188,42,.9)}.box1 .heading,.box2 .heading,.box3 .heading{margin:0 0 30px;font-size:1.8em}.btn-box1,.btn-box2,.btn-box3{margin-top:50px;text-align:left;font-size:1.6em;color:#fff!important;border:none}.btn-box1{background-color:#605a5d}.btn-box2{background-color:#3a3638}.btn-box3{background-color:#605a5d}.btn-box1:hover,.btn-box1.focus,.btn-box1:focus,.btn-box1.active,.btn-box1:active,.btn-box1.active.focus,.btn-box1.active:focus,.btn-box1.active:hover,.btn-box1:active.focus,.btn-box1:active:focus,.btn-box1:active:hover,.btn-box2:hover,.btn-box2.focus,.btn-box2:focus,.btn-box2.active,.btn-box2:active,.btn-box2.active.focus,.btn-box2.active:focus,.btn-box2.active:hover,.btn-box2:active.focus,.btn-box2:active:focus,.btn-box2:active:hover,.btn-box3:hover,.btn-box3.focus,.btn-box3:focus,.btn-box3.active,.btn-box3:active,.btn-box3.active.focus,.btn-box3.active:focus,.btn-box3.active:hover,.btn-box3:active.focus,.btn-box3:active:focus,.btn-box3:active:hover{color:#eee;border:none}.btn-box1:hover,.btn-box1.focus,.btn-box1:focus,.btn-box1.active,.btn-box1:active,.btn-box1.active.focus,.btn-box1.active:focus,.btn-box1.active:hover,.btn-box1:active.focus,.btn-box1:active:focus,.btn-box1:active:hover{background-color:#3a3638}.btn-box2:hover,.btn-box2.focus,.btn-box2:focus,.btn-box2.active,.btn-box2:active,.btn-box2.active.focus,.btn-box2.active:focus,.btn-box2.active:hover,.btn-box2:active.focus,.btn-box2:active:focus,.btn-box2:active:hover{background-color:#999d8e}.btn-box3:hover,.btn-box3.focus,.btn-box3:focus,.btn-box3.active,.btn-box3:active,.btn-box3.active.focus,.btn-box3.active:focus,.btn-box3.active:hover,.btn-box3:active.focus,.btn-box3:active:focus,.btn-box3:active:hover{background-color:#3a3638}.btn-default{background-color:#605a5d;color:#fff!important;border:none}.btn-default:hover,.btn-default.focus,.btn-default:focus,.btn-default.active,.btn-default:active,.btn-default.active.focus,.btn-default.active:focus,.btn-default.active:hover,.btn-default:active.focus,.btn-default:active:focus,.btn-default:active:hover{background-color:#999d8e!important;color:#fff;border:none}.btn-default[disabled]{background-color:#605a5d!important;border:none!important;filter: alpha(opacity=8);opacity:.8}.main-content{background:rgba(255,255,255,.7);margin-top:30px;padding-top:15px;padding-bottom:15px}.news-box{background-color:#ebebeb;padding:5px 20px 20px}.news-box h3,.news-box h3 a{color:#999d8e;text-decoration:none}.news-box h3 a:hover{color:#07123a}.row-recent{display:flex;align-items:stretch;flex-wrap:wrap;justify-content:center}#recent-properties h3{text-align:center;font-size:1.8em;color:#999d8e}#recent-properties .thumbnail,.property-content .thumbnail{border:0;padding:0;margin:0}#recent-properties img.recent-image{width:100%}#recent-properties .recent-detail{background-color:#999d8e;color:#fff;padding:20px}#recent-properties .recent-detail a{color:#fff;text-decoration:none}#recent-properties .recent-detail a:hover{color:#eee}#latest-news,#recent-properties,.portal-logos{margin-top:40px}.portal-logos img{margin-left:10px;margin-right:10px}#latest-news h2,#recent-properties h2{text-align:center;margin-bottom:20px}.btn-recent{background-color:#605a5d;color:#fff!important;border:none;font-size:1.4em}.btn-recent:hover,.btn-recent.focus,.btn-recent:focus,.btn-recent.active,.btn-recent:active,.btn-recent.active.focus,.btn-recent.active:focus,.btn-recent.active:hover,.btn-recent:active.focus,.btn-recent:active:focus,.btn-recent:active:hover{color:#fff;border:none}.btn-recent:hover,.btn-recent.focus,.btn-recent:focus,.btn-recent.active,.btn-recent:active,.btn-recent.active.focus,.btn-recent.active:focus,.btn-recent.active:hover,.btn-recent:active.focus,.btn-recent:active:focus,.btn-recent:active:hover{background-color:#3a3638}.contact-section{margin-top:40px;padding:30px 0 40px;color:#fff;background-color:#999d8e}.contact-section a{color:#fff;text-decoration:none}.contact-section a:hover{opacity:.6}.contact-section h3{margin:0 0 30px}.btn-contact-send{background-color:#999d8e;color:#fff!important;border:1px solid #fff}.btn-contact-send:hover,.btn-contact-send.focus,.btn-contact-send:focus,.btn-contact-send.active,.btn-contact-send:active,.btn-contact-send.active.focus,.btn-contact-send.active:focus,.btn-contact-send.active:hover,.btn-contact-send:active.focus,.btn-contact-send:active:focus,.btn-contact-send:active:hover{background-color:#07123a!important;color:#fff;border:1px solid #fff}.btn-contact-send[disabled]{background-color:#999d8e!important;border:1px solid #fff!important;filter: alpha(opacity=8);opacity:.8}.main-image-container{position:absolute;width:100%}.main-image-container img{width:100%}.main-image-container::after{display:block;position:relative;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(255,255,255,0)),to(#fff));background-image:linear-gradient(to bottom,rgba(255,255,255,0) 0,#fff 100%);margin-top:-130px;height:130px;width:100%;content:''}.well{background-color:#fff}p.testimonial-name{font-weight:bold;font-style:italic;color:#999d8e}.testimonial-well{background:#fff url(/images/bird-small.png.pagespeed.ce.-SHSEX7SsI.png) right 10px top 10px no-repeat;padding-right:80px}.well h3{color:#999d8e}.gdpr-consent p{font-size:1em}.negotiator h2{font-size:2em;margin:10px 0 0}.negotiator h3{font-size:1.2em;margin:10px 0 20px;text-transform:uppercase}.negotiator h3 a{color:#777}.negotiator-bio{font-size:1.2em;margin-bottom:30px}.negotiator-contact .btn{margin:20px 0 10px}.negotiator img{margin-left:auto;margin-right:auto}.btn-team{text-align:left}.add-to-shortlist .remove,.remove-from-shortlist .add{display:none}.remove .glyphicon-heart{color:red}#googlemap{width:100%;height:300px}#requestedDate,#requestedTime{-webkit-appearance:none;-moz-appearance:none;appearance:none}.form-control.styled-select::-ms-expand{-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';filter: alpha(opacity=0);opacity:0}.form-control.styled-select{background:#fff url(https://www.grantfrasertc.co.uk/images/select-bg.jpg.pagespeed.ce.yQyE-GOfQ3.jpg) top right no-repeat!important;-moz-appearance:none;-webkit-appearance:none;appearance:none}.formhoney{visibility:hidden;display:none}.spacer-top{margin-top:20px}.spacer-bottom{margin-bottom:20px}.pagination{margin:0}.pagination li a .bracket{display:none}.pagination span.hellip{cursor:not-allowed}.pagination>li a{background-color:#999d8e!important;border:none!important;color:#fff!important}.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus,.pagination>li>a:hover,.pagination>li>span:hover,.pagination>li>a:focus,.pagination>li>span:focus{border:none!important;color:#fff!important;background-color:#255e69!important}.animated-spinner{width:100px;margin:0 auto;padding:20px;color:#d14348;font-size:2em}.map-search-results#googlemap{height:600px}.thumbnails-container{background-color:#ebebeb;padding:20px;margin:20px 0}.thumbnails-buttons{margin-top:30px}.thumbnails-buttons .btn{font-size:1.2em}.property h3{margin:0 0 15px 0}.property h3 a{color:#999d8e}.property .thumbnails-price p{font-size:1.2em}.corner-flash{fill:#999d8e;width:80px;height:80px}.corner-flash text{fill:#fff}.property .corner-flash{position:absolute;z-index:1}.thumbnail .corner-flash{position:absolute;z-index:1}.property-room-numbers{text-align:right;font-weight:bold;font-size:1.2em}.property-bedrooms,.property-receptions,.property-bathrooms{display:inline-block;width:40px;height:19px;margin:0 0 0 5px}.property-bedrooms{background:url(https://www.grantfrasertc.co.uk/images/room-icons.png.pagespeed.ce.yynNkaNPeh.png) left 1px no-repeat}.property-receptions{background:url(https://www.grantfrasertc.co.uk/images/room-icons.png.pagespeed.ce.yynNkaNPeh.png) left -19px no-repeat}.property-bathrooms{background:url(https://www.grantfrasertc.co.uk/images/room-icons.png.pagespeed.ce.yynNkaNPeh.png) left -39px no-repeat}.property-content,.page-content{background:rgba(255,255,255,.7);padding:15px 30px;margin-bottom:30px}.property-content .property-room-numbers{margin-top:30px}.property-content .property-price{font-size:1.4em}.property-content .property-buttons .btn{text-align:left;font-size:1.2em;margin-bottom:20px}.property-enquiry{margin:50px 0;text-align:center}.property-enquiry h3{font-size:2em;color:#999d8e}.property-enquiry p a{font-size:1.4em;color:#333;text-decoration:none}.property-content .key-features{margin:20px 0;font-size:1.2em}.property-content .prop-description{font-size:1.2em}#google-info-window{position:relative;text-align:center;width:200px}#google-info-window.google-info-window-property{width:360px;overflow:auto}#google-info-window.google-info-window-property #google-info-window-property-image{float:left;width:205px;margin:0 10px 0 0}#google-info-window.google-info-window-property #google-info-window-property-details{text-align:left}#google-info-window .spacer{margin:10px 0}#google-info-window .corner-flash{position:absolute;top:0;left:0}.property-images .corner-flash{position:absolute;width:auto;z-index:1}#property-carousel .carousel-inner .item img{max-height:500px;width:100%;margin:0 auto}#property-carousel,#property-thumbnails,.carousel-control.right,.carousel-control.left{background-image:none}#property-thumbnails .carousel-inner a{cursor:pointer}#property-thumbnails .carousel-control{width:2%;color:#fff}#slideshow .modal-content{border:8px solid #fff}#back-to-top{background:#333;position:fixed;bottom:10px;right:15px;display:none;padding:5px 10px;border-radius:3px;border:1px solid #fff;color:#fff;font-size:1.5em;text-align:center}.vertical-align-container{display:table;height:inherit}.vertical-align-content{display:table-cell;vertical-align:middle}.iframe-embed{border:none;width:100%;height:300px}.freeprivacypolicy-com---palette-dark.freeprivacypolicy-com---nb{background-color:rgba(0,0,0,.8)!important;max-width:100%!important}@media (max-width:1262px){.nav.navbar-nav li a{padding-left:10px;padding-right:10px}}@media (max-width:1162px){.nav.navbar-nav li a,.navbar-nav .open .dropdown-menu>li>a{font-size:16px}}@media (min-width:992px) and (max-width:1065px){.nav.navbar-nav li a,.navbar-nav .open .dropdown-menu>li>a{font-size:14px}}@media (min-width:1201px){.main-content{padding-left:30px;padding-right:30px}#recent-properties img.recent-image{height:235px}.property-grid .panel .panel-body{min-height:375px}.affix{width:263px;top:68px}#googlemap{min-height:600px}#contact-map #googlemap{min-height:500px!important}}@media (min-width:992px){.search-facility{margin-top:180px}#social-networking-side{top:160px}.property-content,.page-content{margin-top:180px}}@media (min-width:992px) and (max-width:1200px){.header .header-top-bar{font-size:14px}#recent-properties img.recent-image{height:190px}.property-grid .panel .panel-body{min-height:370px}.affix{top:99px;width:293px}#googlemap{min-height:500px}}@media (min-width:768px) and (max-width:991px){.navbar-header{float:none}.navbar-toggle{display:block}.navbar-collapse{border-top:1px solid transparent;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}.navbar-collapse.collapse{display:none!important}.navbar-collapse.collapse.in{display:block!important}.navbar-nav{float:none!important;margin:7.5px -15px}.navbar-nav>li{float:none}.navbar-nav>li>a{padding-top:10px;padding-bottom:10px}}@media (max-width:991px){.header{position:relative}.header .navbar-default{background-color:#999d8e}.logo{margin-left:0}.logo img{margin-left:auto;margin-right:auto}.search-facility{margin-top:30px}.search-facility .btn{margin-bottom:10px}.draw-search-container .btn-group{margin-bottom:20px}#social-networking-side{top:20px}#contact-map{margin-bottom:30px}.box1{background-color:#999d8e}.box2{background-color:#605a5d}.box3{background-color:#ddbc2a}.property-room-numbers{text-align:left;margin-bottom:10px}.property-bedrooms,.property-receptions,.property-bathrooms{text-align:right}}@media (min-width:768px) and (max-width:991px){.header-contact-mobile{margin-top:20px;margin-bottom:20px}.header-contact-mobile a{margin-left:20px;margin-right:20px}#recent-properties img.recent-image{height:190px}.property-buttons{margin-top:20px}#googlemap{min-height:400px}}@media (max-width:767px){body{margin:0 0 80px 0}.header-contact-mobile a{display:block}#main-search{display:none}.mobile-search-button{margin:30px 0 0;font-size:1.4em}.search-facility{padding:10px 0 20px;margin-top:10px}.main-content,#latest-news,#recent-properties,.portal-logos{margin-top:0}.news-box,.recent-box{margin-bottom:30px}.btn-reg{margin-top:20px}.negotiator{text-align:center}.draw-search-container .list-button{margin-bottom:20px}.property img.thumbnail-photo{width:100%;margin-bottom:20px}.thumbnails-buttons .btn{margin-top:20px;width:100%}.property-content,.page-content{padding:15px 0}}@media (min-width:480px) and (max-width:768px){footer{font-size:10px;text-align:center}}@media (max-width:480px){.btn-box1,.btn-box2,.btn-box3{font-size:1.4em}.map-search-results#googlemap{height:300px}.property-grid .panel .panel-body{min-height:auto}#googlemap{min-height:300px}footer{font-size:10px;text-align:center}}.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}.animated.bounceIn,.animated.bounceOut,.animated.flipOutX,.animated.flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s}@-webkit-keyframes bounce { 0%, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translateZ(0); transform: translateZ(0); } 40%, 43% { -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 40%, 43%, 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); } 70% { -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } }@keyframes bounce { 0%, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translateZ(0); transform: translateZ(0); } 40%, 43% { -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 40%, 43%, 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); } 70% { -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } }.bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash { 0%, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } }@keyframes flash { 0%, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } }.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } }@keyframes pulse { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } }.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand { 0% { -webkit-transform: scaleX(1); transform: scaleX(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(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } }@keyframes rubberBand { 0% { -webkit-transform: scaleX(1); transform: scaleX(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(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } }.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake { 0%, to { -webkit-transform: translateZ(0); transform: translateZ(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); } }@keyframes shake { 0%, to { -webkit-transform: translateZ(0); transform: translateZ(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); } }.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } }@keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } }.headShake{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-name:headShake;animation-name:headShake}@-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } to { -webkit-transform: rotate(0deg); transform: rotate(0deg); } }@keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } to { -webkit-transform: rotate(0deg); transform: rotate(0deg); } }.swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } }@keyframes tada { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } }.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg); transform: translate3d(-25%, 0, 0) rotate(-5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate(3deg); transform: translate3d(20%, 0, 0) rotate(3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg); transform: translate3d(-15%, 0, 0) rotate(-3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate(2deg); transform: translate3d(10%, 0, 0) rotate(2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg); transform: translate3d(-5%, 0, 0) rotate(-1deg); } to { -webkit-transform: none; transform: none; } }@keyframes wobble { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg); transform: translate3d(-25%, 0, 0) rotate(-5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate(3deg); transform: translate3d(20%, 0, 0) rotate(3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg); transform: translate3d(-15%, 0, 0) rotate(-3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate(2deg); transform: translate3d(10%, 0, 0) rotate(2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg); transform: translate3d(-5%, 0, 0) rotate(-1deg); } to { -webkit-transform: none; transform: none; } }.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello { 0%, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } }@keyframes jello { 0%, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } }.jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.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(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } }@keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.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(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } }.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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); } to { -webkit-transform: none; transform: none; } }@keyframes bounceInDown { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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); } to { -webkit-transform: none; transform: none; } }.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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); } to { -webkit-transform: none; transform: none; } }@keyframes bounceInLeft { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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); } to { -webkit-transform: none; transform: none; } }.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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); } to { -webkit-transform: none; transform: none; } }@keyframes bounceInRight { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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); } to { -webkit-transform: none; transform: none; } }.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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); } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }@keyframes bounceInUp { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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); } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } }@keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } }.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } }@keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } }.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } }@keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } }.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } }@keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } }.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } }@keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } }.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn { 0% { opacity: 0; } to { opacity: 1; } }@keyframes fadeIn { 0% { opacity: 0; } to { opacity: 1; } }.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } }.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut { 0% { opacity: 1; } to { opacity: 0; } }@keyframes fadeOut { 0% { opacity: 1; } to { opacity: 0; } }.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }@keyframes fadeOutDown { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } }@keyframes fadeOutDownBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } }.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } }@keyframes fadeOutLeft { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } }.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } }@keyframes fadeOutLeftBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } }.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } }@keyframes fadeOutRight { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } }.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } }@keyframes fadeOutRightBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } }.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }@keyframes fadeOutUp { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } }@keyframes fadeOutUpBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } }.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(-1turn); transform: perspective(400px) rotateY(-1turn); } 0%, 40% { -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg); transform: perspective(400px) translateZ(150px) rotateY(-190deg); } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg); transform: perspective(400px) translateZ(150px) rotateY(-170deg); } 50%, 80% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.95); } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } }@keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(-1turn); transform: perspective(400px) rotateY(-1turn); } 0%, 40% { -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg); transform: perspective(400px) translateZ(150px) rotateY(-190deg); } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg); transform: perspective(400px) translateZ(150px) rotateY(-170deg); } 50%, 80% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.95); } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } }.animated.flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 0%, 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 40% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); } 60% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateX(-5deg); transform: perspective(400px) rotateX(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } }@keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 0%, 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 40% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); } 60% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateX(-5deg); transform: perspective(400px) rotateX(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } }.flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 0%, 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 40% { -webkit-transform: perspective(400px) rotateY(-20deg); transform: perspective(400px) rotateY(-20deg); } 60% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateY(-5deg); transform: perspective(400px) rotateY(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } }@keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 0%, 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 40% { -webkit-transform: perspective(400px) rotateY(-20deg); transform: perspective(400px) rotateY(-20deg); } 60% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateY(-5deg); transform: perspective(400px) rotateY(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } }.flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } }@keyframes flipOutX { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } }.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateY(-15deg); transform: perspective(400px) rotateY(-15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } }@keyframes flipOutY { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateY(-15deg); transform: perspective(400px) rotateY(-15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } }.flipOutY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn { 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); } 60%, 80% { opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); } to { -webkit-transform: none; transform: none; opacity: 1; } }@keyframes lightSpeedIn { 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); } 60%, 80% { opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); } to { -webkit-transform: none; transform: none; opacity: 1; } }.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut { 0% { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } }@keyframes lightSpeedOut { 0% { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } }.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 0%, to { -webkit-transform-origin: center; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } }@keyframes rotateIn { 0% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 0%, to { -webkit-transform-origin: center; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } }.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } 0%, to { -webkit-transform-origin: left bottom; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } }@keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } 0%, to { -webkit-transform-origin: left bottom; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } }.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } 0%, to { -webkit-transform-origin: right bottom; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } }@keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } 0%, to { -webkit-transform-origin: right bottom; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } }.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } 0%, to { -webkit-transform-origin: left bottom; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } }@keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } 0%, to { -webkit-transform-origin: left bottom; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } }.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 0%, to { -webkit-transform-origin: right bottom; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } }@keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 0%, to { -webkit-transform-origin: right bottom; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } }.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } 0%, to { -webkit-transform-origin: center; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } }@keyframes rotateOut { 0% { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } 0%, to { -webkit-transform-origin: center; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } }.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 0%, to { -webkit-transform-origin: left bottom; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } }@keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 0%, to { -webkit-transform-origin: left bottom; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } }.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 0%, to { -webkit-transform-origin: right bottom; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } }@keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 0%, to { -webkit-transform-origin: right bottom; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } }.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 0%, to { -webkit-transform-origin: left bottom; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } }@keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 0%, to { -webkit-transform-origin: left bottom; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } }.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 0%, to { -webkit-transform-origin: right bottom; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } }@keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 0%, to { -webkit-transform-origin: right bottom; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } }.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; } 0%, 20%, 60% { -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; } 40%, 80% { -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; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } }@keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; } 0%, 20%, 60% { -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; } 40%, 80% { -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; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } }.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg); transform: translate3d(-100%, 0, 0) rotate(-120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } }@keyframes rollIn { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg); transform: translate3d(-100%, 0, 0) rotate(-120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } }.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate(120deg); transform: translate3d(100%, 0, 0) rotate(120deg); } }@keyframes rollOut { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate(120deg); transform: translate3d(100%, 0, 0) rotate(120deg); } }.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } }@keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } }.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }@keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }@keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }@keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }@keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut { 0% { opacity: 1; } 50% { -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50%, to { opacity: 0; } }@keyframes zoomOut { 0% { opacity: 1; } 50% { -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50%, to { opacity: 0; } }.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }@keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } }@keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } }.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } }@keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } }.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }@keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp}@-webkit-keyframes slideInDown { 0% { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }@keyframes slideInDown { 0% { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft { 0% { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }@keyframes slideInLeft { 0% { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight { 0% { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }@keyframes slideInRight { 0% { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp { 0% { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }@keyframes slideInUp { 0% { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } }.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }@keyframes slideOutDown { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } }@keyframes slideOutLeft { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } }.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } }@keyframes slideOutRight { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } }.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }@keyframes slideOutUp { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}