Universeson (Talk | contribs) (Blanked the page) |
Universeson (Talk | contribs) |
||
Line 1: | Line 1: | ||
+ | <html> | ||
+ | |||
+ | <link rel="stylesheet" | ||
+ | href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css"> | ||
+ | <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> | ||
+ | <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> | ||
+ | |||
+ | |||
+ | <style> | ||
+ | |||
+ | /*Overrule Wiki Settings*/ | ||
+ | |||
+ | #HQ_page p{ | ||
+ | font-family: "Roboto", sans-serif; | ||
+ | font-size: 18px; | ||
+ | line-height: 1.9; | ||
+ | font-weight: 300; | ||
+ | color: #6a7277; | ||
+ | } | ||
+ | |||
+ | a:visited{ | ||
+ | color:#57cecd; | ||
+ | } | ||
+ | |||
+ | #bodyContent a[href ^="mailto:"], .link-mailto { | ||
+ | padding-right: 0px; | ||
+ | } | ||
+ | |||
+ | #bodyContent a[href ^="https://"], .link-https { | ||
+ | padding-right: 0px; | ||
+ | } | ||
+ | |||
+ | #sideMenu, #top_title {display:none;} | ||
+ | |||
+ | #bodyContent h1, #bodyContent h2, #bodyContent h3, | ||
+ | #bodyContent h4, #bodyContent h5 { | ||
+ | margin-bottom: 0px; | ||
+ | } | ||
+ | |||
+ | #mw-content-text p { | ||
+ | margin-bottom:0px; | ||
+ | } | ||
+ | |||
+ | |||
+ | #globalWrapper { | ||
+ | padding: 0px; | ||
+ | font-size: 100%; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | margin: 0; | ||
+ | } | ||
+ | #content{ | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | padding: 0px; | ||
+ | margin-right: auto; | ||
+ | margin-left: auto; | ||
+ | } | ||
+ | #mw-content-text, #bodyContent, #HQ_page, .mw_content_ltr, .mw-body{ | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | |||
+ | <style> | ||
+ | @font-face { | ||
+ | font-family: 'themify' !important; | ||
+ | src: url('https://static.igem.org/mediawiki/2017/c/ca/Nu_themify.eot'); | ||
+ | src: url('https://static.igem.org/mediawiki/2017/3/30/Nu_themify.woff') format('woff'), | ||
+ | url('https://static.igem.org/mediawiki/2017/0/01/Nu_themify.svg')format('svg'), | ||
+ | url('https://static.igem.org/mediawiki/2017/c/ca/Nu_themify.eot?#iefix'') format('embedded-opentype'), | ||
+ | url('https://static.igem.org/mediawiki/2017/c/c6/Nu_themify.ttf') format('truetype'); | ||
+ | font-weight: normal; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | |||
+ | [class^="ti-"], [class*=" ti-"] { | ||
+ | font-family: 'themify'; | ||
+ | speak: none; | ||
+ | font-style: normal; | ||
+ | font-weight: normal; | ||
+ | font-variant: normal; | ||
+ | text-transform: none; | ||
+ | line-height: 1; | ||
+ | |||
+ | /* Better Font Rendering =========== */ | ||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: grayscale; | ||
+ | } | ||
+ | |||
+ | .ti-wand:before { | ||
+ | content: "\e600"; | ||
+ | } | ||
+ | .ti-volume:before { | ||
+ | content: "\e601"; | ||
+ | } | ||
+ | .ti-user:before { | ||
+ | content: "\e602"; | ||
+ | } | ||
+ | .ti-unlock:before { | ||
+ | content: "\e603"; | ||
+ | } | ||
+ | .ti-unlink:before { | ||
+ | content: "\e604"; | ||
+ | } | ||
+ | .ti-trash:before { | ||
+ | content: "\e605"; | ||
+ | } | ||
+ | .ti-thought:before { | ||
+ | content: "\e606"; | ||
+ | } | ||
+ | .ti-target:before { | ||
+ | content: "\e607"; | ||
+ | } | ||
+ | .ti-tag:before { | ||
+ | content: "\e608"; | ||
+ | } | ||
+ | .ti-tablet:before { | ||
+ | content: "\e609"; | ||
+ | } | ||
+ | .ti-star:before { | ||
+ | content: "\e60a"; | ||
+ | } | ||
+ | .ti-spray:before { | ||
+ | content: "\e60b"; | ||
+ | } | ||
+ | .ti-signal:before { | ||
+ | content: "\e60c"; | ||
+ | } | ||
+ | .ti-shopping-cart:before { | ||
+ | content: "\e60d"; | ||
+ | } | ||
+ | .ti-shopping-cart-full:before { | ||
+ | content: "\e60e"; | ||
+ | } | ||
+ | .ti-settings:before { | ||
+ | content: "\e60f"; | ||
+ | } | ||
+ | .ti-search:before { | ||
+ | content: "\e610"; | ||
+ | } | ||
+ | .ti-zoom-in:before { | ||
+ | content: "\e611"; | ||
+ | } | ||
+ | .ti-zoom-out:before { | ||
+ | content: "\e612"; | ||
+ | } | ||
+ | .ti-cut:before { | ||
+ | content: "\e613"; | ||
+ | } | ||
+ | .ti-ruler:before { | ||
+ | content: "\e614"; | ||
+ | } | ||
+ | .ti-ruler-pencil:before { | ||
+ | content: "\e615"; | ||
+ | } | ||
+ | .ti-ruler-alt:before { | ||
+ | content: "\e616"; | ||
+ | } | ||
+ | .ti-bookmark:before { | ||
+ | content: "\e617"; | ||
+ | } | ||
+ | .ti-bookmark-alt:before { | ||
+ | content: "\e618"; | ||
+ | } | ||
+ | .ti-reload:before { | ||
+ | content: "\e619"; | ||
+ | } | ||
+ | .ti-plus:before { | ||
+ | content: "\e61a"; | ||
+ | } | ||
+ | .ti-pin:before { | ||
+ | content: "\e61b"; | ||
+ | } | ||
+ | .ti-pencil:before { | ||
+ | content: "\e61c"; | ||
+ | } | ||
+ | .ti-pencil-alt:before { | ||
+ | content: "\e61d"; | ||
+ | } | ||
+ | .ti-paint-roller:before { | ||
+ | content: "\e61e"; | ||
+ | } | ||
+ | .ti-paint-bucket:before { | ||
+ | content: "\e61f"; | ||
+ | } | ||
+ | .ti-na:before { | ||
+ | content: "\e620"; | ||
+ | } | ||
+ | .ti-mobile:before { | ||
+ | content: "\e621"; | ||
+ | } | ||
+ | .ti-minus:before { | ||
+ | content: "\e622"; | ||
+ | } | ||
+ | .ti-medall:before { | ||
+ | content: "\e623"; | ||
+ | } | ||
+ | .ti-medall-alt:before { | ||
+ | content: "\e624"; | ||
+ | } | ||
+ | .ti-marker:before { | ||
+ | content: "\e625"; | ||
+ | } | ||
+ | .ti-marker-alt:before { | ||
+ | content: "\e626"; | ||
+ | } | ||
+ | .ti-arrow-up:before { | ||
+ | content: "\e627"; | ||
+ | } | ||
+ | .ti-arrow-right:before { | ||
+ | content: "\e628"; | ||
+ | } | ||
+ | .ti-arrow-left:before { | ||
+ | content: "\e629"; | ||
+ | } | ||
+ | .ti-arrow-down:before { | ||
+ | content: "\e62a"; | ||
+ | } | ||
+ | .ti-lock:before { | ||
+ | content: "\e62b"; | ||
+ | } | ||
+ | .ti-location-arrow:before { | ||
+ | content: "\e62c"; | ||
+ | } | ||
+ | .ti-link:before { | ||
+ | content: "\e62d"; | ||
+ | } | ||
+ | .ti-layout:before { | ||
+ | content: "\e62e"; | ||
+ | } | ||
+ | .ti-layers:before { | ||
+ | content: "\e62f"; | ||
+ | } | ||
+ | .ti-layers-alt:before { | ||
+ | content: "\e630"; | ||
+ | } | ||
+ | .ti-key:before { | ||
+ | content: "\e631"; | ||
+ | } | ||
+ | .ti-import:before { | ||
+ | content: "\e632"; | ||
+ | } | ||
+ | .ti-image:before { | ||
+ | content: "\e633"; | ||
+ | } | ||
+ | .ti-heart:before { | ||
+ | content: "\e634"; | ||
+ | } | ||
+ | .ti-heart-broken:before { | ||
+ | content: "\e635"; | ||
+ | } | ||
+ | .ti-hand-stop:before { | ||
+ | content: "\e636"; | ||
+ | } | ||
+ | .ti-hand-open:before { | ||
+ | content: "\e637"; | ||
+ | } | ||
+ | .ti-hand-drag:before { | ||
+ | content: "\e638"; | ||
+ | } | ||
+ | .ti-folder:before { | ||
+ | content: "\e639"; | ||
+ | } | ||
+ | .ti-flag:before { | ||
+ | content: "\e63a"; | ||
+ | } | ||
+ | .ti-flag-alt:before { | ||
+ | content: "\e63b"; | ||
+ | } | ||
+ | .ti-flag-alt-2:before { | ||
+ | content: "\e63c"; | ||
+ | } | ||
+ | .ti-eye:before { | ||
+ | content: "\e63d"; | ||
+ | } | ||
+ | .ti-export:before { | ||
+ | content: "\e63e"; | ||
+ | } | ||
+ | .ti-exchange-vertical:before { | ||
+ | content: "\e63f"; | ||
+ | } | ||
+ | .ti-desktop:before { | ||
+ | content: "\e640"; | ||
+ | } | ||
+ | .ti-cup:before { | ||
+ | content: "\e641"; | ||
+ | } | ||
+ | .ti-crown:before { | ||
+ | content: "\e642"; | ||
+ | } | ||
+ | .ti-comments:before { | ||
+ | content: "\e643"; | ||
+ | } | ||
+ | .ti-comment:before { | ||
+ | content: "\e644"; | ||
+ | } | ||
+ | .ti-comment-alt:before { | ||
+ | content: "\e645"; | ||
+ | } | ||
+ | .ti-close:before { | ||
+ | content: "\e646"; | ||
+ | } | ||
+ | .ti-clip:before { | ||
+ | content: "\e647"; | ||
+ | } | ||
+ | .ti-angle-up:before { | ||
+ | content: "\e648"; | ||
+ | } | ||
+ | .ti-angle-right:before { | ||
+ | content: "\e649"; | ||
+ | } | ||
+ | .ti-angle-left:before { | ||
+ | content: "\e64a"; | ||
+ | } | ||
+ | .ti-angle-down:before { | ||
+ | content: "\e64b"; | ||
+ | } | ||
+ | .ti-check:before { | ||
+ | content: "\e64c"; | ||
+ | } | ||
+ | .ti-check-box:before { | ||
+ | content: "\e64d"; | ||
+ | } | ||
+ | .ti-camera:before { | ||
+ | content: "\e64e"; | ||
+ | } | ||
+ | .ti-announcement:before { | ||
+ | content: "\e64f"; | ||
+ | } | ||
+ | .ti-brush:before { | ||
+ | content: "\e650"; | ||
+ | } | ||
+ | .ti-briefcase:before { | ||
+ | content: "\e651"; | ||
+ | } | ||
+ | .ti-bolt:before { | ||
+ | content: "\e652"; | ||
+ | } | ||
+ | .ti-bolt-alt:before { | ||
+ | content: "\e653"; | ||
+ | } | ||
+ | .ti-blackboard:before { | ||
+ | content: "\e654"; | ||
+ | } | ||
+ | .ti-bag:before { | ||
+ | content: "\e655"; | ||
+ | } | ||
+ | .ti-move:before { | ||
+ | content: "\e656"; | ||
+ | } | ||
+ | .ti-arrows-vertical:before { | ||
+ | content: "\e657"; | ||
+ | } | ||
+ | .ti-arrows-horizontal:before { | ||
+ | content: "\e658"; | ||
+ | } | ||
+ | .ti-fullscreen:before { | ||
+ | content: "\e659"; | ||
+ | } | ||
+ | .ti-arrow-top-right:before { | ||
+ | content: "\e65a"; | ||
+ | } | ||
+ | .ti-arrow-top-left:before { | ||
+ | content: "\e65b"; | ||
+ | } | ||
+ | .ti-arrow-circle-up:before { | ||
+ | content: "\e65c"; | ||
+ | } | ||
+ | .ti-arrow-circle-right:before { | ||
+ | content: "\e65d"; | ||
+ | } | ||
+ | .ti-arrow-circle-left:before { | ||
+ | content: "\e65e"; | ||
+ | } | ||
+ | .ti-arrow-circle-down:before { | ||
+ | content: "\e65f"; | ||
+ | } | ||
+ | .ti-angle-double-up:before { | ||
+ | content: "\e660"; | ||
+ | } | ||
+ | .ti-angle-double-right:before { | ||
+ | content: "\e661"; | ||
+ | } | ||
+ | .ti-angle-double-left:before { | ||
+ | content: "\e662"; | ||
+ | } | ||
+ | .ti-angle-double-down:before { | ||
+ | content: "\e663"; | ||
+ | } | ||
+ | .ti-zip:before { | ||
+ | content: "\e664"; | ||
+ | } | ||
+ | .ti-world:before { | ||
+ | content: "\e665"; | ||
+ | } | ||
+ | .ti-wheelchair:before { | ||
+ | content: "\e666"; | ||
+ | } | ||
+ | .ti-view-list:before { | ||
+ | content: "\e667"; | ||
+ | } | ||
+ | .ti-view-list-alt:before { | ||
+ | content: "\e668"; | ||
+ | } | ||
+ | .ti-view-grid:before { | ||
+ | content: "\e669"; | ||
+ | } | ||
+ | .ti-uppercase:before { | ||
+ | content: "\e66a"; | ||
+ | } | ||
+ | .ti-upload:before { | ||
+ | content: "\e66b"; | ||
+ | } | ||
+ | .ti-underline:before { | ||
+ | content: "\e66c"; | ||
+ | } | ||
+ | .ti-truck:before { | ||
+ | content: "\e66d"; | ||
+ | } | ||
+ | .ti-timer:before { | ||
+ | content: "\e66e"; | ||
+ | } | ||
+ | .ti-ticket:before { | ||
+ | content: "\e66f"; | ||
+ | } | ||
+ | .ti-thumb-up:before { | ||
+ | content: "\e670"; | ||
+ | } | ||
+ | .ti-thumb-down:before { | ||
+ | content: "\e671"; | ||
+ | } | ||
+ | .ti-text:before { | ||
+ | content: "\e672"; | ||
+ | } | ||
+ | .ti-stats-up:before { | ||
+ | content: "\e673"; | ||
+ | } | ||
+ | .ti-stats-down:before { | ||
+ | content: "\e674"; | ||
+ | } | ||
+ | .ti-split-v:before { | ||
+ | content: "\e675"; | ||
+ | } | ||
+ | .ti-split-h:before { | ||
+ | content: "\e676"; | ||
+ | } | ||
+ | .ti-smallcap:before { | ||
+ | content: "\e677"; | ||
+ | } | ||
+ | .ti-shine:before { | ||
+ | content: "\e678"; | ||
+ | } | ||
+ | .ti-shift-right:before { | ||
+ | content: "\e679"; | ||
+ | } | ||
+ | .ti-shift-left:before { | ||
+ | content: "\e67a"; | ||
+ | } | ||
+ | .ti-shield:before { | ||
+ | content: "\e67b"; | ||
+ | } | ||
+ | .ti-notepad:before { | ||
+ | content: "\e67c"; | ||
+ | } | ||
+ | .ti-server:before { | ||
+ | content: "\e67d"; | ||
+ | } | ||
+ | .ti-quote-right:before { | ||
+ | content: "\e67e"; | ||
+ | } | ||
+ | .ti-quote-left:before { | ||
+ | content: "\e67f"; | ||
+ | } | ||
+ | .ti-pulse:before { | ||
+ | content: "\e680"; | ||
+ | } | ||
+ | .ti-printer:before { | ||
+ | content: "\e681"; | ||
+ | } | ||
+ | .ti-power-off:before { | ||
+ | content: "\e682"; | ||
+ | } | ||
+ | .ti-plug:before { | ||
+ | content: "\e683"; | ||
+ | } | ||
+ | .ti-pie-chart:before { | ||
+ | content: "\e684"; | ||
+ | } | ||
+ | .ti-paragraph:before { | ||
+ | content: "\e685"; | ||
+ | } | ||
+ | .ti-panel:before { | ||
+ | content: "\e686"; | ||
+ | } | ||
+ | .ti-package:before { | ||
+ | content: "\e687"; | ||
+ | } | ||
+ | .ti-music:before { | ||
+ | content: "\e688"; | ||
+ | } | ||
+ | .ti-music-alt:before { | ||
+ | content: "\e689"; | ||
+ | } | ||
+ | .ti-mouse:before { | ||
+ | content: "\e68a"; | ||
+ | } | ||
+ | .ti-mouse-alt:before { | ||
+ | content: "\e68b"; | ||
+ | } | ||
+ | .ti-money:before { | ||
+ | content: "\e68c"; | ||
+ | } | ||
+ | .ti-microphone:before { | ||
+ | content: "\e68d"; | ||
+ | } | ||
+ | .ti-menu:before { | ||
+ | content: "\e68e"; | ||
+ | } | ||
+ | .ti-menu-alt:before { | ||
+ | content: "\e68f"; | ||
+ | } | ||
+ | .ti-map:before { | ||
+ | content: "\e690"; | ||
+ | } | ||
+ | .ti-map-alt:before { | ||
+ | content: "\e691"; | ||
+ | } | ||
+ | .ti-loop:before { | ||
+ | content: "\e692"; | ||
+ | } | ||
+ | .ti-location-pin:before { | ||
+ | content: "\e693"; | ||
+ | } | ||
+ | .ti-list:before { | ||
+ | content: "\e694"; | ||
+ | } | ||
+ | .ti-light-bulb:before { | ||
+ | content: "\e695"; | ||
+ | } | ||
+ | .ti-Italic:before { | ||
+ | content: "\e696"; | ||
+ | } | ||
+ | .ti-info:before { | ||
+ | content: "\e697"; | ||
+ | } | ||
+ | .ti-infinite:before { | ||
+ | content: "\e698"; | ||
+ | } | ||
+ | .ti-id-badge:before { | ||
+ | content: "\e699"; | ||
+ | } | ||
+ | .ti-hummer:before { | ||
+ | content: "\e69a"; | ||
+ | } | ||
+ | .ti-home:before { | ||
+ | content: "\e69b"; | ||
+ | } | ||
+ | .ti-help:before { | ||
+ | content: "\e69c"; | ||
+ | } | ||
+ | .ti-headphone:before { | ||
+ | content: "\e69d"; | ||
+ | } | ||
+ | .ti-harddrives:before { | ||
+ | content: "\e69e"; | ||
+ | } | ||
+ | .ti-harddrive:before { | ||
+ | content: "\e69f"; | ||
+ | } | ||
+ | .ti-gift:before { | ||
+ | content: "\e6a0"; | ||
+ | } | ||
+ | .ti-game:before { | ||
+ | content: "\e6a1"; | ||
+ | } | ||
+ | .ti-filter:before { | ||
+ | content: "\e6a2"; | ||
+ | } | ||
+ | .ti-files:before { | ||
+ | content: "\e6a3"; | ||
+ | } | ||
+ | .ti-file:before { | ||
+ | content: "\e6a4"; | ||
+ | } | ||
+ | .ti-eraser:before { | ||
+ | content: "\e6a5"; | ||
+ | } | ||
+ | .ti-envelope:before { | ||
+ | content: "\e6a6"; | ||
+ | } | ||
+ | .ti-download:before { | ||
+ | content: "\e6a7"; | ||
+ | } | ||
+ | .ti-direction:before { | ||
+ | content: "\e6a8"; | ||
+ | } | ||
+ | .ti-direction-alt:before { | ||
+ | content: "\e6a9"; | ||
+ | } | ||
+ | .ti-dashboard:before { | ||
+ | content: "\e6aa"; | ||
+ | } | ||
+ | .ti-control-stop:before { | ||
+ | content: "\e6ab"; | ||
+ | } | ||
+ | .ti-control-shuffle:before { | ||
+ | content: "\e6ac"; | ||
+ | } | ||
+ | .ti-control-play:before { | ||
+ | content: "\e6ad"; | ||
+ | } | ||
+ | .ti-control-pause:before { | ||
+ | content: "\e6ae"; | ||
+ | } | ||
+ | .ti-control-forward:before { | ||
+ | content: "\e6af"; | ||
+ | } | ||
+ | .ti-control-backward:before { | ||
+ | content: "\e6b0"; | ||
+ | } | ||
+ | .ti-cloud:before { | ||
+ | content: "\e6b1"; | ||
+ | } | ||
+ | .ti-cloud-up:before { | ||
+ | content: "\e6b2"; | ||
+ | } | ||
+ | .ti-cloud-down:before { | ||
+ | content: "\e6b3"; | ||
+ | } | ||
+ | .ti-clipboard:before { | ||
+ | content: "\e6b4"; | ||
+ | } | ||
+ | .ti-car:before { | ||
+ | content: "\e6b5"; | ||
+ | } | ||
+ | .ti-calendar:before { | ||
+ | content: "\e6b6"; | ||
+ | } | ||
+ | .ti-book:before { | ||
+ | content: "\e6b7"; | ||
+ | } | ||
+ | .ti-bell:before { | ||
+ | content: "\e6b8"; | ||
+ | } | ||
+ | .ti-basketball:before { | ||
+ | content: "\e6b9"; | ||
+ | } | ||
+ | .ti-bar-chart:before { | ||
+ | content: "\e6ba"; | ||
+ | } | ||
+ | .ti-bar-chart-alt:before { | ||
+ | content: "\e6bb"; | ||
+ | } | ||
+ | .ti-back-right:before { | ||
+ | content: "\e6bc"; | ||
+ | } | ||
+ | .ti-back-left:before { | ||
+ | content: "\e6bd"; | ||
+ | } | ||
+ | .ti-arrows-corner:before { | ||
+ | content: "\e6be"; | ||
+ | } | ||
+ | .ti-archive:before { | ||
+ | content: "\e6bf"; | ||
+ | } | ||
+ | .ti-anchor:before { | ||
+ | content: "\e6c0"; | ||
+ | } | ||
+ | .ti-align-right:before { | ||
+ | content: "\e6c1"; | ||
+ | } | ||
+ | .ti-align-left:before { | ||
+ | content: "\e6c2"; | ||
+ | } | ||
+ | .ti-align-justify:before { | ||
+ | content: "\e6c3"; | ||
+ | } | ||
+ | .ti-align-center:before { | ||
+ | content: "\e6c4"; | ||
+ | } | ||
+ | .ti-alert:before { | ||
+ | content: "\e6c5"; | ||
+ | } | ||
+ | .ti-alarm-clock:before { | ||
+ | content: "\e6c6"; | ||
+ | } | ||
+ | .ti-agenda:before { | ||
+ | content: "\e6c7"; | ||
+ | } | ||
+ | .ti-write:before { | ||
+ | content: "\e6c8"; | ||
+ | } | ||
+ | .ti-window:before { | ||
+ | content: "\e6c9"; | ||
+ | } | ||
+ | .ti-widgetized:before { | ||
+ | content: "\e6ca"; | ||
+ | } | ||
+ | .ti-widget:before { | ||
+ | content: "\e6cb"; | ||
+ | } | ||
+ | .ti-widget-alt:before { | ||
+ | content: "\e6cc"; | ||
+ | } | ||
+ | .ti-wallet:before { | ||
+ | content: "\e6cd"; | ||
+ | } | ||
+ | .ti-video-clapper:before { | ||
+ | content: "\e6ce"; | ||
+ | } | ||
+ | .ti-video-camera:before { | ||
+ | content: "\e6cf"; | ||
+ | } | ||
+ | .ti-vector:before { | ||
+ | content: "\e6d0"; | ||
+ | } | ||
+ | .ti-themify-logo:before { | ||
+ | content: "\e6d1"; | ||
+ | } | ||
+ | .ti-themify-favicon:before { | ||
+ | content: "\e6d2"; | ||
+ | } | ||
+ | .ti-themify-favicon-alt:before { | ||
+ | content: "\e6d3"; | ||
+ | } | ||
+ | .ti-support:before { | ||
+ | content: "\e6d4"; | ||
+ | } | ||
+ | .ti-stamp:before { | ||
+ | content: "\e6d5"; | ||
+ | } | ||
+ | .ti-split-v-alt:before { | ||
+ | content: "\e6d6"; | ||
+ | } | ||
+ | .ti-slice:before { | ||
+ | content: "\e6d7"; | ||
+ | } | ||
+ | .ti-shortcode:before { | ||
+ | content: "\e6d8"; | ||
+ | } | ||
+ | .ti-shift-right-alt:before { | ||
+ | content: "\e6d9"; | ||
+ | } | ||
+ | .ti-shift-left-alt:before { | ||
+ | content: "\e6da"; | ||
+ | } | ||
+ | .ti-ruler-alt-2:before { | ||
+ | content: "\e6db"; | ||
+ | } | ||
+ | .ti-receipt:before { | ||
+ | content: "\e6dc"; | ||
+ | } | ||
+ | .ti-pin2:before { | ||
+ | content: "\e6dd"; | ||
+ | } | ||
+ | .ti-pin-alt:before { | ||
+ | content: "\e6de"; | ||
+ | } | ||
+ | .ti-pencil-alt2:before { | ||
+ | content: "\e6df"; | ||
+ | } | ||
+ | .ti-palette:before { | ||
+ | content: "\e6e0"; | ||
+ | } | ||
+ | .ti-more:before { | ||
+ | content: "\e6e1"; | ||
+ | } | ||
+ | .ti-more-alt:before { | ||
+ | content: "\e6e2"; | ||
+ | } | ||
+ | .ti-microphone-alt:before { | ||
+ | content: "\e6e3"; | ||
+ | } | ||
+ | .ti-magnet:before { | ||
+ | content: "\e6e4"; | ||
+ | } | ||
+ | .ti-line-double:before { | ||
+ | content: "\e6e5"; | ||
+ | } | ||
+ | .ti-line-dotted:before { | ||
+ | content: "\e6e6"; | ||
+ | } | ||
+ | .ti-line-dashed:before { | ||
+ | content: "\e6e7"; | ||
+ | } | ||
+ | .ti-layout-width-full:before { | ||
+ | content: "\e6e8"; | ||
+ | } | ||
+ | .ti-layout-width-default:before { | ||
+ | content: "\e6e9"; | ||
+ | } | ||
+ | .ti-layout-width-default-alt:before { | ||
+ | content: "\e6ea"; | ||
+ | } | ||
+ | .ti-layout-tab:before { | ||
+ | content: "\e6eb"; | ||
+ | } | ||
+ | .ti-layout-tab-window:before { | ||
+ | content: "\e6ec"; | ||
+ | } | ||
+ | .ti-layout-tab-v:before { | ||
+ | content: "\e6ed"; | ||
+ | } | ||
+ | .ti-layout-tab-min:before { | ||
+ | content: "\e6ee"; | ||
+ | } | ||
+ | .ti-layout-slider:before { | ||
+ | content: "\e6ef"; | ||
+ | } | ||
+ | .ti-layout-slider-alt:before { | ||
+ | content: "\e6f0"; | ||
+ | } | ||
+ | .ti-layout-sidebar-right:before { | ||
+ | content: "\e6f1"; | ||
+ | } | ||
+ | .ti-layout-sidebar-none:before { | ||
+ | content: "\e6f2"; | ||
+ | } | ||
+ | .ti-layout-sidebar-left:before { | ||
+ | content: "\e6f3"; | ||
+ | } | ||
+ | .ti-layout-placeholder:before { | ||
+ | content: "\e6f4"; | ||
+ | } | ||
+ | .ti-layout-menu:before { | ||
+ | content: "\e6f5"; | ||
+ | } | ||
+ | .ti-layout-menu-v:before { | ||
+ | content: "\e6f6"; | ||
+ | } | ||
+ | .ti-layout-menu-separated:before { | ||
+ | content: "\e6f7"; | ||
+ | } | ||
+ | .ti-layout-menu-full:before { | ||
+ | content: "\e6f8"; | ||
+ | } | ||
+ | .ti-layout-media-right-alt:before { | ||
+ | content: "\e6f9"; | ||
+ | } | ||
+ | .ti-layout-media-right:before { | ||
+ | content: "\e6fa"; | ||
+ | } | ||
+ | .ti-layout-media-overlay:before { | ||
+ | content: "\e6fb"; | ||
+ | } | ||
+ | .ti-layout-media-overlay-alt:before { | ||
+ | content: "\e6fc"; | ||
+ | } | ||
+ | .ti-layout-media-overlay-alt-2:before { | ||
+ | content: "\e6fd"; | ||
+ | } | ||
+ | .ti-layout-media-left-alt:before { | ||
+ | content: "\e6fe"; | ||
+ | } | ||
+ | .ti-layout-media-left:before { | ||
+ | content: "\e6ff"; | ||
+ | } | ||
+ | .ti-layout-media-center-alt:before { | ||
+ | content: "\e700"; | ||
+ | } | ||
+ | .ti-layout-media-center:before { | ||
+ | content: "\e701"; | ||
+ | } | ||
+ | .ti-layout-list-thumb:before { | ||
+ | content: "\e702"; | ||
+ | } | ||
+ | .ti-layout-list-thumb-alt:before { | ||
+ | content: "\e703"; | ||
+ | } | ||
+ | .ti-layout-list-post:before { | ||
+ | content: "\e704"; | ||
+ | } | ||
+ | .ti-layout-list-large-image:before { | ||
+ | content: "\e705"; | ||
+ | } | ||
+ | .ti-layout-line-solid:before { | ||
+ | content: "\e706"; | ||
+ | } | ||
+ | .ti-layout-grid4:before { | ||
+ | content: "\e707"; | ||
+ | } | ||
+ | .ti-layout-grid3:before { | ||
+ | content: "\e708"; | ||
+ | } | ||
+ | .ti-layout-grid2:before { | ||
+ | content: "\e709"; | ||
+ | } | ||
+ | .ti-layout-grid2-thumb:before { | ||
+ | content: "\e70a"; | ||
+ | } | ||
+ | .ti-layout-cta-right:before { | ||
+ | content: "\e70b"; | ||
+ | } | ||
+ | .ti-layout-cta-left:before { | ||
+ | content: "\e70c"; | ||
+ | } | ||
+ | .ti-layout-cta-center:before { | ||
+ | content: "\e70d"; | ||
+ | } | ||
+ | .ti-layout-cta-btn-right:before { | ||
+ | content: "\e70e"; | ||
+ | } | ||
+ | .ti-layout-cta-btn-left:before { | ||
+ | content: "\e70f"; | ||
+ | } | ||
+ | .ti-layout-column4:before { | ||
+ | content: "\e710"; | ||
+ | } | ||
+ | .ti-layout-column3:before { | ||
+ | content: "\e711"; | ||
+ | } | ||
+ | .ti-layout-column2:before { | ||
+ | content: "\e712"; | ||
+ | } | ||
+ | .ti-layout-accordion-separated:before { | ||
+ | content: "\e713"; | ||
+ | } | ||
+ | .ti-layout-accordion-merged:before { | ||
+ | content: "\e714"; | ||
+ | } | ||
+ | .ti-layout-accordion-list:before { | ||
+ | content: "\e715"; | ||
+ | } | ||
+ | .ti-ink-pen:before { | ||
+ | content: "\e716"; | ||
+ | } | ||
+ | .ti-info-alt:before { | ||
+ | content: "\e717"; | ||
+ | } | ||
+ | .ti-help-alt:before { | ||
+ | content: "\e718"; | ||
+ | } | ||
+ | .ti-headphone-alt:before { | ||
+ | content: "\e719"; | ||
+ | } | ||
+ | .ti-hand-point-up:before { | ||
+ | content: "\e71a"; | ||
+ | } | ||
+ | .ti-hand-point-right:before { | ||
+ | content: "\e71b"; | ||
+ | } | ||
+ | .ti-hand-point-left:before { | ||
+ | content: "\e71c"; | ||
+ | } | ||
+ | .ti-hand-point-down:before { | ||
+ | content: "\e71d"; | ||
+ | } | ||
+ | .ti-gallery:before { | ||
+ | content: "\e71e"; | ||
+ | } | ||
+ | .ti-face-smile:before { | ||
+ | content: "\e71f"; | ||
+ | } | ||
+ | .ti-face-sad:before { | ||
+ | content: "\e720"; | ||
+ | } | ||
+ | .ti-credit-card:before { | ||
+ | content: "\e721"; | ||
+ | } | ||
+ | .ti-control-skip-forward:before { | ||
+ | content: "\e722"; | ||
+ | } | ||
+ | .ti-control-skip-backward:before { | ||
+ | content: "\e723"; | ||
+ | } | ||
+ | .ti-control-record:before { | ||
+ | content: "\e724"; | ||
+ | } | ||
+ | .ti-control-eject:before { | ||
+ | content: "\e725"; | ||
+ | } | ||
+ | .ti-comments-smiley:before { | ||
+ | content: "\e726"; | ||
+ | } | ||
+ | .ti-brush-alt:before { | ||
+ | content: "\e727"; | ||
+ | } | ||
+ | .ti-youtube:before { | ||
+ | content: "\e728"; | ||
+ | } | ||
+ | .ti-vimeo:before { | ||
+ | content: "\e729"; | ||
+ | } | ||
+ | .ti-twitter:before { | ||
+ | content: "\e72a"; | ||
+ | } | ||
+ | .ti-time:before { | ||
+ | content: "\e72b"; | ||
+ | } | ||
+ | .ti-tumblr:before { | ||
+ | content: "\e72c"; | ||
+ | } | ||
+ | .ti-skype:before { | ||
+ | content: "\e72d"; | ||
+ | } | ||
+ | .ti-share:before { | ||
+ | content: "\e72e"; | ||
+ | } | ||
+ | .ti-share-alt:before { | ||
+ | content: "\e72f"; | ||
+ | } | ||
+ | .ti-rocket:before { | ||
+ | content: "\e730"; | ||
+ | } | ||
+ | .ti-pinterest:before { | ||
+ | content: "\e731"; | ||
+ | } | ||
+ | .ti-new-window:before { | ||
+ | content: "\e732"; | ||
+ | } | ||
+ | .ti-microsoft:before { | ||
+ | content: "\e733"; | ||
+ | } | ||
+ | .ti-list-ol:before { | ||
+ | content: "\e734"; | ||
+ | } | ||
+ | .ti-linkedin:before { | ||
+ | content: "\e735"; | ||
+ | } | ||
+ | .ti-layout-sidebar-2:before { | ||
+ | content: "\e736"; | ||
+ | } | ||
+ | .ti-layout-grid4-alt:before { | ||
+ | content: "\e737"; | ||
+ | } | ||
+ | .ti-layout-grid3-alt:before { | ||
+ | content: "\e738"; | ||
+ | } | ||
+ | .ti-layout-grid2-alt:before { | ||
+ | content: "\e739"; | ||
+ | } | ||
+ | .ti-layout-column4-alt:before { | ||
+ | content: "\e73a"; | ||
+ | } | ||
+ | .ti-layout-column3-alt:before { | ||
+ | content: "\e73b"; | ||
+ | } | ||
+ | .ti-layout-column2-alt:before { | ||
+ | content: "\e73c"; | ||
+ | } | ||
+ | .ti-instagram:before { | ||
+ | content: "\e73d"; | ||
+ | } | ||
+ | .ti-google:before { | ||
+ | content: "\e73e"; | ||
+ | } | ||
+ | .ti-github:before { | ||
+ | content: "\e73f"; | ||
+ | } | ||
+ | .ti-flickr:before { | ||
+ | content: "\e740"; | ||
+ | } | ||
+ | .ti-facebook:before { | ||
+ | content: "\e741"; | ||
+ | } | ||
+ | .ti-dropbox:before { | ||
+ | content: "\e742"; | ||
+ | } | ||
+ | .ti-dribbble:before { | ||
+ | content: "\e743"; | ||
+ | } | ||
+ | .ti-apple:before { | ||
+ | content: "\e744"; | ||
+ | } | ||
+ | .ti-android:before { | ||
+ | content: "\e745"; | ||
+ | } | ||
+ | .ti-save:before { | ||
+ | content: "\e746"; | ||
+ | } | ||
+ | .ti-save-alt:before { | ||
+ | content: "\e747"; | ||
+ | } | ||
+ | .ti-yahoo:before { | ||
+ | content: "\e748"; | ||
+ | } | ||
+ | .ti-wordpress:before { | ||
+ | content: "\e749"; | ||
+ | } | ||
+ | .ti-vimeo-alt:before { | ||
+ | content: "\e74a"; | ||
+ | } | ||
+ | .ti-twitter-alt:before { | ||
+ | content: "\e74b"; | ||
+ | } | ||
+ | .ti-tumblr-alt:before { | ||
+ | content: "\e74c"; | ||
+ | } | ||
+ | .ti-trello:before { | ||
+ | content: "\e74d"; | ||
+ | } | ||
+ | .ti-stack-overflow:before { | ||
+ | content: "\e74e"; | ||
+ | } | ||
+ | .ti-soundcloud:before { | ||
+ | content: "\e74f"; | ||
+ | } | ||
+ | .ti-sharethis:before { | ||
+ | content: "\e750"; | ||
+ | } | ||
+ | .ti-sharethis-alt:before { | ||
+ | content: "\e751"; | ||
+ | } | ||
+ | .ti-reddit:before { | ||
+ | content: "\e752"; | ||
+ | } | ||
+ | .ti-pinterest-alt:before { | ||
+ | content: "\e753"; | ||
+ | } | ||
+ | .ti-microsoft-alt:before { | ||
+ | content: "\e754"; | ||
+ | } | ||
+ | .ti-linux:before { | ||
+ | content: "\e755"; | ||
+ | } | ||
+ | .ti-jsfiddle:before { | ||
+ | content: "\e756"; | ||
+ | } | ||
+ | .ti-joomla:before { | ||
+ | content: "\e757"; | ||
+ | } | ||
+ | .ti-html5:before { | ||
+ | content: "\e758"; | ||
+ | } | ||
+ | .ti-flickr-alt:before { | ||
+ | content: "\e759"; | ||
+ | } | ||
+ | .ti-email:before { | ||
+ | content: "\e75a"; | ||
+ | } | ||
+ | .ti-drupal:before { | ||
+ | content: "\e75b"; | ||
+ | } | ||
+ | .ti-dropbox-alt:before { | ||
+ | content: "\e75c"; | ||
+ | } | ||
+ | .ti-css3:before { | ||
+ | content: "\e75d"; | ||
+ | } | ||
+ | .ti-rss:before { | ||
+ | content: "\e75e"; | ||
+ | } | ||
+ | .ti-rss-alt:before { | ||
+ | content: "\e75f"; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | <style> | ||
+ | /*** ESSENTIAL STYLES ***/ | ||
+ | .sf-menu, .sf-menu * { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | list-style: none; | ||
+ | } | ||
+ | .sf-menu li { | ||
+ | position: relative; | ||
+ | } | ||
+ | .sf-menu ul { | ||
+ | position: absolute; | ||
+ | display: none; | ||
+ | top: 100%; | ||
+ | right: 0; | ||
+ | |||
+ | z-index: 99; | ||
+ | } | ||
+ | .sf-menu > li { | ||
+ | float: left; | ||
+ | } | ||
+ | .sf-menu li:hover > ul, | ||
+ | .sf-menu li.sfHover > ul { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .sf-menu a { | ||
+ | display: block; | ||
+ | position: relative; | ||
+ | } | ||
+ | .sf-menu ul ul { | ||
+ | top: 0; | ||
+ | left: 100%; | ||
+ | } | ||
+ | |||
+ | /*** DEMO SKIN ***/ | ||
+ | .sf-menu { | ||
+ | float: left; | ||
+ | margin-bottom: 1em; | ||
+ | } | ||
+ | .sf-menu ul { | ||
+ | box-shadow: 2px 2px 6px rgba(0,0,0,.2); | ||
+ | min-width: 12em; /* allow long menu items to determine submenu width */ | ||
+ | *width: 12em; /* no auto sub width for IE7, see white-space comment below */ | ||
+ | } | ||
+ | .sf-menu a { | ||
+ | border-left: 1px solid #fff; | ||
+ | border-top: 1px solid #dFeEFF; /* fallback colour must use full shorthand */ | ||
+ | border-top: 1px solid rgba(255,255,255,.5); | ||
+ | padding: .75em 1em; | ||
+ | text-decoration: none; | ||
+ | zoom: 1; /* IE7 */ | ||
+ | } | ||
+ | .sf-menu a { | ||
+ | color: #13a; | ||
+ | } | ||
+ | .sf-menu li { | ||
+ | background: #BDD2FF; | ||
+ | white-space: nowrap; /* no need for Supersubs plugin */ | ||
+ | *white-space: normal; /* ...unless you support IE7 (let it wrap) */ | ||
+ | -webkit-transition: background .2s; | ||
+ | transition: background .2s; | ||
+ | } | ||
+ | .sf-menu ul li { | ||
+ | background: #AABDE6; | ||
+ | } | ||
+ | .sf-menu ul ul li { | ||
+ | background: #9AAEDB; | ||
+ | } | ||
+ | .sf-menu li:hover, | ||
+ | .sf-menu li.sfHover { | ||
+ | background: #CFDEFF; | ||
+ | /* only transition out, not in */ | ||
+ | -webkit-transition: none; | ||
+ | transition: none; | ||
+ | } | ||
+ | |||
+ | /*** arrows (for all except IE7) **/ | ||
+ | .sf-arrows .sf-with-ul { | ||
+ | padding-right: 2.5em; | ||
+ | *padding-right: 1em; /* no CSS arrows for IE7 (lack pseudo-elements) */ | ||
+ | } | ||
+ | /* styling for both css and generated arrows */ | ||
+ | .sf-arrows .sf-with-ul:after { | ||
+ | content: ''; | ||
+ | position: absolute; | ||
+ | top: 50%; | ||
+ | right: 1em; | ||
+ | margin-top: -3px; | ||
+ | height: 0; | ||
+ | width: 0; | ||
+ | /* order of following 3 rules important for fallbacks to work */ | ||
+ | border: 5px solid transparent; | ||
+ | border-top-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */ | ||
+ | border-top-color: rgba(255,255,255,.5); | ||
+ | } | ||
+ | .sf-arrows > li > .sf-with-ul:focus:after, | ||
+ | .sf-arrows > li:hover > .sf-with-ul:after, | ||
+ | .sf-arrows > .sfHover > .sf-with-ul:after { | ||
+ | border-top-color: white; /* IE8 fallback colour */ | ||
+ | } | ||
+ | /* styling for right-facing arrows */ | ||
+ | .sf-arrows ul .sf-with-ul:after { | ||
+ | margin-top: -5px; | ||
+ | /*margin-right: -3px;*/ | ||
+ | border-color: transparent; | ||
+ | border-left-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */ | ||
+ | border-left-color: rgba(255,255,255,.5); | ||
+ | } | ||
+ | .sf-arrows ul li > .sf-with-ul:focus:after, | ||
+ | .sf-arrows ul li:hover > .sf-with-ul:after, | ||
+ | .sf-arrows ul .sfHover > .sf-with-ul:after { | ||
+ | border-left-color: white; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <style> | ||
+ | /* | ||
+ | ////////////////////////////////////////////////////// | ||
+ | |||
+ | FREE HTML5 TEMPLATE | ||
+ | DESIGNED & DEVELOPED by FREEHTML5.CO | ||
+ | |||
+ | ////////////////////////////////////////////////////// | ||
+ | */ | ||
+ | |||
+ | @font-face { | ||
+ | font-family: 'themify' !important; | ||
+ | src: url('https://static.igem.org/mediawiki/2017/3/30/Nu_themify.woff') format('woff'), | ||
+ | url('https://static.igem.org/mediawiki/2017/c/c6/Nu_themify.ttf') format('truetype'); | ||
+ | font-weight: normal; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | |||
+ | @font-face { | ||
+ | font-family: 'Roboto'; | ||
+ | font-style: normal; | ||
+ | font-weight: 300; | ||
+ | src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v18/zN7GBFwfMP4uA6AR0HCoLQ.ttf) format('truetype'); | ||
+ | } | ||
+ | |||
+ | html.fh5co-overflow, body.fh5co-overflow { | ||
+ | overflow-x: auto; | ||
+ | } | ||
+ | html.fh5co-overflow #fh5co-header-section, html.fh5co-overflow #fh5co-main, html.fh5co-overflow #fh5co-hero, html.fh5co-overflow #fh5co-mobile-menu, html.fh5co-overflow #fh5co-footer, body.fh5co-overflow #fh5co-header-section, body.fh5co-overflow #fh5co-main, body.fh5co-overflow #fh5co-hero, body.fh5co-overflow #fh5co-mobile-menu, body.fh5co-overflow #fh5co-footer { | ||
+ | -webkit-transition: all 0.3s ease; | ||
+ | -moz-transition: all 0.3s ease; | ||
+ | -ms-transition: all 0.3s ease; | ||
+ | -o-transition: all 0.3s ease; | ||
+ | transition: all 0.3s ease; | ||
+ | } | ||
+ | |||
+ | body, p { | ||
+ | font-family: "Roboto", sans-serif; | ||
+ | font-size: 18px; | ||
+ | line-height: 1.9; | ||
+ | font-weight: 400; | ||
+ | color: #8b969c; | ||
+ | } | ||
+ | |||
+ | #HQ_page ul, #HQ_page li { | ||
+ | font-family: "Roboto", sans-serif; | ||
+ | font-size: 18px; | ||
+ | line-height: 1.9; | ||
+ | font-weight: 400; | ||
+ | color: #8b969c; | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 768px) { | ||
+ | body { | ||
+ | font-size: 16px; | ||
+ | line-height: 1.5; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | ::-webkit-selection { | ||
+ | color: #ffffff; | ||
+ | background: #57cecd; | ||
+ | } | ||
+ | |||
+ | ::-moz-selection { | ||
+ | color: #ffffff; | ||
+ | background: #57cecd; | ||
+ | } | ||
+ | |||
+ | ::selection { | ||
+ | color: #ffffff; | ||
+ | background: #57cecd; | ||
+ | } | ||
+ | |||
+ | a { | ||
+ | -webkit-transition: all 0.2s ease; | ||
+ | -moz-transition: all 0.2s ease; | ||
+ | -ms-transition: all 0.2s ease; | ||
+ | -o-transition: all 0.2s ease; | ||
+ | transition: all 0.2s ease; | ||
+ | color: #57cecd; | ||
+ | border-bottom: 1px solid #ccc; | ||
+ | } | ||
+ | a:hover, a:focus, a:active { | ||
+ | color: #31a8a7; | ||
+ | } | ||
+ | a:hover, a:focus, a:active { | ||
+ | outline: none; | ||
+ | color: #2e2e2e; | ||
+ | text-decoration: none; | ||
+ | border-bottom: 1px solid #57cecd; | ||
+ | } | ||
+ | |||
+ | input { | ||
+ | -webkit-transition: all 0.5s ease; | ||
+ | -moz-transition: all 0.5s ease; | ||
+ | -ms-transition: all 0.5s ease; | ||
+ | -o-transition: all 0.5s ease; | ||
+ | transition: all 0.5s ease; | ||
+ | } | ||
+ | |||
+ | /* Heading */ | ||
+ | h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { | ||
+ | margin: 0 0 20px 0; | ||
+ | padding: 0; | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | h1, .h1 { | ||
+ | font-size: 30px; | ||
+ | line-height: 42px; | ||
+ | } | ||
+ | |||
+ | h2, .h2 { | ||
+ | font-size: 26px; | ||
+ | line-height: 38px; | ||
+ | } | ||
+ | |||
+ | h3, .h3 { | ||
+ | font-size: 20px; | ||
+ | line-height: 32px; | ||
+ | } | ||
+ | |||
+ | h4, .h4 { | ||
+ | font-size: 16px; | ||
+ | line-height: 28px; | ||
+ | } | ||
+ | |||
+ | h5, .h5 { | ||
+ | font-size: 14px; | ||
+ | line-height: 24px; | ||
+ | } | ||
+ | |||
+ | h6, .h6 { | ||
+ | font-size: 12px; | ||
+ | line-height: 24px; | ||
+ | } | ||
+ | |||
+ | ul, ol { | ||
+ | padding-left: 15px; | ||
+ | line-height: 26px; | ||
+ | } | ||
+ | ul ul, ul ol, ol ul, ol ol { | ||
+ | padding-left: 25px; | ||
+ | } | ||
+ | |||
+ | ul, ol, p { | ||
+ | margin: 0 0 20px 0; | ||
+ | } | ||
+ | |||
+ | .fh5co-serif { | ||
+ | font-family: "Crimson Text", serif; | ||
+ | } | ||
+ | |||
+ | .fh5co-sans-serif { | ||
+ | font-family: "Roboto", arial, sans-serif; | ||
+ | } | ||
+ | |||
+ | input[type="text"], | ||
+ | input[type="password"], | ||
+ | input[type="email"], | ||
+ | input[type="search"], | ||
+ | textarea { | ||
+ | -webkit-appearance: none; | ||
+ | -moz-appearance: none; | ||
+ | appearance: none; | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 480px) { | ||
+ | .col-xxs-12 { | ||
+ | display: block; | ||
+ | clear: both; | ||
+ | width: 100%; | ||
+ | float: left; | ||
+ | } | ||
+ | } | ||
+ | /* Header */ | ||
+ | #fh5co-header-section { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | width: 100%; | ||
+ | -webkit-transition: all 0.5s ease; | ||
+ | -moz-transition: all 0.5s ease; | ||
+ | -ms-transition: all 0.5s ease; | ||
+ | -o-transition: all 0.5s ease; | ||
+ | transition: all 0.5s ease; | ||
+ | z-index: 103; | ||
+ | } | ||
+ | |||
+ | #fh5co-menu-logo { | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | #fh5co-quick-contacts { | ||
+ | float: right; | ||
+ | width: 100%; | ||
+ | text-align: right; | ||
+ | margin-top: 2em; | ||
+ | } | ||
+ | #fh5co-quick-contacts .sep { | ||
+ | padding: 0 .5em; | ||
+ | color: rgba(255, 255, 255, 0.5); | ||
+ | } | ||
+ | #fh5co-quick-contacts a { | ||
+ | font-size: 14px; | ||
+ | padding: 20px 10px; | ||
+ | color: white; | ||
+ | } | ||
+ | #fh5co-quick-contacts a > i { | ||
+ | margin-right: 10px; | ||
+ | margin-top: 5px; | ||
+ | color: white; | ||
+ | } | ||
+ | #fh5co-quick-contacts a:hover { | ||
+ | color: white; | ||
+ | } | ||
+ | |||
+ | #fh5co-logo { | ||
+ | font-size: 20px; | ||
+ | margin: .9em 0 0 0; | ||
+ | padding: 0; | ||
+ | font-weight: 700; | ||
+ | } | ||
+ | #fh5co-logo a { | ||
+ | border-bottom: none !important; | ||
+ | color: #ffffff; | ||
+ | letter-spacing: 3px; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | #fh5co-logo a:hover { | ||
+ | opacity: .7; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-logo { | ||
+ | text-align: center; | ||
+ | margin: 0px 0 0 0; | ||
+ | float: none !important; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /* Superfish Override Menu */ | ||
+ | .sf-menu { | ||
+ | margin: 0 !important; | ||
+ | } | ||
+ | |||
+ | .sf-menu { | ||
+ | float: right; | ||
+ | } | ||
+ | |||
+ | .sf-menu ul { | ||
+ | box-shadow: none; | ||
+ | border: transparent; | ||
+ | min-width: 8em; | ||
+ | *width: 8em; | ||
+ | } | ||
+ | |||
+ | .sf-menu a { | ||
+ | color: rgba(0, 0, 0, 0.8); | ||
+ | color: #2d9c9b; | ||
+ | padding: .75em 1em; | ||
+ | font-weight: normal; | ||
+ | border-left: none; | ||
+ | border-top: none; | ||
+ | border-top: none; | ||
+ | text-decoration: none; | ||
+ | zoom: 1; | ||
+ | font-size: 18px; | ||
+ | border-bottom: none !important; | ||
+ | } | ||
+ | |||
+ | .sf-menu li, | ||
+ | .sf-menu ul li, | ||
+ | .sf-menu ul ul li, | ||
+ | .sf-menu li:hover, | ||
+ | .sf-menu li.sfHover { | ||
+ | background: transparent; | ||
+ | } | ||
+ | |||
+ | .sf-menu ul li a, | ||
+ | .sf-menu ul ul li a { | ||
+ | text-transform: none; | ||
+ | padding: .75em 1em; | ||
+ | letter-spacing: 1px; | ||
+ | } | ||
+ | |||
+ | .sf-menu li:hover a, | ||
+ | .sf-menu li.sfHover a, | ||
+ | .sf-menu ul li:hover a, | ||
+ | .sf-menu ul li.sfHover a, | ||
+ | .sf-menu li.active a { | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | .sf-menu ul li:hover, | ||
+ | .sf-menu ul li.sfHover { | ||
+ | background: transparent; | ||
+ | } | ||
+ | |||
+ | .sf-menu ul li { | ||
+ | background: transparent; | ||
+ | } | ||
+ | |||
+ | .sf-arrows .sf-with-ul { | ||
+ | padding-right: 2.5em; | ||
+ | *padding-right: 1em; | ||
+ | } | ||
+ | |||
+ | .sf-arrows > li > .sf-with-ul:focus:after, | ||
+ | .sf-arrows > li:hover > .sf-with-ul:after, | ||
+ | .sf-arrows > .sfHover > .sf-with-ul:after { | ||
+ | border-top-color: #ccc; | ||
+ | } | ||
+ | |||
+ | .sf-arrows ul .sf-with-ul:after { | ||
+ | margin-top: -5px; | ||
+ | margin-right: -3px; | ||
+ | border-color: transparent; | ||
+ | border-left-color: #ccc; | ||
+ | } | ||
+ | |||
+ | .sf-arrows ul li > .sf-with-ul:focus:after, | ||
+ | .sf-arrows ul li:hover > .sf-with-ul:after, | ||
+ | .sf-arrows ul .sfHover > .sf-with-ul:after { | ||
+ | border-left-color: #ccc; | ||
+ | } | ||
+ | |||
+ | #fh5co-menu-wrap { | ||
+ | float: right; | ||
+ | position: relative; | ||
+ | margin-right: -20px; | ||
+ | } | ||
+ | #fh5co-menu-wrap .sf-menu a { | ||
+ | padding: 2em 1em; | ||
+ | } | ||
+ | |||
+ | #fh5co-primary-menu > li > ul li.active > a { | ||
+ | color: #57cecd !important; | ||
+ | } | ||
+ | #fh5co-primary-menu > li > .sf-with-ul { | ||
+ | position: relative; | ||
+ | } | ||
+ | #fh5co-primary-menu > li > .sf-with-ul::after { | ||
+ | border: none !important; | ||
+ | font-family: 'themify'; | ||
+ | speak: none; | ||
+ | font-style: normal; | ||
+ | font-weight: normal; | ||
+ | font-variant: normal; | ||
+ | text-transform: none; | ||
+ | line-height: 1; | ||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: grayscale; | ||
+ | position: absolute; | ||
+ | padding-top: 20px; | ||
+ | left: 50%; | ||
+ | margin-left: -7px; | ||
+ | font-size: 14px; | ||
+ | width: 100%; | ||
+ | content: "\e64b"; | ||
+ | color: #2b9493; | ||
+ | -webkit-transition: all 0.2s ease; | ||
+ | -moz-transition: all 0.2s ease; | ||
+ | -ms-transition: all 0.2s ease; | ||
+ | -o-transition: all 0.2s ease; | ||
+ | transition: all 0.2s ease; | ||
+ | } | ||
+ | #fh5co-primary-menu > li > .sf-with-ul:hover::after { | ||
+ | padding-top: 25px; | ||
+ | } | ||
+ | #fh5co-primary-menu > li > ul li > .sf-with-ul:after { | ||
+ | border: none !important; | ||
+ | font-family: 'themify'; | ||
+ | speak: none; | ||
+ | font-style: normal; | ||
+ | font-weight: normal; | ||
+ | font-variant: normal; | ||
+ | text-transform: none; | ||
+ | line-height: 1; | ||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: grayscale; | ||
+ | position: absolute; | ||
+ | float: right; | ||
+ | margin-right: 10px; | ||
+ | top: 13px; | ||
+ | font-size: 12px; | ||
+ | content: "\e649"; | ||
+ | color: rgba(255, 255, 255, 0.5); | ||
+ | } | ||
+ | |||
+ | #fh5co-primary-menu .fh5co-sub-menu { | ||
+ | padding: 7px 0 3px; | ||
+ | background: rgba(0, 0, 0, 0.8); | ||
+ | -webkit-border-radius: 5px; | ||
+ | -moz-border-radius: 5px; | ||
+ | -ms-border-radius: 5px; | ||
+ | border-radius: 5px; | ||
+ | } | ||
+ | |||
+ | #fh5co-primary-menu .fh5co-sub-menu:before { | ||
+ | position: absolute; | ||
+ | top: -9px; | ||
+ | right: 20px; | ||
+ | width: 0; | ||
+ | height: 0; | ||
+ | content: ''; | ||
+ | } | ||
+ | |||
+ | #fh5co-primary-menu .fh5co-sub-menu:after { | ||
+ | position: absolute; | ||
+ | top: -8px; | ||
+ | right: 21px; | ||
+ | width: 0; | ||
+ | height: 0; | ||
+ | border-right: 8px solid transparent; | ||
+ | border-bottom: 8px solid #57cecd; | ||
+ | border-bottom: 8px solid rgba(0, 0, 0, 0.8); | ||
+ | border-left: 8px solid transparent; | ||
+ | content: ''; | ||
+ | } | ||
+ | |||
+ | #fh5co-primary-menu .fh5co-sub-menu .fh5co-sub-menu:before { | ||
+ | top: 6px; | ||
+ | right: 100%; | ||
+ | } | ||
+ | |||
+ | #fh5co-primary-menu .fh5co-sub-menu .fh5co-sub-menu:after { | ||
+ | top: 7px; | ||
+ | right: 100%; | ||
+ | border: none !important; | ||
+ | } | ||
+ | |||
+ | .site-header.has-image #primary-menu .sub-menu { | ||
+ | border-color: #ebebeb; | ||
+ | box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.19); | ||
+ | } | ||
+ | .site-header.has-image #primary-menu .sub-menu:before { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | #fh5co-primary-menu .fh5co-sub-menu a { | ||
+ | letter-spacing: 0; | ||
+ | padding: 0 15px; | ||
+ | font-size: 14px; | ||
+ | line-height: 26px; | ||
+ | color: #ffffff !important; | ||
+ | text-transform: none; | ||
+ | background: none; | ||
+ | } | ||
+ | #fh5co-primary-menu .fh5co-sub-menu a:hover { | ||
+ | color: #57cecd !important; | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle { | ||
+ | width: 25px; | ||
+ | height: 25px; | ||
+ | cursor: pointer; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | .fh5co-nav-toggle.active i::before, .fh5co-nav-toggle.active i::after { | ||
+ | background: #2e2e2e; | ||
+ | } | ||
+ | .fh5co-nav-toggle:hover, .fh5co-nav-toggle:focus, .fh5co-nav-toggle:active { | ||
+ | outline: none; | ||
+ | border-bottom: none !important; | ||
+ | } | ||
+ | .fh5co-nav-toggle i { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | width: 25px; | ||
+ | height: 3px; | ||
+ | color: #252525; | ||
+ | font: bold 14px/.4 Helvetica; | ||
+ | text-transform: uppercase; | ||
+ | text-indent: -55px; | ||
+ | background: #252525; | ||
+ | transition: all .2s ease-out; | ||
+ | } | ||
+ | .fh5co-nav-toggle i::before, .fh5co-nav-toggle i::after { | ||
+ | content: ''; | ||
+ | width: 25px; | ||
+ | height: 3px; | ||
+ | background: #252525; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | transition: all .2s ease-out; | ||
+ | } | ||
+ | .fh5co-nav-toggle.fh5co-nav-white > i { | ||
+ | color: #ffffff; | ||
+ | background: #ffffff; | ||
+ | } | ||
+ | .fh5co-nav-toggle.fh5co-nav-white > i::before, .fh5co-nav-toggle.fh5co-nav-white > i::after { | ||
+ | background: #ffffff; | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle i::before { | ||
+ | top: -7px; | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle i::after { | ||
+ | bottom: -7px; | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle:hover i::before { | ||
+ | top: -10px; | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle:hover i::after { | ||
+ | bottom: -10px; | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle.active i { | ||
+ | background: transparent; | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle.active i::before { | ||
+ | top: 0; | ||
+ | -webkit-transform: rotateZ(45deg); | ||
+ | -moz-transform: rotateZ(45deg); | ||
+ | -ms-transform: rotateZ(45deg); | ||
+ | -o-transform: rotateZ(45deg); | ||
+ | transform: rotateZ(45deg); | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle.active i::after { | ||
+ | bottom: 0; | ||
+ | -webkit-transform: rotateZ(-45deg); | ||
+ | -moz-transform: rotateZ(-45deg); | ||
+ | -ms-transform: rotateZ(-45deg); | ||
+ | -o-transform: rotateZ(-45deg); | ||
+ | transform: rotateZ(-45deg); | ||
+ | } | ||
+ | |||
+ | .fh5co-nav-toggle { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | z-index: 21; | ||
+ | padding: 6px 0 0 0; | ||
+ | display: block; | ||
+ | margin: 0 auto; | ||
+ | display: none; | ||
+ | background: #f86942; | ||
+ | height: 44px; | ||
+ | width: 44px; | ||
+ | border-bottom: none !important; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-nav-toggle { | ||
+ | display: block; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /* Mobile Menu */ | ||
+ | #fh5co-mobile-menu { | ||
+ | -moz-transform: translateX(-275px); | ||
+ | -webkit-transform: translateX(-275px); | ||
+ | -ms-transform: translateX(-275px); | ||
+ | transform: translateX(-275px); | ||
+ | display: block; | ||
+ | height: 100%; | ||
+ | left: 0; | ||
+ | overflow-y: auto; | ||
+ | position: fixed; | ||
+ | top: 0; | ||
+ | width: 275px; | ||
+ | z-index: 10002; | ||
+ | background: #181920; | ||
+ | padding: 0.75em 1.25em; | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul { | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul li { | ||
+ | list-style: none; | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul li.active > a { | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul a { | ||
+ | border-bottom: none !important; | ||
+ | padding: 7px 0; | ||
+ | display: block; | ||
+ | color: #ccc; | ||
+ | color: rgba(255, 255, 255, 0.5); | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul a:hover { | ||
+ | color: #ffffff; | ||
+ | color: white; | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul .fh5co-sub-ddown { | ||
+ | position: relative; | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul .fh5co-sub-ddown::after { | ||
+ | font-family: 'themify'; | ||
+ | speak: none; | ||
+ | font-style: normal; | ||
+ | font-weight: normal; | ||
+ | font-variant: normal; | ||
+ | text-transform: none; | ||
+ | line-height: 1; | ||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: grayscale; | ||
+ | position: absolute; | ||
+ | right: 0; | ||
+ | margin-top: 2px; | ||
+ | content: "\e64b"; | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul .fh5co-sub-menu { | ||
+ | display: none; | ||
+ | padding-left: 20px; | ||
+ | } | ||
+ | #fh5co-mobile-menu #fh5co-mobile-menu-ul .fh5co-sub-menu li { | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | #fh5co-logo-mobile-wrap { | ||
+ | -webkit-transition: all 0.3s ease; | ||
+ | -moz-transition: all 0.3s ease; | ||
+ | -ms-transition: all 0.3s ease; | ||
+ | -o-transition: all 0.3s ease; | ||
+ | transition: all 0.3s ease; | ||
+ | display: block; | ||
+ | height: 44px; | ||
+ | left: 0; | ||
+ | position: fixed; | ||
+ | text-align: center; | ||
+ | top: 0; | ||
+ | width: 100%; | ||
+ | z-index: 10001; | ||
+ | background: #2b303b; | ||
+ | color: #ccc; | ||
+ | -webkit-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -moz-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -ms-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -o-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | } | ||
+ | #fh5co-logo-mobile-wrap h1 { | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | font-size: 20px; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | #fh5co-logo-mobile-wrap h1 a { | ||
+ | border-bottom: none !important; | ||
+ | color: #ccc; | ||
+ | letter-spacing: 3px; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | |||
+ | #fh5co-content { | ||
+ | padding: 7em 0; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-content { | ||
+ | margin-bottom: 4em; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | #fh5co-sidebar { | ||
+ | padding: 7em 0; | ||
+ | font-size: 16px; | ||
+ | } | ||
+ | #fh5co-sidebar.left-sidebar { | ||
+ | padding-right: 50px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-sidebar.left-sidebar { | ||
+ | padding-right: 0px; | ||
+ | } | ||
+ | } | ||
+ | #fh5co-sidebar.right-sidebar { | ||
+ | padding-left: 50px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-sidebar.right-sidebar { | ||
+ | padding-left: 0px; | ||
+ | } | ||
+ | } | ||
+ | #fh5co-sidebar .sidebar-box { | ||
+ | margin-bottom: 2em; | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | } | ||
+ | #fh5co-sidebar .sidebar-heading { | ||
+ | margin-bottom: 10px; | ||
+ | font-size: 14px; | ||
+ | text-transform: uppercase; | ||
+ | letter-spacing: 4px; | ||
+ | color: #2e2e2e; | ||
+ | position: relative; | ||
+ | padding-top: 7px; | ||
+ | } | ||
+ | #fh5co-sidebar .sidebar-heading .border { | ||
+ | width: 30px; | ||
+ | height: 3px; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | background: #ebebeb; | ||
+ | } | ||
+ | #fh5co-sidebar .sidebar-links { | ||
+ | padding: 0; | ||
+ | margin: 0 0 30px 0; | ||
+ | } | ||
+ | #fh5co-sidebar .sidebar-links li { | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | #fh5co-hero { | ||
+ | background-color: #57cecd; | ||
+ | background-size: cover; | ||
+ | background-repeat: no-repeat; | ||
+ | background-position: center left; | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | height: 300px; | ||
+ | display: table; | ||
+ | position: relative; | ||
+ | z-index: 20; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | #fh5co-hero .overlay { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | right: 0; | ||
+ | bottom: 0; | ||
+ | z-index: -1; | ||
+ | background: #57cecd; | ||
+ | opacity: .5; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-hero { | ||
+ | background-position: center center; | ||
+ | } | ||
+ | } | ||
+ | #fh5co-hero .fh5co-arrow { | ||
+ | position: absolute; | ||
+ | bottom: -25px; | ||
+ | left: 50%; | ||
+ | margin-left: -30px; | ||
+ | display: table; | ||
+ | color: #ffffff; | ||
+ | font-size: 24px; | ||
+ | z-index: 99; | ||
+ | text-decoration: none; | ||
+ | width: 50px; | ||
+ | height: 50px; | ||
+ | background: #f86942; | ||
+ | border-bottom: none !important; | ||
+ | text-align: center; | ||
+ | -webkit-border-radius: 50%; | ||
+ | -moz-border-radius: 50%; | ||
+ | -ms-border-radius: 50%; | ||
+ | -o-border-radius: 50%; | ||
+ | border-radius: 50%; | ||
+ | -webkit-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -moz-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -ms-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -o-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | } | ||
+ | #fh5co-hero .fh5co-arrow i { | ||
+ | display: table-cell; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | #fh5co-hero .fh5co-arrow:active, #fh5co-hero .fh5co-arrow:focus, #fh5co-hero .fh5co-arrow:hover { | ||
+ | outline: none; | ||
+ | } | ||
+ | #fh5co-hero .fh5co-hero-wrap { | ||
+ | padding-top: 15em; | ||
+ | display: table; | ||
+ | height: 650px; | ||
+ | width: 100%; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-hero .fh5co-hero-wrap { | ||
+ | padding-top: 4em; | ||
+ | } | ||
+ | } | ||
+ | #fh5co-hero .fh5co-hero-wrap .fh5co-hero-intro { | ||
+ | vertical-align: middle; | ||
+ | text-align: center; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | #fh5co-hero .fh5co-hero-wrap .fh5co-hero-intro a { | ||
+ | color: rgba(255, 255, 255, 0.7); | ||
+ | border-bottom: 1px solid rgba(255, 255, 255, 0.3); | ||
+ | } | ||
+ | #fh5co-hero .fh5co-hero-wrap .fh5co-hero-intro a:hover { | ||
+ | color: white; | ||
+ | border-bottom: 1px solid white; | ||
+ | } | ||
+ | #fh5co-hero .fh5co-hero-wrap .fh5co-hero-intro > h1 { | ||
+ | font-size: 36px; | ||
+ | line-height: 47px; | ||
+ | color: #ffffff; | ||
+ | font-weight: 100; | ||
+ | text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.08); | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-hero .fh5co-hero-wrap .fh5co-hero-intro > h1 { | ||
+ | font-size: 30px; | ||
+ | } | ||
+ | } | ||
+ | #fh5co-hero .fh5co-hero-wrap .fh5co-hero-intro > h2 { | ||
+ | letter-spacing: 4px; | ||
+ | line-height: 1.5; | ||
+ | font-size: 16px; | ||
+ | text-transform: uppercase; | ||
+ | padding-bottom: 20px; | ||
+ | position: relative; | ||
+ | color: #ffffff; | ||
+ | text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.08); | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-hero .fh5co-hero-wrap .fh5co-hero-intro > h2 { | ||
+ | letter-spacing: 3px; | ||
+ | } | ||
+ | } | ||
+ | #fh5co-hero .fh5co-hero-wrap .btn { | ||
+ | color: #ffffff; | ||
+ | text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.08); | ||
+ | } | ||
+ | #fh5co-hero .fh5co-hero-wrap .btn:hover, #fh5co-hero .fh5co-hero-wrap .btn:active, #fh5co-hero .fh5co-hero-wrap .btn:focus { | ||
+ | background: #57cecd; | ||
+ | border-color: #57cecd; | ||
+ | } | ||
+ | |||
+ | body.inner-page #fh5co-hero .fh5co-hero-wrap { | ||
+ | padding-top: 15em; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | body.inner-page #fh5co-hero .fh5co-hero-wrap { | ||
+ | padding-top: 4em; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-hero, .fh5co-hero-wrap { | ||
+ | position: relative; | ||
+ | padding: 4em 0 3em 0; | ||
+ | height: inherit !important; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | #fh5co-main { | ||
+ | position: relative; | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 768px) { | ||
+ | body.inner-page #fh5co-main { | ||
+ | margin-top: 0px; | ||
+ | padding-top: 20px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | #fh5co-hero, | ||
+ | #fh5co-main, | ||
+ | #fh5co-logo-mobile-wrap { | ||
+ | -moz-transform: translateX(0px); | ||
+ | -webkit-transform: translateX(0px); | ||
+ | -ms-transform: translateX(0px); | ||
+ | transform: translateX(0px); | ||
+ | } | ||
+ | |||
+ | body.fh5co-mobile-menu-visible #fh5co-hero, | ||
+ | body.fh5co-mobile-menu-visible #fh5co-main, | ||
+ | body.fh5co-mobile-menu-visible #fh5co-logo-mobile-wrap { | ||
+ | -moz-transform: translateX(275px); | ||
+ | -webkit-transform: translateX(275px); | ||
+ | -ms-transform: translateX(275px); | ||
+ | transform: translateX(275px); | ||
+ | } | ||
+ | |||
+ | body.fh5co-mobile-menu-visible #fh5co-mobile-menu { | ||
+ | -moz-transform: translateX(0); | ||
+ | -webkit-transform: translateX(0); | ||
+ | -ms-transform: translateX(0); | ||
+ | transform: translateX(0); | ||
+ | } | ||
+ | |||
+ | .fh5co-product-2 { | ||
+ | display: -webkit-box; | ||
+ | display: -moz-box; | ||
+ | display: -ms-flexbox; | ||
+ | display: -webkit-flex; | ||
+ | display: flex; | ||
+ | flex-wrap: wrap; | ||
+ | -webkit-flex-wrap: wrap; | ||
+ | -moz-flex-wrap: wrap; | ||
+ | } | ||
+ | .fh5co-product-2 .img { | ||
+ | background-color: #57cecd; | ||
+ | background-size: cover; | ||
+ | background-repeat: no-repeat; | ||
+ | background-position: center center; | ||
+ | padding: 7em; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-product-2 .img { | ||
+ | height: 500px; | ||
+ | } | ||
+ | } | ||
+ | @media screen and (max-width: 480px) { | ||
+ | .fh5co-product-2 .img { | ||
+ | height: 300px; | ||
+ | } | ||
+ | } | ||
+ | .fh5co-product-2 .fh5co-half { | ||
+ | min-height: 500px; | ||
+ | padding: 3em; | ||
+ | width: 50%; | ||
+ | font-size: 20px; | ||
+ | line-height: 38px; | ||
+ | background-color: #f7f7f7; | ||
+ | } | ||
+ | .fh5co-product-2 .fh5co-half h3 { | ||
+ | font-size: 30px; | ||
+ | font-weight: 300; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-product-2 .fh5co-half { | ||
+ | min-height: inherit; | ||
+ | width: 100%; | ||
+ | padding-left: 15px; | ||
+ | padding-right: 15px; | ||
+ | font-size: 16px; | ||
+ | line-height: 28px; | ||
+ | } | ||
+ | } | ||
+ | .fh5co-product-2.fh5co-reverse .img { | ||
+ | position: absolute; | ||
+ | right: 0; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-product-2.fh5co-reverse .img { | ||
+ | position: relative; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | #fh5co-contact { | ||
+ | padding: 7em 0; | ||
+ | } | ||
+ | |||
+ | #fh5co-works .fh5co-work-item figure { | ||
+ | margin-bottom: 20px !important; | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | } | ||
+ | #fh5co-works .fh5co-work-item .heading { | ||
+ | font-size: 17px; | ||
+ | margin-bottom: 40px; | ||
+ | } | ||
+ | #fh5co-works .fh5co-work-item .fh5co-category { | ||
+ | color: #ccc; | ||
+ | font-size: 13px; | ||
+ | margin-bottom: 0; | ||
+ | } | ||
+ | |||
+ | #fh5co-call-to-action { | ||
+ | clear: both; | ||
+ | display: block; | ||
+ | padding: 3em 0; | ||
+ | border-top: 1px solid #ccc; | ||
+ | border-bottom: 1px solid #ccc; | ||
+ | letter-spacing: 7px; | ||
+ | text-transform: uppercase; | ||
+ | background: transparent; | ||
+ | font-size: 16px; | ||
+ | color: #000000; | ||
+ | } | ||
+ | #fh5co-call-to-action:hover, #fh5co-call-to-action:focus, #fh5co-call-to-action:active { | ||
+ | color: #ffffff; | ||
+ | background: #f86942; | ||
+ | border-top: 1px solid #f86942; | ||
+ | border-bottom: 1px solid #f86942; | ||
+ | } | ||
+ | |||
+ | #fh5co-footer { | ||
+ | clear: both; | ||
+ | position: relative; | ||
+ | padding: 7em 0 1em 0; | ||
+ | background: #57cecd; | ||
+ | background: #f3f8f9; | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | } | ||
+ | #fh5co-footer .fh5co-arrow { | ||
+ | position: absolute; | ||
+ | top: -34px; | ||
+ | left: 50%; | ||
+ | margin-left: -30px; | ||
+ | display: table; | ||
+ | color: #ffffff !important; | ||
+ | font-size: 24px; | ||
+ | z-index: 99; | ||
+ | text-decoration: none; | ||
+ | width: 60px; | ||
+ | height: 60px; | ||
+ | background: #f86942; | ||
+ | border-bottom: none !important; | ||
+ | text-align: center; | ||
+ | -webkit-border-radius: 50%; | ||
+ | -moz-border-radius: 50%; | ||
+ | -ms-border-radius: 50%; | ||
+ | -o-border-radius: 50%; | ||
+ | border-radius: 50%; | ||
+ | -webkit-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -moz-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -ms-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -o-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | } | ||
+ | #fh5co-footer .fh5co-arrow i { | ||
+ | display: table-cell; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | #fh5co-footer .fh5co-arrow:active, #fh5co-footer .fh5co-arrow:focus, #fh5co-footer .fh5co-arrow:hover { | ||
+ | outline: none; | ||
+ | color: #ffffff !important; | ||
+ | } | ||
+ | #fh5co-footer .fh5co-copyright { | ||
+ | margin-top: 5em; | ||
+ | } | ||
+ | #fh5co-footer .fh5co-copyright p { | ||
+ | font-size: 15px; | ||
+ | line-height: 1.9; | ||
+ | } | ||
+ | #fh5co-footer .fh5co-footer-heading { | ||
+ | font-size: 15px; | ||
+ | text-transform: uppercase; | ||
+ | letter-spacing: 3px; | ||
+ | color: #aeaeae; | ||
+ | margin-bottom: 10px; | ||
+ | } | ||
+ | #fh5co-footer .fh5co-footer-links { | ||
+ | padding: 0; | ||
+ | margin: 0 0 30px 0; | ||
+ | } | ||
+ | #fh5co-footer .fh5co-footer-links li { | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | list-style: none; | ||
+ | } | ||
+ | |||
+ | .fh5co-cards { | ||
+ | background: whitesmoke; | ||
+ | padding: 7em 0; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-cards { | ||
+ | padding: 3em 0; | ||
+ | } | ||
+ | } | ||
+ | .fh5co-cards .fh5co-card { | ||
+ | display: block; | ||
+ | background: #ffffff; | ||
+ | position: relative; | ||
+ | overflow: hidden; | ||
+ | -webkit-border-radius: 5px; | ||
+ | -moz-border-radius: 5px; | ||
+ | -ms-border-radius: 5px; | ||
+ | border-radius: 5px; | ||
+ | -webkit-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -moz-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -ms-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | -o-box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | box-shadow: 0 0.125em 0.125em 0 rgba(0, 0, 0, 0.125); | ||
+ | margin-bottom: 30px; | ||
+ | border-bottom: none; | ||
+ | bottom: 0; | ||
+ | -webkit-transition: all 0.3s ease; | ||
+ | -moz-transition: all 0.3s ease; | ||
+ | -ms-transition: all 0.3s ease; | ||
+ | -o-transition: all 0.3s ease; | ||
+ | transition: all 0.3s ease; | ||
+ | } | ||
+ | .fh5co-cards .fh5co-card img { | ||
+ | z-index: -1; | ||
+ | } | ||
+ | .fh5co-cards .fh5co-card .fh5co-card-body { | ||
+ | padding: 30px; | ||
+ | } | ||
+ | .fh5co-cards .fh5co-card .fh5co-card-body h3 { | ||
+ | font-size: 20px; | ||
+ | color: #8b969c; | ||
+ | margin-bottom: 10px; | ||
+ | } | ||
+ | .fh5co-cards .fh5co-card .fh5co-card-body p { | ||
+ | color: #8b969c; | ||
+ | } | ||
+ | .fh5co-cards .fh5co-card .fh5co-card-body p:last-child { | ||
+ | margin-bottom: 0; | ||
+ | } | ||
+ | .fh5co-cards .fh5co-card:hover { | ||
+ | text-decoration: none; | ||
+ | border-bottom: none; | ||
+ | bottom: 10px; | ||
+ | } | ||
+ | .fh5co-cards .fh5co-card:hover h3 { | ||
+ | -webkit-transition: all 0.5s ease; | ||
+ | -moz-transition: all 0.5s ease; | ||
+ | -ms-transition: all 0.5s ease; | ||
+ | -o-transition: all 0.5s ease; | ||
+ | transition: all 0.5s ease; | ||
+ | color: #57cecd; | ||
+ | } | ||
+ | |||
+ | .quote { | ||
+ | width: 80%; | ||
+ | margin: 0 auto; | ||
+ | font-size: 28px; | ||
+ | font-weight: 300; | ||
+ | line-height: 38px; | ||
+ | } | ||
+ | .quote cite { | ||
+ | margin-top: 20px; | ||
+ | display: block; | ||
+ | font-size: 20px; | ||
+ | font-style: normal; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .quote { | ||
+ | font-size: 20px; | ||
+ | width: 100%; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | /* Helper Classes */ | ||
+ | /* Spacer */ | ||
+ | .fh5co-spacer { | ||
+ | clear: both; | ||
+ | position: relative; | ||
+ | border: none; | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | .fh5co-spacer-xlg { | ||
+ | height: 150px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-spacer-xlg { | ||
+ | height: 70px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .fh5co-spacer-lg { | ||
+ | height: 100px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-spacer-lg { | ||
+ | height: 50px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .fh5co-spacer-md { | ||
+ | height: 80px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-spacer-md { | ||
+ | height: 30px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .fh5co-spacer-sm { | ||
+ | height: 50px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-spacer-sm { | ||
+ | height: 20px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .fh5co-spacer-xs { | ||
+ | height: 30px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-spacer-xs { | ||
+ | height: 20px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .fh5co-spacer-xxs { | ||
+ | height: 20px; | ||
+ | } | ||
+ | |||
+ | .fh5co-letter-spacing { | ||
+ | letter-spacing: 1px; | ||
+ | } | ||
+ | |||
+ | .fh5co-no-margin-bottom { | ||
+ | margin-bottom: 0 !important; | ||
+ | } | ||
+ | |||
+ | .fh5co-uppercase-heading-sm { | ||
+ | font-size: 14px; | ||
+ | line-height: 26px; | ||
+ | text-transform: uppercase; | ||
+ | letter-spacing: 3px; | ||
+ | color: #ccc; | ||
+ | } | ||
+ | |||
+ | .form-group { | ||
+ | margin-bottom: 30px; | ||
+ | } | ||
+ | |||
+ | .image-popup:hover { | ||
+ | opacity: .7; | ||
+ | } | ||
+ | |||
+ | .fh5co-section-heading .fh5co-lead { | ||
+ | position: relative; | ||
+ | } | ||
+ | .fh5co-section-heading .fh5co-lead > .fh5co-line { | ||
+ | height: 2px; | ||
+ | display: block; | ||
+ | width: 100px; | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | left: 50%; | ||
+ | margin-left: -50px; | ||
+ | background: rgba(0, 0, 0, 0.3); | ||
+ | } | ||
+ | .fh5co-section-heading .fh5co-sub { | ||
+ | font-size: 18px; | ||
+ | } | ||
+ | |||
+ | /* | ||
+ | ======================================== | ||
+ | |||
+ | Components | ||
+ | |||
+ | ======================================== | ||
+ | */ | ||
+ | /* Buttons */ | ||
+ | .btn { | ||
+ | border-bottom: none !important; | ||
+ | text-transform: uppercase; | ||
+ | letter-spacing: 2px; | ||
+ | margin-bottom: 20px; | ||
+ | -webkit-border-radius: 5px; | ||
+ | -moz-border-radius: 5px; | ||
+ | -ms-border-radius: 5px; | ||
+ | -o-border-radius: 5px; | ||
+ | border-radius: 5px; | ||
+ | padding-left: 20px; | ||
+ | padding-right: 20px; | ||
+ | margin-right: 10px; | ||
+ | } | ||
+ | .btn:hover, .btn:focus, .btn:active { | ||
+ | box-shadow: none; | ||
+ | outline: none !important; | ||
+ | border-color: transparent; | ||
+ | } | ||
+ | .btn.fh5co-btn-icon { | ||
+ | text-transform: none !important; | ||
+ | letter-spacing: normal !important; | ||
+ | padding-left: 15px; | ||
+ | padding-right: 15px; | ||
+ | } | ||
+ | |||
+ | .btn-outline { | ||
+ | border: 2px solid #eaeaea !important; | ||
+ | background: transparent; | ||
+ | color: #2a2e37; | ||
+ | } | ||
+ | .btn-outline:hover, .btn-outline:active, .btn-outline:focus { | ||
+ | border: 2px solid #f86942 !important; | ||
+ | background: #f86942 !important; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | .btn-primary { | ||
+ | background: #57cecd; | ||
+ | } | ||
+ | |||
+ | .btn-success { | ||
+ | background: #00e195; | ||
+ | } | ||
+ | |||
+ | .btn-danger { | ||
+ | background: #e02745; | ||
+ | } | ||
+ | |||
+ | .btn-info { | ||
+ | background: #0bbff2; | ||
+ | } | ||
+ | |||
+ | .btn-warning { | ||
+ | background: #ffd042; | ||
+ | } | ||
+ | |||
+ | .btn-primary, | ||
+ | .btn-success, | ||
+ | .btn-info, | ||
+ | .btn-warning, | ||
+ | .btn-danger { | ||
+ | border-color: transparent; | ||
+ | } | ||
+ | |||
+ | .btn-default:hover, .btn-default:active, .btn-default:focus, | ||
+ | .btn-primary:hover, | ||
+ | .btn-primary:active, | ||
+ | .btn-primary:focus, | ||
+ | .btn-success:hover, | ||
+ | .btn-success:active, | ||
+ | .btn-success:focus, | ||
+ | .btn-info:hover, | ||
+ | .btn-info:active, | ||
+ | .btn-info:focus, | ||
+ | .btn-warning:hover, | ||
+ | .btn-warning:active, | ||
+ | .btn-warning:focus, | ||
+ | .btn-danger:hover, | ||
+ | .btn-danger:active, | ||
+ | .btn-danger:focus { | ||
+ | background: #282e3c; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | .form-control { | ||
+ | box-shadow: none !important; | ||
+ | border: 2px solid #ccc; | ||
+ | } | ||
+ | .form-control:hover, .form-control:focus, .form-control:active { | ||
+ | outline: none; | ||
+ | box-shadow: none !important; | ||
+ | border: 2px solid #57cecd; | ||
+ | } | ||
+ | |||
+ | .js .to-animate, | ||
+ | .js .feature-box, | ||
+ | .js .work-box, | ||
+ | .js .footer-box, | ||
+ | .js .animate-box { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | .heading { | ||
+ | margin-bottom: 3em; | ||
+ | } | ||
+ | |||
+ | /* Features*/ | ||
+ | #fh5co-features { | ||
+ | padding: 7em 0; | ||
+ | } | ||
+ | #fh5co-features .fh5co-feature { | ||
+ | margin-bottom: 30px; | ||
+ | } | ||
+ | #fh5co-features .fh5co-feature .heading { | ||
+ | font-size: 18px; | ||
+ | margin-bottom: 20px !important; | ||
+ | font-weight: normal; | ||
+ | color: #2e2e2e; | ||
+ | } | ||
+ | #fh5co-features .fh5co-feature-icon { | ||
+ | margin: 0 auto 2em auto; | ||
+ | text-align: center; | ||
+ | border-radius: 30px; | ||
+ | -webkit-border-radius: 50%; | ||
+ | -moz-border-radius: 50%; | ||
+ | -ms-border-radius: 50%; | ||
+ | -o-border-radius: 50%; | ||
+ | border-radius: 50%; | ||
+ | } | ||
+ | #fh5co-features .fh5co-feature-icon i { | ||
+ | vertical-align: middle; | ||
+ | font-size: 50px; | ||
+ | color: #57cecd; | ||
+ | } | ||
+ | |||
+ | /* Header */ | ||
+ | .fh5co-header { | ||
+ | text-align: center; | ||
+ | } | ||
+ | .fh5co-header .fh5co-heading { | ||
+ | font-weight: bold; | ||
+ | font-size: 45px; | ||
+ | line-height: 57px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-header .fh5co-heading { | ||
+ | font-size: 30px !important; | ||
+ | line-height: 42px !important; | ||
+ | } | ||
+ | } | ||
+ | .fh5co-header .fh5co-heading-sub { | ||
+ | color: #777; | ||
+ | font-size: 18px; | ||
+ | line-height: 30px; | ||
+ | } | ||
+ | |||
+ | /* Easy Rsponsive Tabs */ | ||
+ | .fh5co-tab { | ||
+ | clear: both; | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .resp-tab-active { | ||
+ | color: #57cecd; | ||
+ | } | ||
+ | |||
+ | .resp-content-active, .resp-accordion-active { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .fh5co-tab-menu-icon { | ||
+ | font-size: 20px; | ||
+ | position: relative; | ||
+ | float: left; | ||
+ | margin-right: 10px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-tab-menu-icon { | ||
+ | margin-top: 7px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | #fh5co-feature-slider .fh5co-item-slide-text { | ||
+ | margin-top: 1em; | ||
+ | } | ||
+ | #fh5co-feature-slider .fh5co-item-slide-text > h2 { | ||
+ | position: relative; | ||
+ | padding-bottom: 20px; | ||
+ | } | ||
+ | #fh5co-feature-slider .fh5co-item-slide-text > h2 span { | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | bottom: 0; | ||
+ | width: 40px; | ||
+ | height: 3px; | ||
+ | background: #ccc; | ||
+ | background: rgba(0, 0, 0, 0.1); | ||
+ | } | ||
+ | @media screen and (max-width: 992px) { | ||
+ | #fh5co-feature-slider .fh5co-item-slide-text { | ||
+ | margin-top: 0em; | ||
+ | } | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-feature-slider .fh5co-item-slide-text { | ||
+ | margin-top: 0em; | ||
+ | } | ||
+ | } | ||
+ | @media screen and (max-width: 480px) { | ||
+ | #fh5co-feature-slider .fh5co-item-slide-text { | ||
+ | margin-top: 0em; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | #fh5co-testimonial { | ||
+ | padding: 7em 0; | ||
+ | background-size: cover; | ||
+ | } | ||
+ | #fh5co-testimonial.border-top { | ||
+ | border-top: 1px solid whitesmoke; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-testimonial { | ||
+ | padding: 7em 0; | ||
+ | } | ||
+ | } | ||
+ | #fh5co-testimonial blockquote { | ||
+ | padding-left: 0; | ||
+ | width: 70%; | ||
+ | margin: 0 auto; | ||
+ | color: #ffffff; | ||
+ | border-left: none; | ||
+ | font-size: 45px; | ||
+ | line-height: 57px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | #fh5co-testimonial blockquote { | ||
+ | width: 100%; | ||
+ | font-size: 35px; | ||
+ | line-height: 47px; | ||
+ | } | ||
+ | } | ||
+ | #fh5co-testimonial blockquote p { | ||
+ | text-align: center; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | #fh5co-testimonial .fh5co-testimonial-author { | ||
+ | font-size: 18px; | ||
+ | } | ||
+ | #fh5co-testimonial .fh5co-uppercase-heading-sm { | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | /* Accordions */ | ||
+ | .fh5co-accordion .panel-title > a { | ||
+ | border-bottom: none !important; | ||
+ | } | ||
+ | .fh5co-accordion .panel-title > a:hover { | ||
+ | border-bottom: none !important; | ||
+ | } | ||
+ | .fh5co-accordion .panel-heading { | ||
+ | background: transparent; | ||
+ | position: relative; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | .fh5co-accordion .panel-heading .accordion-toggle { | ||
+ | color: #57cecd; | ||
+ | } | ||
+ | .fh5co-accordion .panel-heading .accordion-toggle:after { | ||
+ | font-family: 'themify'; | ||
+ | speak: none; | ||
+ | font-style: normal; | ||
+ | font-weight: normal; | ||
+ | font-variant: normal; | ||
+ | text-transform: none; | ||
+ | line-height: 1; | ||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: grayscale; | ||
+ | color: #2e2e2e !important; | ||
+ | position: absolute; | ||
+ | content: "\e622"; | ||
+ | right: 15px; | ||
+ | top: 16px; | ||
+ | } | ||
+ | .fh5co-accordion .panel-heading.collapsed .accordion-toggle { | ||
+ | color: #2e2e2e !important; | ||
+ | } | ||
+ | .fh5co-accordion .panel-heading.collapsed .accordion-toggle:after { | ||
+ | font-family: 'themify'; | ||
+ | speak: none; | ||
+ | font-style: normal; | ||
+ | font-weight: normal; | ||
+ | font-variant: normal; | ||
+ | text-transform: none; | ||
+ | line-height: 1; | ||
+ | -webkit-font-smoothing: antialiased; | ||
+ | -moz-osx-font-smoothing: grayscale; | ||
+ | color: #2e2e2e !important; | ||
+ | position: absolute; | ||
+ | content: "\e61a"; | ||
+ | right: 15px; | ||
+ | top: 16px; | ||
+ | } | ||
+ | |||
+ | /* Progress Bars */ | ||
+ | .progress { | ||
+ | height: 15px; | ||
+ | -webkit-border-radius: 30px; | ||
+ | -moz-border-radius: 30px; | ||
+ | -ms-border-radius: 30px; | ||
+ | -o-border-radius: 30px; | ||
+ | border-radius: 30px; | ||
+ | } | ||
+ | |||
+ | .progress-bar { | ||
+ | box-shadow: none; | ||
+ | -webkit-border-radius: 30px; | ||
+ | -moz-border-radius: 30px; | ||
+ | -ms-border-radius: 30px; | ||
+ | -o-border-radius: 30px; | ||
+ | border-radius: 30px; | ||
+ | } | ||
+ | .progress-bar.progress-bar-default { | ||
+ | background: #57cecd; | ||
+ | } | ||
+ | .progress-bar.progress-bar-success { | ||
+ | background: #00e195; | ||
+ | } | ||
+ | .progress-bar.progress-bar-info { | ||
+ | background: #0bbff2; | ||
+ | } | ||
+ | .progress-bar.progress-bar-warning { | ||
+ | background: #ffd042; | ||
+ | } | ||
+ | .progress-bar.progress-bar-danger { | ||
+ | background: #e02745; | ||
+ | } | ||
+ | |||
+ | /* Social Icons */ | ||
+ | .fh5co-social-icons { | ||
+ | padding: 0; | ||
+ | } | ||
+ | .fh5co-social-icons li { | ||
+ | list-style: none; | ||
+ | display: inline; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | .fh5co-social-icons li a { | ||
+ | height: 40px; | ||
+ | width: 40px; | ||
+ | border: 1px solid #ebebeb; | ||
+ | display: table; | ||
+ | text-align: center; | ||
+ | color: #2e2e2e; | ||
+ | -webkit-border-radius: 50%; | ||
+ | -moz-border-radius: 50%; | ||
+ | -ms-border-radius: 50%; | ||
+ | -o-border-radius: 50%; | ||
+ | border-radius: 50%; | ||
+ | } | ||
+ | .fh5co-social-icons li a:hover { | ||
+ | background: #f86942; | ||
+ | border: 1px solid #f86942 !important; | ||
+ | color: #ffffff !important; | ||
+ | } | ||
+ | .fh5co-social-icons li i { | ||
+ | display: table-cell; | ||
+ | vertical-align: middle; | ||
+ | font-size: 18px; | ||
+ | } | ||
+ | |||
+ | /* Pricing Tables */ | ||
+ | @media screen and (max-width: 992px) { | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item { | ||
+ | margin-bottom: 20px !important; | ||
+ | } | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item { | ||
+ | margin-bottom: 20px !important; | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | } | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-body, | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-heading { | ||
+ | text-align: center; | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | padding: 1em 2em; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-heading { | ||
+ | background: #57cecd; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-heading h3 { | ||
+ | font-size: 70px; | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-heading h3 sup { | ||
+ | position: absolute; | ||
+ | top: 2px; | ||
+ | margin-left: -7px; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-heading h3 sup, .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-heading h3 span { | ||
+ | font-size: 14px; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-heading p { | ||
+ | color: rgba(255, 255, 255, 0.6); | ||
+ | font-size: 14px; | ||
+ | letter-spacing: 3px; | ||
+ | text-transform: uppercase; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item.fh5co-best-offer .fh5co-pricing-table-item-heading { | ||
+ | background: #57cecd; | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-body { | ||
+ | border: 2px solid #ccc; | ||
+ | border-top: none; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-body ul { | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item .fh5co-pricing-table-item-body ul li { | ||
+ | list-style: none; | ||
+ | padding: 0; | ||
+ | margin: 0 0 10px 0; | ||
+ | } | ||
+ | .fh5co-pricing-table-1 .fh5co-pricing-table-item.fh5co-best-offer .fh5co-pricing-table-item-body { | ||
+ | border: 2px solid #57cecd; | ||
+ | border-top: none; | ||
+ | } | ||
+ | |||
+ | /* Nav Links */ | ||
+ | .fh5co-nav-links ul { | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | } | ||
+ | .fh5co-nav-links ul li { | ||
+ | padding: 0; | ||
+ | margin: 0 0 .5em 0; | ||
+ | list-style: none; | ||
+ | } | ||
+ | .fh5co-nav-links ul li.active a { | ||
+ | color: #2e2e2e; | ||
+ | border-bottom: 2px solid #57cecd; | ||
+ | } | ||
+ | |||
+ | /* Owl Override Style */ | ||
+ | .owl-carousel .owl-controls, | ||
+ | .owl-carousel-posts .owl-controls { | ||
+ | margin-top: 0; | ||
+ | } | ||
+ | |||
+ | .owl-carousel .owl-controls .owl-nav .owl-next, | ||
+ | .owl-carousel .owl-controls .owl-nav .owl-prev, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-next, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-prev { | ||
+ | top: 50%; | ||
+ | margin-top: -29px; | ||
+ | z-index: 9999; | ||
+ | position: absolute; | ||
+ | -webkit-transition: all 0.2s ease; | ||
+ | -moz-transition: all 0.2s ease; | ||
+ | -ms-transition: all 0.2s ease; | ||
+ | -o-transition: all 0.2s ease; | ||
+ | transition: all 0.2s ease; | ||
+ | } | ||
+ | |||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-next, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-prev { | ||
+ | top: 24%; | ||
+ | } | ||
+ | |||
+ | .owl-carousel .owl-controls .owl-nav .owl-next, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-next { | ||
+ | right: -40px; | ||
+ | } | ||
+ | .owl-carousel .owl-controls .owl-nav .owl-next:hover, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-next:hover { | ||
+ | margin-right: -10px; | ||
+ | } | ||
+ | |||
+ | .owl-carousel .owl-controls .owl-nav .owl-prev, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-prev { | ||
+ | left: -40px; | ||
+ | } | ||
+ | .owl-carousel .owl-controls .owl-nav .owl-prev:hover, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-prev:hover { | ||
+ | margin-left: -10px; | ||
+ | } | ||
+ | |||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-next { | ||
+ | right: -50px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-next { | ||
+ | right: 0px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-prev { | ||
+ | left: -50px; | ||
+ | } | ||
+ | @media screen and (max-width: 768px) { | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-prev { | ||
+ | left: 0px; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-next i, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-prev i, | ||
+ | .owl-carousel-fullwidth .owl-controls .owl-nav .owl-next i, | ||
+ | .owl-carousel-fullwidth .owl-controls .owl-nav .owl-prev i { | ||
+ | color: #2e2e2e; | ||
+ | } | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-next:hover i, | ||
+ | .owl-carousel-posts .owl-controls .owl-nav .owl-prev:hover i, | ||
+ | .owl-carousel-fullwidth .owl-controls .owl-nav .owl-next:hover i, | ||
+ | .owl-carousel-fullwidth .owl-controls .owl-nav .owl-prev:hover i { | ||
+ | color: #000000; | ||
+ | } | ||
+ | |||
+ | .owl-carousel-fullwidth.fh5co-light-arrow .owl-controls .owl-nav .owl-next i, | ||
+ | .owl-carousel-fullwidth.fh5co-light-arrow .owl-controls .owl-nav .owl-prev i { | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | .owl-carousel-fullwidth.fh5co-light-arrow .owl-controls .owl-nav .owl-next:hover i, | ||
+ | .owl-carousel-fullwidth.fh5co-light-arrow .owl-controls .owl-nav .owl-prev:hover i { | ||
+ | color: #ffffff; | ||
+ | } | ||
+ | |||
+ | @media screen and (max-width: 768px) { | ||
+ | .owl-theme .owl-controls .owl-nav { | ||
+ | display: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .owl-theme .owl-controls .owl-nav [class*="owl-"] { | ||
+ | background: none !important; | ||
+ | } | ||
+ | .owl-theme .owl-controls .owl-nav [class*="owl-"] i { | ||
+ | font-size: 30px; | ||
+ | } | ||
+ | .owl-theme .owl-controls .owl-nav [class*="owl-"] i:hover, .owl-theme .owl-controls .owl-nav [class*="owl-"] i:focus { | ||
+ | background: none !important; | ||
+ | } | ||
+ | .owl-theme .owl-controls .owl-nav [class*="owl-"]:hover, .owl-theme .owl-controls .owl-nav [class*="owl-"]:focus { | ||
+ | background: none !important; | ||
+ | } | ||
+ | |||
+ | .owl-theme .owl-dots { | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | width: 100%; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | .owl-carousel-fullwidth.owl-theme .owl-dots { | ||
+ | bottom: 0; | ||
+ | margin-bottom: -2.5em; | ||
+ | } | ||
+ | |||
+ | .owl-theme .owl-dots .owl-dot span { | ||
+ | width: 10px; | ||
+ | height: 10px; | ||
+ | background: #57cecd; | ||
+ | -webkit-transition: all 0.2s ease; | ||
+ | -moz-transition: all 0.2s ease; | ||
+ | -ms-transition: all 0.2s ease; | ||
+ | -o-transition: all 0.2s ease; | ||
+ | transition: all 0.2s ease; | ||
+ | border: 2px solid transparent; | ||
+ | } | ||
+ | .owl-theme .owl-dots .owl-dot span:hover { | ||
+ | background: none; | ||
+ | border: 2px solid #57cecd; | ||
+ | } | ||
+ | |||
+ | .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { | ||
+ | background: none; | ||
+ | border: 2px solid #57cecd; | ||
+ | } | ||
+ | |||
+ | /* Image Alignment */ | ||
+ | img.fh5co-align-right { | ||
+ | float: right; | ||
+ | margin: 0 0 .5em 1em; | ||
+ | } | ||
+ | @media screen and (max-width: 480px) { | ||
+ | img.fh5co-align-right { | ||
+ | width: 100%; | ||
+ | margin: 0 0 .5em 0; | ||
+ | } | ||
+ | } | ||
+ | img.fh5co-align-left { | ||
+ | float: left; | ||
+ | margin: 0 1em .5em 0; | ||
+ | } | ||
+ | @media screen and (max-width: 480px) { | ||
+ | img.fh5co-align-left { | ||
+ | width: 100%; | ||
+ | margin: 0 0 .5em 0; | ||
+ | } | ||
+ | } | ||
+ | img.fh5co-align-center { | ||
+ | display: block; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | |||
+ | a > img.fh5co-align-right { | ||
+ | float: right; | ||
+ | margin: 0 0 .5em 1em; | ||
+ | } | ||
+ | @media screen and (max-width: 480px) { | ||
+ | a > img.fh5co-align-right { | ||
+ | width: 100%; | ||
+ | margin: 0 0 .5em 0; | ||
+ | } | ||
+ | } | ||
+ | a > img.fh5co-align-left { | ||
+ | float: left; | ||
+ | margin: 0 1em .5em 0; | ||
+ | } | ||
+ | @media screen and (max-width: 480px) { | ||
+ | a > img.fh5co-align-left { | ||
+ | width: 100%; | ||
+ | margin: 0 0 .5em 0; | ||
+ | } | ||
+ | } | ||
+ | a > img.fh5co-align-center { | ||
+ | display: block; | ||
+ | margin-left: auto; | ||
+ | margin-right: auto; | ||
+ | } | ||
+ | |||
+ | /*# sourceMappingURL=style.css.map */ | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <style> | ||
+ | .owl-theme .owl-controls{margin-top:10px;text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-controls .owl-nav [class*=owl-]{color:#fff;font-size:14px;margin:5px;padding:4px 7px;background:#d6d6d6;display:inline-block;cursor:pointer;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:#869791;color:#fff;text-decoration:none}.owl-theme .owl-controls .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1;*display:inline}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#d6d6d6;display:block;-webkit-backface-visibility:visible;-webkit-transition:opacity 200ms ease;-moz-transition:opacity 200ms ease;-ms-transition:opacity 200ms ease;-o-transition:opacity 200ms ease;transition:opacity 200ms ease;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791} | ||
+ | |||
+ | /*.owl-theme .owl-controls { | ||
+ | margin-top:10px; | ||
+ | text-align:center; | ||
+ | -webkit-tap-highlight-color:transparent | ||
+ | } | ||
+ | .owl-theme .owl-controls .owl-nav[class*=owl-] { | ||
+ | color:#fff; | ||
+ | font-size:14px; | ||
+ | margin:5px; | ||
+ | padding:4px 7px; | ||
+ | background:#d6d6d6; | ||
+ | display:inline-block; | ||
+ | cursor:pointer; | ||
+ | -webkit-border-radius:3px; | ||
+ | -moz-border-radius:3px; | ||
+ | border-radius:3px | ||
+ | } | ||
+ | .owl-theme .owl-controls .owl-nav[class*=owl-]:hover { | ||
+ | background:#869791; | ||
+ | color:#fff; | ||
+ | text-decoration:none | ||
+ | } | ||
+ | .owl-theme .owl-controls .owl-nav .disabled { | ||
+ | opacity:.5; | ||
+ | cursor:default | ||
+ | } | ||
+ | .owl-theme .owl-dots .owl-dot { | ||
+ | display:inline-block; | ||
+ | zoom:1; | ||
+ | *display:inline | ||
+ | } | ||
+ | .owl-theme .owl-dots .owl-dot span { | ||
+ | width:10px; | ||
+ | height:10px; | ||
+ | margin:5px 7px; | ||
+ | background:#d6d6d6; | ||
+ | display:block; | ||
+ | -webkit-backface-visibility:visible; | ||
+ | -webkit-transition:opacity 200ms ease; | ||
+ | -moz-transition:opacity 200ms ease; | ||
+ | -ms-transition:opacity 200ms ease; | ||
+ | -o-transition:opacity 200ms ease; | ||
+ | transition:opacity 200ms ease; | ||
+ | -webkit-border-radius:30px; | ||
+ | -moz-border-radius:30px; | ||
+ | border-radius:30px | ||
+ | } | ||
+ | .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { | ||
+ | background:#869791 | ||
+ | }*/ | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | <style> | ||
+ | .owl-carousel .animated{-webkit-animation-duration:1000ms;animation-duration:1000ms;-webkit-animation-fill-mode:both;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{-webkit-transition:height 500ms ease-in-out;-moz-transition:height 500ms ease-in-out;-ms-transition:height 500ms ease-in-out;-o-transition:height 500ms ease-in-out;transition:height 500ms ease-in-out}.owl-carousel{display:none;width:100%;-webkit-tap-highlight-color:transparent;position:relative;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0px,0,0)}.owl-carousel .owl-controls .owl-dot,.owl-carousel .owl-controls .owl-nav .owl-next,.owl-carousel .owl-controls .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loaded{display:block}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel .owl-refresh .owl-item{display:none}.owl-carousel .owl-item{position:relative;min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-item img{display:block;width:100%;-webkit-transform-style:preserve-3d}.owl-carousel.owl-text-select-on .owl-item{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.owl-carousel .owl-grab{cursor:move;cursor:-webkit-grab;cursor:-o-grab;cursor:-ms-grab;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.no-js .owl-carousel{display:block}.owl-carousel .owl-item .owl-lazy{opacity:0;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease}.owl-carousel .owl-item img{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;-webkit-transition:scale 100ms ease;-moz-transition:scale 100ms ease;-ms-transition:scale 100ms ease;-o-transition:scale 100ms ease;transition:scale 100ms ease}.owl-carousel .owl-video-play-icon:hover{-webkit-transition:scale(1.3,1.3);-moz-transition:scale(1.3,1.3);-ms-transition:scale(1.3,1.3);-o-transition:scale(1.3,1.3);transition:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;-webkit-background-size:contain;-moz-background-size:contain;-o-background-size:contain;background-size:contain;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease}.owl-carousel .owl-video-frame{position:relative;z-index:1} | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | <style> | ||
+ | /* Magnific Popup CSS */ | ||
+ | .mfp-bg { | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | z-index: 1042; | ||
+ | overflow: hidden; | ||
+ | position: fixed; | ||
+ | background: #0b0b0b; | ||
+ | opacity: 0.8; | ||
+ | filter: alpha(opacity=80); } | ||
+ | |||
+ | .mfp-wrap { | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | z-index: 1043; | ||
+ | position: fixed; | ||
+ | outline: none !important; | ||
+ | -webkit-backface-visibility: hidden; } | ||
+ | |||
+ | .mfp-container { | ||
+ | text-align: center; | ||
+ | position: absolute; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | padding: 0 8px; | ||
+ | -webkit-box-sizing: border-box; | ||
+ | -moz-box-sizing: border-box; | ||
+ | box-sizing: border-box; } | ||
+ | |||
+ | .mfp-container:before { | ||
+ | content: ''; | ||
+ | display: inline-block; | ||
+ | height: 100%; | ||
+ | vertical-align: middle; } | ||
+ | |||
+ | .mfp-align-top .mfp-container:before { | ||
+ | display: none; } | ||
+ | |||
+ | .mfp-content { | ||
+ | position: relative; | ||
+ | display: inline-block; | ||
+ | vertical-align: middle; | ||
+ | margin: 0 auto; | ||
+ | text-align: left; | ||
+ | z-index: 1045; } | ||
+ | |||
+ | .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { | ||
+ | width: 100%; | ||
+ | cursor: auto; } | ||
+ | |||
+ | .mfp-ajax-cur { | ||
+ | cursor: progress; } | ||
+ | |||
+ | .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { | ||
+ | cursor: -moz-zoom-out; | ||
+ | cursor: -webkit-zoom-out; | ||
+ | cursor: zoom-out; } | ||
+ | |||
+ | .mfp-zoom { | ||
+ | cursor: pointer; | ||
+ | cursor: -webkit-zoom-in; | ||
+ | cursor: -moz-zoom-in; | ||
+ | cursor: zoom-in; } | ||
+ | |||
+ | .mfp-auto-cursor .mfp-content { | ||
+ | cursor: auto; } | ||
+ | |||
+ | .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { | ||
+ | -webkit-user-select: none; | ||
+ | -moz-user-select: none; | ||
+ | user-select: none; } | ||
+ | |||
+ | .mfp-loading.mfp-figure { | ||
+ | display: none; } | ||
+ | |||
+ | .mfp-hide { | ||
+ | display: none !important; } | ||
+ | |||
+ | .mfp-preloader { | ||
+ | color: #cccccc; | ||
+ | position: absolute; | ||
+ | top: 50%; | ||
+ | width: auto; | ||
+ | text-align: center; | ||
+ | margin-top: -0.8em; | ||
+ | left: 8px; | ||
+ | right: 8px; | ||
+ | z-index: 1044; } | ||
+ | .mfp-preloader a { | ||
+ | color: #cccccc; } | ||
+ | .mfp-preloader a:hover { | ||
+ | color: white; } | ||
+ | |||
+ | .mfp-s-ready .mfp-preloader { | ||
+ | display: none; } | ||
+ | |||
+ | .mfp-s-error .mfp-content { | ||
+ | display: none; } | ||
+ | |||
+ | button.mfp-close, button.mfp-arrow { | ||
+ | overflow: visible; | ||
+ | cursor: pointer; | ||
+ | background: transparent; | ||
+ | border: 0; | ||
+ | -webkit-appearance: none; | ||
+ | display: block; | ||
+ | outline: none; | ||
+ | padding: 0; | ||
+ | z-index: 1046; | ||
+ | -webkit-box-shadow: none; | ||
+ | box-shadow: none; } | ||
+ | button::-moz-focus-inner { | ||
+ | padding: 0; | ||
+ | border: 0; } | ||
+ | |||
+ | .mfp-close { | ||
+ | width: 44px; | ||
+ | height: 44px; | ||
+ | line-height: 44px; | ||
+ | position: absolute; | ||
+ | right: 0; | ||
+ | top: 0; | ||
+ | text-decoration: none; | ||
+ | text-align: center; | ||
+ | opacity: 0.65; | ||
+ | filter: alpha(opacity=65); | ||
+ | padding: 0 0 18px 10px; | ||
+ | color: white; | ||
+ | font-style: normal; | ||
+ | font-size: 28px; | ||
+ | font-family: Arial, Baskerville, monospace; } | ||
+ | .mfp-close:hover, .mfp-close:focus { | ||
+ | opacity: 1; | ||
+ | filter: alpha(opacity=100); } | ||
+ | .mfp-close:active { | ||
+ | top: 1px; } | ||
+ | |||
+ | .mfp-close-btn-in .mfp-close { | ||
+ | color: #333333; } | ||
+ | |||
+ | .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { | ||
+ | color: white; | ||
+ | right: -6px; | ||
+ | text-align: right; | ||
+ | padding-right: 6px; | ||
+ | width: 100%; } | ||
+ | |||
+ | .mfp-counter { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | right: 0; | ||
+ | color: #cccccc; | ||
+ | font-size: 12px; | ||
+ | line-height: 18px; } | ||
+ | |||
+ | .mfp-arrow { | ||
+ | position: absolute; | ||
+ | opacity: 0.65; | ||
+ | filter: alpha(opacity=65); | ||
+ | margin: 0; | ||
+ | top: 50%; | ||
+ | margin-top: -55px; | ||
+ | padding: 0; | ||
+ | width: 90px; | ||
+ | height: 110px; | ||
+ | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } | ||
+ | .mfp-arrow:active { | ||
+ | margin-top: -54px; } | ||
+ | .mfp-arrow:hover, .mfp-arrow:focus { | ||
+ | opacity: 1; | ||
+ | filter: alpha(opacity=100); } | ||
+ | .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { | ||
+ | content: ''; | ||
+ | display: block; | ||
+ | width: 0; | ||
+ | height: 0; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | margin-top: 35px; | ||
+ | margin-left: 35px; | ||
+ | border: medium inset transparent; } | ||
+ | .mfp-arrow:after, .mfp-arrow .mfp-a { | ||
+ | border-top-width: 13px; | ||
+ | border-bottom-width: 13px; | ||
+ | top: 8px; } | ||
+ | .mfp-arrow:before, .mfp-arrow .mfp-b { | ||
+ | border-top-width: 21px; | ||
+ | border-bottom-width: 21px; | ||
+ | opacity: 0.7; } | ||
+ | |||
+ | .mfp-arrow-left { | ||
+ | left: 0; } | ||
+ | .mfp-arrow-left:after, .mfp-arrow-left .mfp-a { | ||
+ | border-right: 17px solid white; | ||
+ | margin-left: 31px; } | ||
+ | .mfp-arrow-left:before, .mfp-arrow-left .mfp-b { | ||
+ | margin-left: 25px; | ||
+ | border-right: 27px solid #3f3f3f; } | ||
+ | |||
+ | .mfp-arrow-right { | ||
+ | right: 0; } | ||
+ | .mfp-arrow-right:after, .mfp-arrow-right .mfp-a { | ||
+ | border-left: 17px solid white; | ||
+ | margin-left: 39px; } | ||
+ | .mfp-arrow-right:before, .mfp-arrow-right .mfp-b { | ||
+ | border-left: 27px solid #3f3f3f; } | ||
+ | |||
+ | .mfp-iframe-holder { | ||
+ | padding-top: 40px; | ||
+ | padding-bottom: 40px; } | ||
+ | .mfp-iframe-holder .mfp-content { | ||
+ | line-height: 0; | ||
+ | width: 100%; | ||
+ | max-width: 900px; } | ||
+ | .mfp-iframe-holder .mfp-close { | ||
+ | top: -40px; } | ||
+ | |||
+ | .mfp-iframe-scaler { | ||
+ | width: 100%; | ||
+ | height: 0; | ||
+ | overflow: hidden; | ||
+ | padding-top: 56.25%; } | ||
+ | .mfp-iframe-scaler iframe { | ||
+ | position: absolute; | ||
+ | display: block; | ||
+ | top: 0; | ||
+ | left: 0; | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); | ||
+ | background: black; } | ||
+ | |||
+ | /* Main image in popup */ | ||
+ | img.mfp-img { | ||
+ | width: auto; | ||
+ | max-width: 100%; | ||
+ | height: auto; | ||
+ | display: block; | ||
+ | line-height: 0; | ||
+ | -webkit-box-sizing: border-box; | ||
+ | -moz-box-sizing: border-box; | ||
+ | box-sizing: border-box; | ||
+ | padding: 40px 0 40px; | ||
+ | margin: 0 auto; } | ||
+ | |||
+ | /* The shadow behind the image */ | ||
+ | .mfp-figure { | ||
+ | line-height: 0; } | ||
+ | .mfp-figure:after { | ||
+ | content: ''; | ||
+ | position: absolute; | ||
+ | left: 0; | ||
+ | top: 40px; | ||
+ | bottom: 40px; | ||
+ | display: block; | ||
+ | right: 0; | ||
+ | width: auto; | ||
+ | height: auto; | ||
+ | z-index: -1; | ||
+ | box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); | ||
+ | background: #444444; } | ||
+ | .mfp-figure small { | ||
+ | color: #bdbdbd; | ||
+ | display: block; | ||
+ | font-size: 12px; | ||
+ | line-height: 14px; } | ||
+ | .mfp-figure figure { | ||
+ | margin: 0; } | ||
+ | |||
+ | .mfp-bottom-bar { | ||
+ | margin-top: -36px; | ||
+ | position: absolute; | ||
+ | top: 100%; | ||
+ | left: 0; | ||
+ | width: 100%; | ||
+ | cursor: auto; } | ||
+ | |||
+ | .mfp-title { | ||
+ | text-align: left; | ||
+ | line-height: 18px; | ||
+ | color: #f3f3f3; | ||
+ | word-wrap: break-word; | ||
+ | padding-right: 36px; } | ||
+ | |||
+ | .mfp-image-holder .mfp-content { | ||
+ | max-width: 100%; } | ||
+ | |||
+ | .mfp-gallery .mfp-image-holder .mfp-figure { | ||
+ | cursor: pointer; } | ||
+ | |||
+ | @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { | ||
+ | /** | ||
+ | * Remove all paddings around the image on small screen | ||
+ | */ | ||
+ | .mfp-img-mobile .mfp-image-holder { | ||
+ | padding-left: 0; | ||
+ | padding-right: 0; } | ||
+ | .mfp-img-mobile img.mfp-img { | ||
+ | padding: 0; } | ||
+ | .mfp-img-mobile .mfp-figure:after { | ||
+ | top: 0; | ||
+ | bottom: 0; } | ||
+ | .mfp-img-mobile .mfp-figure small { | ||
+ | display: inline; | ||
+ | margin-left: 5px; } | ||
+ | .mfp-img-mobile .mfp-bottom-bar { | ||
+ | background: rgba(0, 0, 0, 0.6); | ||
+ | bottom: 0; | ||
+ | margin: 0; | ||
+ | top: auto; | ||
+ | padding: 3px 5px; | ||
+ | position: fixed; | ||
+ | -webkit-box-sizing: border-box; | ||
+ | -moz-box-sizing: border-box; | ||
+ | box-sizing: border-box; } | ||
+ | .mfp-img-mobile .mfp-bottom-bar:empty { | ||
+ | padding: 0; } | ||
+ | .mfp-img-mobile .mfp-counter { | ||
+ | right: 5px; | ||
+ | top: 3px; } | ||
+ | .mfp-img-mobile .mfp-close { | ||
+ | top: 0; | ||
+ | right: 0; | ||
+ | width: 35px; | ||
+ | height: 35px; | ||
+ | line-height: 35px; | ||
+ | background: rgba(0, 0, 0, 0.6); | ||
+ | position: fixed; | ||
+ | text-align: center; | ||
+ | padding: 0; } } | ||
+ | |||
+ | @media all and (max-width: 900px) { | ||
+ | .mfp-arrow { | ||
+ | -webkit-transform: scale(0.75); | ||
+ | transform: scale(0.75); } | ||
+ | .mfp-arrow-left { | ||
+ | -webkit-transform-origin: 0; | ||
+ | transform-origin: 0; } | ||
+ | .mfp-arrow-right { | ||
+ | -webkit-transform-origin: 100%; | ||
+ | transform-origin: 100%; } | ||
+ | .mfp-container { | ||
+ | padding-left: 6px; | ||
+ | padding-right: 6px; } } | ||
+ | |||
+ | .mfp-ie7 .mfp-img { | ||
+ | padding: 0; } | ||
+ | .mfp-ie7 .mfp-bottom-bar { | ||
+ | width: 600px; | ||
+ | left: 50%; | ||
+ | margin-left: -300px; | ||
+ | margin-top: 5px; | ||
+ | padding-bottom: 5px; } | ||
+ | .mfp-ie7 .mfp-container { | ||
+ | padding: 0; } | ||
+ | .mfp-ie7 .mfp-content { | ||
+ | padding-top: 44px; } | ||
+ | .mfp-ie7 .mfp-close { | ||
+ | top: 0; | ||
+ | right: 0; | ||
+ | padding-top: 0; } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | <style> | ||
+ | .resp-tabs-list, .resp-tabs-list p { | ||
+ | margin: 0px; | ||
+ | padding: 0px; | ||
+ | } | ||
+ | .resp-tabs-list { | ||
+ | display: inline-block; | ||
+ | } | ||
+ | .resp-tabs-list li { | ||
+ | font-weight: 600; | ||
+ | font-size: 16px; | ||
+ | display: inline-block; | ||
+ | padding: 18px 15px; | ||
+ | margin: 0 4px 0 0; | ||
+ | list-style: none; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | |||
+ | .resp-tabs-container { | ||
+ | padding: 0px; | ||
+ | background-color: #fff; | ||
+ | clear: left; | ||
+ | } | ||
+ | |||
+ | h2.resp-accordion { | ||
+ | cursor: pointer; | ||
+ | padding: 5px; | ||
+ | display: none; | ||
+ | |||
+ | } | ||
+ | .resp-tab-content { | ||
+ | display: none; | ||
+ | padding: 15px; | ||
+ | padding-top: 30px; | ||
+ | text-align: left; | ||
+ | box-shadow: none; | ||
+ | } | ||
+ | .text-center .resp-tab-content, | ||
+ | .text-center .resp-accordion { | ||
+ | text-align: left; | ||
+ | } | ||
+ | |||
+ | .resp-tab-active { | ||
+ | border: 1px solid #ebebeb !important; | ||
+ | border-bottom: none; | ||
+ | margin-bottom: -1px !important; | ||
+ | padding: 17px 14px 19px 14px !important; | ||
+ | border-top: 1px solid #ebebeb !important; | ||
+ | border-bottom: 0px #fff solid !important; | ||
+ | border-top-left-radius: 4px; | ||
+ | border-top-right-radius: 4px; | ||
+ | } | ||
+ | |||
+ | .resp-tab-active { | ||
+ | border-bottom: none; | ||
+ | background-color: #fff; | ||
+ | } | ||
+ | |||
+ | .resp-content-active, .resp-accordion-active { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .resp-tab-content { | ||
+ | border: none; | ||
+ | border-top: 1px solid #ebebeb; | ||
+ | /*border-left-color: transparent; | ||
+ | border-left-color: transparent;*/ | ||
+ | /*border-top-color: #ebebeb;*/ | ||
+ | } | ||
+ | |||
+ | h2.resp-accordion { | ||
+ | font-size: 13px; | ||
+ | border: 1px solid #ebebeb; | ||
+ | border-top: 0px solid #ebebeb; | ||
+ | margin: 0px; | ||
+ | padding: 10px 15px; | ||
+ | } | ||
+ | |||
+ | h2.resp-tab-active { | ||
+ | border-bottom: 0px solid #ebebeb !important; | ||
+ | margin-bottom: 0px !important; | ||
+ | padding: 10px 15px !important; | ||
+ | } | ||
+ | |||
+ | h2.resp-tab-title:last-child { | ||
+ | border-bottom: 12px solid #ebebeb !important; | ||
+ | background: blue; | ||
+ | } | ||
+ | |||
+ | /*-----------Vertical tabs-----------*/ | ||
+ | .resp-vtabs ul.resp-tabs-list { | ||
+ | float: left; | ||
+ | width: 30%; | ||
+ | } | ||
+ | |||
+ | .resp-vtabs .resp-tabs-list li { | ||
+ | display: block; | ||
+ | padding: 19px 15px !important; | ||
+ | margin: 0 0 4px; | ||
+ | cursor: pointer; | ||
+ | float: none; | ||
+ | } | ||
+ | |||
+ | .resp-vtabs .resp-tabs-container { | ||
+ | padding: 0px; | ||
+ | background-color: #fff; | ||
+ | /*border: 1px solid #ebebeb;*/ | ||
+ | border-left: 1px solid #ebebeb; | ||
+ | float: left; | ||
+ | width: 68%; | ||
+ | min-height: 250px; | ||
+ | border-radius: 4px; | ||
+ | clear: none; | ||
+ | } | ||
+ | |||
+ | .resp-vtabs .resp-tab-content { | ||
+ | border: none; | ||
+ | word-wrap: break-word; | ||
+ | padding-left: 30px; | ||
+ | } | ||
+ | |||
+ | .resp-vtabs li.resp-tab-active { | ||
+ | position: relative; | ||
+ | z-index: 1; | ||
+ | margin-right: -1px !important; | ||
+ | padding: 18px 15px 19px 14px !important; | ||
+ | /*border-top: 1px solid;*/ | ||
+ | border: 1px solid #ebebeb !important; | ||
+ | border-left: 1px solid #ebebeb !important; | ||
+ | border-left: none !important; | ||
+ | margin-bottom: 4px !important; | ||
+ | border-right: 1px #FFF solid !important; | ||
+ | border-top-left-radius: 0px; | ||
+ | border-top-right-radius: 0px; | ||
+ | } | ||
+ | |||
+ | .resp-arrow { | ||
+ | float: right; | ||
+ | margin-top: 10px; | ||
+ | -moz-transition: all .2s ease; | ||
+ | -o-transition: all .2s ease; | ||
+ | -webkit-transition: all .2s ease; | ||
+ | transition: all .2s ease; | ||
+ | } | ||
+ | |||
+ | h2.resp-tab-active span.resp-arrow { | ||
+ | -ms-transform: rotate(180deg); /* IE 9 */ | ||
+ | -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */ | ||
+ | transform: rotate(180deg); | ||
+ | } | ||
+ | |||
+ | /*-----------Accordion styles-----------*/ | ||
+ | h2.resp-tab-active { | ||
+ | background: #DBDBDB;/* !important;*/ | ||
+ | } | ||
+ | |||
+ | .resp-easy-accordion h2.resp-accordion { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | |||
+ | .resp-easy-accordion .resp-tab-content:last-child { | ||
+ | border-bottom: 1px solid #ebebeb;/* !important;*/ | ||
+ | } | ||
+ | |||
+ | .resp-jfit { | ||
+ | width: 100%; | ||
+ | margin: 0px; | ||
+ | } | ||
+ | |||
+ | .resp-tab-content-active { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | h2.resp-accordion:first-child { | ||
+ | border-top: 1px solid #ebebeb;/* !important;*/ | ||
+ | } | ||
+ | .resp-accordion.resp-tab-active { | ||
+ | border-top: none; | ||
+ | } | ||
+ | |||
+ | /*Here your can change the breakpoint to set the accordion, when screen resolution changed*/ | ||
+ | @media only screen and (max-width: 768px) { | ||
+ | ul.resp-tabs-list { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | h2.resp-accordion { | ||
+ | display: block; | ||
+ | } | ||
+ | .resp-tab-content { | ||
+ | border: 1px solid #ebebeb; | ||
+ | } | ||
+ | .resp-vtabs .resp-tab-content { | ||
+ | border: 1px solid #ebebeb; | ||
+ | } | ||
+ | |||
+ | .resp-tabs-container .resp-accordion.resp-tab-active { | ||
+ | border-top: none!important; | ||
+ | border-bottom: none!important; | ||
+ | border-top-left-radius: 0px; | ||
+ | border-top-right-radius: 0px; | ||
+ | } | ||
+ | .resp-tabs-container .resp-accordion.resp-tab-active:nth-of-type(1) { | ||
+ | border-top-left-radius: 0px; | ||
+ | border-top-right-radius: 0px; | ||
+ | border-top: 1px solid #ebebeb !important; | ||
+ | border-bototm: none!important; | ||
+ | } | ||
+ | |||
+ | |||
+ | .resp-tab-content { | ||
+ | -webkit-box-shadow: inset 0px 4px 5px -3px rgba(0,0,0,0.05); | ||
+ | -moz-box-shadow: inset 0px 4px 5px -3px rgba(0,0,0,0.05); | ||
+ | -ms-box-shadow: inset 0px 4px 5px -3px rgba(0,0,0,0.05); | ||
+ | box-shadow: inset 0px 4px 5px -3px rgba(0,0,0,0.05); | ||
+ | } | ||
+ | |||
+ | |||
+ | .resp-vtabs .resp-tabs-container { | ||
+ | border: none; | ||
+ | float: none; | ||
+ | width: 100%; | ||
+ | min-height: 100px; | ||
+ | clear: none; | ||
+ | } | ||
+ | |||
+ | .resp-accordion-closed { | ||
+ | display: none !important; | ||
+ | } | ||
+ | |||
+ | .resp-vtabs .resp-tab-content:last-child { | ||
+ | border-bottom: 1px solid #ebebeb !important; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | <style> | ||
+ | @charset "UTF-8"; | ||
+ | |||
+ | /*! | ||
+ | Animate.css - http://daneden.me/animate | ||
+ | Licensed under the MIT license - http://opensource.org/licenses/MIT | ||
+ | |||
+ | Copyright (c) 2015 Daniel Eden | ||
+ | */ | ||
+ | |||
+ | .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 { | ||
+ | -webkit-animation-duration: .75s; | ||
+ | animation-duration: .75s; | ||
+ | } | ||
+ | |||
+ | .animated.flipOutX, | ||
+ | .animated.flipOutY { | ||
+ | -webkit-animation-duration: .75s; | ||
+ | animation-duration: .75s; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes bounce { | ||
+ | from, 20%, 53%, 80%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-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-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | ||
+ | animation-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-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | ||
+ | animation-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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes bounce { | ||
+ | from, 20%, 53%, 80%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-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-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | ||
+ | animation-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-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); | ||
+ | animation-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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .bounce { | ||
+ | -webkit-animation-name: bounce; | ||
+ | animation-name: bounce; | ||
+ | -webkit-transform-origin: center bottom; | ||
+ | transform-origin: center bottom; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes flash { | ||
+ | from, 50%, to { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | 25%, 75% { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes flash { | ||
+ | from, 50%, to { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | 25%, 75% { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .flash { | ||
+ | -webkit-animation-name: flash; | ||
+ | animation-name: flash; | ||
+ | } | ||
+ | |||
+ | /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ | ||
+ | |||
+ | @-webkit-keyframes pulse { | ||
+ | from { | ||
+ | -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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: scale3d(1, 1, 1); | ||
+ | transform: scale3d(1, 1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes pulse { | ||
+ | from { | ||
+ | -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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: scale3d(1, 1, 1); | ||
+ | transform: scale3d(1, 1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .pulse { | ||
+ | -webkit-animation-name: pulse; | ||
+ | animation-name: pulse; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes rubberBand { | ||
+ | from { | ||
+ | -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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: scale3d(1, 1, 1); | ||
+ | transform: scale3d(1, 1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rubberBand { | ||
+ | from { | ||
+ | -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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: scale3d(1, 1, 1); | ||
+ | transform: scale3d(1, 1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .rubberBand { | ||
+ | -webkit-animation-name: rubberBand; | ||
+ | animation-name: rubberBand; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes shake { | ||
+ | from, to { | ||
+ | -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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes shake { | ||
+ | from, to { | ||
+ | -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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .shake { | ||
+ | -webkit-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 0deg); | ||
+ | transform: rotate3d(0, 0, 1, 0deg); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .swing { | ||
+ | -webkit-transform-origin: top center; | ||
+ | transform-origin: top center; | ||
+ | -webkit-animation-name: swing; | ||
+ | animation-name: swing; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes tada { | ||
+ | from { | ||
+ | -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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: scale3d(1, 1, 1); | ||
+ | transform: scale3d(1, 1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes tada { | ||
+ | from { | ||
+ | -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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: scale3d(1, 1, 1); | ||
+ | transform: scale3d(1, 1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .tada { | ||
+ | -webkit-animation-name: tada; | ||
+ | animation-name: tada; | ||
+ | } | ||
+ | |||
+ | /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ | ||
+ | |||
+ | @-webkit-keyframes wobble { | ||
+ | from { | ||
+ | -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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes wobble { | ||
+ | from { | ||
+ | -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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .wobble { | ||
+ | -webkit-animation-name: wobble; | ||
+ | animation-name: wobble; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes jello { | ||
+ | from, 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 { | ||
+ | from, 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 { | ||
+ | from, 20%, 40%, 60%, 80%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: scale3d(1, 1, 1); | ||
+ | transform: scale3d(1, 1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes bounceIn { | ||
+ | from, 20%, 40%, 60%, 80%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: scale3d(1, 1, 1); | ||
+ | transform: scale3d(1, 1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .bounceIn { | ||
+ | -webkit-animation-name: bounceIn; | ||
+ | animation-name: bounceIn; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes bounceInDown { | ||
+ | from, 60%, 75%, 90%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes bounceInDown { | ||
+ | from, 60%, 75%, 90%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .bounceInDown { | ||
+ | -webkit-animation-name: bounceInDown; | ||
+ | animation-name: bounceInDown; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes bounceInLeft { | ||
+ | from, 60%, 75%, 90%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes bounceInLeft { | ||
+ | from, 60%, 75%, 90%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .bounceInLeft { | ||
+ | -webkit-animation-name: bounceInLeft; | ||
+ | animation-name: bounceInLeft; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes bounceInRight { | ||
+ | from, 60%, 75%, 90%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | } | ||
+ | |||
+ | from { | ||
+ | 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 { | ||
+ | from, 60%, 75%, 90%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | } | ||
+ | |||
+ | from { | ||
+ | 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 { | ||
+ | from, 60%, 75%, 90%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | } | ||
+ | |||
+ | from { | ||
+ | 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: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes bounceInUp { | ||
+ | from, 60%, 75%, 90%, to { | ||
+ | -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); | ||
+ | } | ||
+ | |||
+ | from { | ||
+ | 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: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .bounceInUp { | ||
+ | -webkit-animation-name: bounceInUp; | ||
+ | animation-name: bounceInUp; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes bounceOut { | ||
+ | 20% { | ||
+ | -webkit-transform: scale3d(.9, .9, .9); | ||
+ | transform: scale3d(.9, .9, .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(.3, .3, .3); | ||
+ | transform: scale3d(.3, .3, .3); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes bounceOut { | ||
+ | 20% { | ||
+ | -webkit-transform: scale3d(.9, .9, .9); | ||
+ | transform: scale3d(.9, .9, .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(.3, .3, .3); | ||
+ | transform: scale3d(.3, .3, .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 { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeIn { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .fadeIn { | ||
+ | -webkit-animation-name: fadeIn; | ||
+ | animation-name: fadeIn; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes fadeInDown { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(0, -100%, 0); | ||
+ | transform: translate3d(0, -100%, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeInDown { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(0, -2000px, 0); | ||
+ | transform: translate3d(0, -2000px, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeInDownBig { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(-100%, 0, 0); | ||
+ | transform: translate3d(-100%, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeInLeft { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(-2000px, 0, 0); | ||
+ | transform: translate3d(-2000px, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeInLeftBig { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(100%, 0, 0); | ||
+ | transform: translate3d(100%, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeInRight { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(2000px, 0, 0); | ||
+ | transform: translate3d(2000px, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeInRightBig { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | /*-webkit-transform: translate3d(0, 100%, 0); | ||
+ | transform: translate3d(0, 100%, 0);*/ | ||
+ | -webkit-transform: translate3d(0, 50px, 0); | ||
+ | transform: translate3d(0, 50px, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeInUp { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | /*-webkit-transform: translate3d(0, 100%, 0); | ||
+ | transform: translate3d(0, 100%, 0);*/ | ||
+ | -webkit-transform: translate3d(0, 50px, 0); | ||
+ | transform: translate3d(0, 50px, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .fadeInUp { | ||
+ | -webkit-animation-name: fadeInUp; | ||
+ | animation-name: fadeInUp; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes fadeInUpBig { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(0, 2000px, 0); | ||
+ | transform: translate3d(0, 2000px, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeInUpBig { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOut { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .fadeOut { | ||
+ | -webkit-animation-name: fadeOut; | ||
+ | animation-name: fadeOut; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes fadeOutDown { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(0, 100%, 0); | ||
+ | transform: translate3d(0, 100%, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOutDown { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(0, 2000px, 0); | ||
+ | transform: translate3d(0, 2000px, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOutDownBig { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(-100%, 0, 0); | ||
+ | transform: translate3d(-100%, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOutLeft { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(-2000px, 0, 0); | ||
+ | transform: translate3d(-2000px, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOutLeftBig { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(100%, 0, 0); | ||
+ | transform: translate3d(100%, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOutRight { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(2000px, 0, 0); | ||
+ | transform: translate3d(2000px, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOutRightBig { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(0, -100%, 0); | ||
+ | transform: translate3d(0, -100%, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOutUp { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(0, -2000px, 0); | ||
+ | transform: translate3d(0, -2000px, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes fadeOutUpBig { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | -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; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: perspective(400px); | ||
+ | transform: perspective(400px); | ||
+ | -webkit-animation-timing-function: ease-in; | ||
+ | animation-timing-function: ease-in; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes flip { | ||
+ | from { | ||
+ | -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; | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | ||
+ | transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | ||
+ | -webkit-animation-timing-function: ease-in; | ||
+ | animation-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-animation-timing-function: ease-in; | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: perspective(400px); | ||
+ | transform: perspective(400px); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes flipInX { | ||
+ | from { | ||
+ | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | ||
+ | transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | ||
+ | -webkit-animation-timing-function: ease-in; | ||
+ | animation-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-animation-timing-function: ease-in; | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | ||
+ | transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | ||
+ | -webkit-animation-timing-function: ease-in; | ||
+ | animation-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-animation-timing-function: ease-in; | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: perspective(400px); | ||
+ | transform: perspective(400px); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes flipInY { | ||
+ | from { | ||
+ | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | ||
+ | transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | ||
+ | -webkit-animation-timing-function: ease-in; | ||
+ | animation-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-animation-timing-function: ease-in; | ||
+ | animation-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); | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform: perspective(400px); | ||
+ | transform: perspective(400px); | ||
+ | } | ||
+ | |||
+ | 30% { | ||
+ | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | ||
+ | transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | ||
+ | transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes flipOutX { | ||
+ | from { | ||
+ | -webkit-transform: perspective(400px); | ||
+ | transform: perspective(400px); | ||
+ | } | ||
+ | |||
+ | 30% { | ||
+ | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | ||
+ | transform: perspective(400px) rotate3d(1, 0, 0, -20deg); | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | ||
+ | transform: perspective(400px) rotate3d(1, 0, 0, 90deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .flipOutX { | ||
+ | -webkit-animation-name: flipOutX; | ||
+ | animation-name: flipOutX; | ||
+ | -webkit-backface-visibility: visible !important; | ||
+ | backface-visibility: visible !important; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes flipOutY { | ||
+ | from { | ||
+ | -webkit-transform: perspective(400px); | ||
+ | transform: perspective(400px); | ||
+ | } | ||
+ | |||
+ | 30% { | ||
+ | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); | ||
+ | transform: perspective(400px) rotate3d(0, 1, 0, -15deg); | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | ||
+ | transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes flipOutY { | ||
+ | from { | ||
+ | -webkit-transform: perspective(400px); | ||
+ | transform: perspective(400px); | ||
+ | } | ||
+ | |||
+ | 30% { | ||
+ | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); | ||
+ | transform: perspective(400px) rotate3d(0, 1, 0, -15deg); | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | ||
+ | transform: perspective(400px) rotate3d(0, 1, 0, 90deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .flipOutY { | ||
+ | -webkit-backface-visibility: visible !important; | ||
+ | backface-visibility: visible !important; | ||
+ | -webkit-animation-name: flipOutY; | ||
+ | animation-name: flipOutY; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes lightSpeedIn { | ||
+ | from { | ||
+ | -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; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes lightSpeedIn { | ||
+ | from { | ||
+ | -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; | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); | ||
+ | transform: translate3d(100%, 0, 0) skewX(30deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes lightSpeedOut { | ||
+ | from { | ||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform-origin: center; | ||
+ | transform-origin: center; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -200deg); | ||
+ | transform: rotate3d(0, 0, 1, -200deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: center; | ||
+ | transform-origin: center; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateIn { | ||
+ | from { | ||
+ | -webkit-transform-origin: center; | ||
+ | transform-origin: center; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -200deg); | ||
+ | transform: rotate3d(0, 0, 1, -200deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -45deg); | ||
+ | transform: rotate3d(0, 0, 1, -45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateInDownLeft { | ||
+ | from { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -45deg); | ||
+ | transform: rotate3d(0, 0, 1, -45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 45deg); | ||
+ | transform: rotate3d(0, 0, 1, 45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateInDownRight { | ||
+ | from { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 45deg); | ||
+ | transform: rotate3d(0, 0, 1, 45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 45deg); | ||
+ | transform: rotate3d(0, 0, 1, 45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateInUpLeft { | ||
+ | from { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 45deg); | ||
+ | transform: rotate3d(0, 0, 1, 45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -90deg); | ||
+ | transform: rotate3d(0, 0, 1, -90deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateInUpRight { | ||
+ | from { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -90deg); | ||
+ | transform: rotate3d(0, 0, 1, -90deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | |||
+ | 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 { | ||
+ | from { | ||
+ | -webkit-transform-origin: center; | ||
+ | transform-origin: center; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: center; | ||
+ | transform-origin: center; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 200deg); | ||
+ | transform: rotate3d(0, 0, 1, 200deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateOut { | ||
+ | from { | ||
+ | -webkit-transform-origin: center; | ||
+ | transform-origin: center; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: center; | ||
+ | transform-origin: center; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 200deg); | ||
+ | transform: rotate3d(0, 0, 1, 200deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .rotateOut { | ||
+ | -webkit-animation-name: rotateOut; | ||
+ | animation-name: rotateOut; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes rotateOutDownLeft { | ||
+ | from { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 45deg); | ||
+ | transform: rotate3d(0, 0, 1, 45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateOutDownLeft { | ||
+ | from { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 45deg); | ||
+ | transform: rotate3d(0, 0, 1, 45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .rotateOutDownLeft { | ||
+ | -webkit-animation-name: rotateOutDownLeft; | ||
+ | animation-name: rotateOutDownLeft; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes rotateOutDownRight { | ||
+ | from { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -45deg); | ||
+ | transform: rotate3d(0, 0, 1, -45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateOutDownRight { | ||
+ | from { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -45deg); | ||
+ | transform: rotate3d(0, 0, 1, -45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .rotateOutDownRight { | ||
+ | -webkit-animation-name: rotateOutDownRight; | ||
+ | animation-name: rotateOutDownRight; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes rotateOutUpLeft { | ||
+ | from { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -45deg); | ||
+ | transform: rotate3d(0, 0, 1, -45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateOutUpLeft { | ||
+ | from { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: left bottom; | ||
+ | transform-origin: left bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, -45deg); | ||
+ | transform: rotate3d(0, 0, 1, -45deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .rotateOutUpLeft { | ||
+ | -webkit-animation-name: rotateOutUpLeft; | ||
+ | animation-name: rotateOutUpLeft; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes rotateOutUpRight { | ||
+ | from { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 90deg); | ||
+ | transform: rotate3d(0, 0, 1, 90deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rotateOutUpRight { | ||
+ | from { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform-origin: right bottom; | ||
+ | transform-origin: right bottom; | ||
+ | -webkit-transform: rotate3d(0, 0, 1, 90deg); | ||
+ | transform: rotate3d(0, 0, 1, 90deg); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .rotateOutUpRight { | ||
+ | -webkit-animation-name: rotateOutUpRight; | ||
+ | animation-name: rotateOutUpRight; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes hinge { | ||
+ | 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; | ||
+ | } | ||
+ | |||
+ | 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; | ||
+ | -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; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 700px, 0); | ||
+ | transform: translate3d(0, 700px, 0); | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .hinge { | ||
+ | -webkit-animation-name: hinge; | ||
+ | animation-name: hinge; | ||
+ | } | ||
+ | |||
+ | /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ | ||
+ | |||
+ | @-webkit-keyframes rollIn { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); | ||
+ | transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rollIn { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); | ||
+ | transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: none; | ||
+ | transform: none; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .rollIn { | ||
+ | -webkit-animation-name: rollIn; | ||
+ | animation-name: rollIn; | ||
+ | } | ||
+ | |||
+ | /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ | ||
+ | |||
+ | @-webkit-keyframes rollOut { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); | ||
+ | transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes rollOut { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); | ||
+ | transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .rollOut { | ||
+ | -webkit-animation-name: rollOut; | ||
+ | animation-name: rollOut; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes zoomIn { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale3d(.3, .3, .3); | ||
+ | transform: scale3d(.3, .3, .3); | ||
+ | } | ||
+ | |||
+ | 50% { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomIn { | ||
+ | from { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale3d(.3, .3, .3); | ||
+ | transform: scale3d(.3, .3, .3); | ||
+ | } | ||
+ | |||
+ | 50% { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .zoomIn { | ||
+ | -webkit-animation-name: zoomIn; | ||
+ | animation-name: zoomIn; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes zoomInDown { | ||
+ | from { | ||
+ | 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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomInDown { | ||
+ | from { | ||
+ | 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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .zoomInDown { | ||
+ | -webkit-animation-name: zoomInDown; | ||
+ | animation-name: zoomInDown; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes zoomInLeft { | ||
+ | from { | ||
+ | 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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomInLeft { | ||
+ | from { | ||
+ | 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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .zoomInLeft { | ||
+ | -webkit-animation-name: zoomInLeft; | ||
+ | animation-name: zoomInLeft; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes zoomInRight { | ||
+ | from { | ||
+ | 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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomInRight { | ||
+ | from { | ||
+ | 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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .zoomInRight { | ||
+ | -webkit-animation-name: zoomInRight; | ||
+ | animation-name: zoomInRight; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes zoomInUp { | ||
+ | from { | ||
+ | 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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomInUp { | ||
+ | from { | ||
+ | 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); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .zoomInUp { | ||
+ | -webkit-animation-name: zoomInUp; | ||
+ | animation-name: zoomInUp; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes zoomOut { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | 50% { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale3d(.3, .3, .3); | ||
+ | transform: scale3d(.3, .3, .3); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomOut { | ||
+ | from { | ||
+ | opacity: 1; | ||
+ | } | ||
+ | |||
+ | 50% { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale3d(.3, .3, .3); | ||
+ | transform: scale3d(.3, .3, .3); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .zoomOut { | ||
+ | -webkit-animation-name: zoomOut; | ||
+ | animation-name: zoomOut; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes zoomOutDown { | ||
+ | 40% { | ||
+ | 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.550, 0.055, 0.675, 0.190); | ||
+ | animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); | ||
+ | transform: scale3d(.1, .1, .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.320, 1); | ||
+ | animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomOutDown { | ||
+ | 40% { | ||
+ | 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.550, 0.055, 0.675, 0.190); | ||
+ | animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); | ||
+ | transform: scale3d(.1, .1, .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.320, 1); | ||
+ | animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .zoomOutDown { | ||
+ | -webkit-animation-name: zoomOutDown; | ||
+ | animation-name: zoomOutDown; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes zoomOutLeft { | ||
+ | 40% { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); | ||
+ | transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); | ||
+ | transform: scale(.1) translate3d(-2000px, 0, 0); | ||
+ | -webkit-transform-origin: left center; | ||
+ | transform-origin: left center; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomOutLeft { | ||
+ | 40% { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); | ||
+ | transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); | ||
+ | transform: scale(.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(.475, .475, .475) translate3d(-42px, 0, 0); | ||
+ | transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale(.1) translate3d(2000px, 0, 0); | ||
+ | transform: scale(.1) translate3d(2000px, 0, 0); | ||
+ | -webkit-transform-origin: right center; | ||
+ | transform-origin: right center; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomOutRight { | ||
+ | 40% { | ||
+ | opacity: 1; | ||
+ | -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); | ||
+ | transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale(.1) translate3d(2000px, 0, 0); | ||
+ | transform: scale(.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(.475, .475, .475) translate3d(0, 60px, 0); | ||
+ | transform: scale3d(.475, .475, .475) translate3d(0, 60px, 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); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); | ||
+ | transform: scale3d(.1, .1, .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.320, 1); | ||
+ | animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes zoomOutUp { | ||
+ | 40% { | ||
+ | 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.550, 0.055, 0.675, 0.190); | ||
+ | animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | opacity: 0; | ||
+ | -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); | ||
+ | transform: scale3d(.1, .1, .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.320, 1); | ||
+ | animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .zoomOutUp { | ||
+ | -webkit-animation-name: zoomOutUp; | ||
+ | animation-name: zoomOutUp; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes slideInDown { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, -100%, 0); | ||
+ | transform: translate3d(0, -100%, 0); | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes slideInDown { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, -100%, 0); | ||
+ | transform: translate3d(0, -100%, 0); | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .slideInDown { | ||
+ | -webkit-animation-name: slideInDown; | ||
+ | animation-name: slideInDown; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes slideInLeft { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(-100%, 0, 0); | ||
+ | transform: translate3d(-100%, 0, 0); | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes slideInLeft { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(-100%, 0, 0); | ||
+ | transform: translate3d(-100%, 0, 0); | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .slideInLeft { | ||
+ | -webkit-animation-name: slideInLeft; | ||
+ | animation-name: slideInLeft; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes slideInRight { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(100%, 0, 0); | ||
+ | transform: translate3d(100%, 0, 0); | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes slideInRight { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(100%, 0, 0); | ||
+ | transform: translate3d(100%, 0, 0); | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .slideInRight { | ||
+ | -webkit-animation-name: slideInRight; | ||
+ | animation-name: slideInRight; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes slideInUp { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 100%, 0); | ||
+ | transform: translate3d(0, 100%, 0); | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes slideInUp { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 100%, 0); | ||
+ | transform: translate3d(0, 100%, 0); | ||
+ | visibility: visible; | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .slideInUp { | ||
+ | -webkit-animation-name: slideInUp; | ||
+ | animation-name: slideInUp; | ||
+ | } | ||
+ | |||
+ | @-webkit-keyframes slideOutDown { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | visibility: hidden; | ||
+ | -webkit-transform: translate3d(0, 100%, 0); | ||
+ | transform: translate3d(0, 100%, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes slideOutDown { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 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 { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | visibility: hidden; | ||
+ | -webkit-transform: translate3d(-100%, 0, 0); | ||
+ | transform: translate3d(-100%, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes slideOutLeft { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 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 { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | visibility: hidden; | ||
+ | -webkit-transform: translate3d(100%, 0, 0); | ||
+ | transform: translate3d(100%, 0, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes slideOutRight { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 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 { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | visibility: hidden; | ||
+ | -webkit-transform: translate3d(0, -100%, 0); | ||
+ | transform: translate3d(0, -100%, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @keyframes slideOutUp { | ||
+ | from { | ||
+ | -webkit-transform: translate3d(0, 0, 0); | ||
+ | transform: translate3d(0, 0, 0); | ||
+ | } | ||
+ | |||
+ | to { | ||
+ | visibility: hidden; | ||
+ | -webkit-transform: translate3d(0, -100%, 0); | ||
+ | transform: translate3d(0, -100%, 0); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | .slideOutUp { | ||
+ | -webkit-animation-name: slideOutUp; | ||
+ | animation-name: slideOutUp; | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | </html> |
Revision as of 03:18, 24 June 2018