@charset "UTF-8"; html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /*! * animate.css -http://daneden.me/animate * Version - 3.5.1 * Licensed under the MIT license - http://opensource.org/licenses/MIT * * Copyright (c) 2016 Daniel Eden */ .animated { -webkit-animation-duration: 0.7s; animation-duration: 0.7s; -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.flipOutX, .animated.flipOutY, .animated.bounceIn, .animated.bounceOut { -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -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.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } .bounce { -webkit-animation-name: bounce infinite; animation-name: bounce infinite; -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(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: 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(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: 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 headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } } .headShake { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: headShake; animation-name: headShake; } @-webkit-keyframes swing { 20% { -webkit-transform: 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(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform: scale3d(0.9, 0.9, 0.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(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform: scale3d(0.9, 0.9, 0.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.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: 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.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: 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.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -100px, 0); transform: translate3d(0, -100px, 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.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -100px, 0); transform: translate3d(0, -100px, 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.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(0px, 0, 0); transform: translate3d(0px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(0px, 0, 0); transform: translate3d(0px, 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.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 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(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } } @keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 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, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 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(-30px, 0, 0); transform: translate3d(-30px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-30px, 0, 0); transform: translate3d(-30px, 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(-100px, 0, 0); transform: translate3d(-100px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-100px, 0, 0); transform: translate3d(-100px, 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(30px, 0, 0); transform: translate3d(30px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(30px, 0, 0); transform: translate3d(30px, 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(100px, 0, 0); transform: translate3d(100px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(100px, 0, 0); transform: translate3d(100px, 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, 40px, 0); transform: translate3d(0, 40px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 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, 200px, 0); transform: translate3d(0, 200px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 200px, 0); transform: translate3d(0, 200px, 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(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.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(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.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: 1; -webkit-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.2); transform: scale(1.2); } 50% { opacity: 1; } } @keyframes zoomIn { from { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.2); transform: scale(1.2); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } to { opacity: 0; } } @keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } to { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } @-webkit-keyframes slideInDown { 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; } /** * Owl Carousel v2.3.4 * Copyright 2013-2018 David Deutsch * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE */ /* * Owl Carousel - Core */ .owl-carousel { display: none; width: 100%; -webkit-tap-highlight-color: transparent; /* position relative and z-index fix webkit rendering fonts issue */ position: relative; z-index: 1; -ms-touch-action: pan-y; touch-action: pan-y; } .owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; /* fix firefox animation glitch */ } .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; /* fix for flashing background */ -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper, .owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item { position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .owl-carousel .owl-item img { display: block; width: 100%; } .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled { display: none; } .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot { background: none; color: inherit; border: none; padding: 0 !important; font: inherit; } .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 { visibility: hidden; } .owl-carousel.owl-drag .owl-item { -ms-touch-action: pan-y; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-grab { cursor: move; cursor: grab; } .owl-carousel.owl-rtl { direction: rtl; } .owl-carousel.owl-rtl .owl-item { float: right; } /* No Js */ .no-js .owl-carousel { display: block; } /* * Owl Carousel - Animate Plugin */ .owl-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both; } .owl-carousel .owl-animated-in { z-index: 0; } .owl-carousel .owl-animated-out { z-index: 1; } .owl-carousel .fadeOut { animation-name: fadeOut; } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* * Owl Carousel - Auto Height Plugin */ .owl-height { transition: height 500ms ease-in-out; } /* * Owl Carousel - Lazy Load Plugin */ .owl-carousel .owl-item { /** This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong calculation of the height of the owl-item that breaks page layouts */ } .owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 400ms ease; } .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) { max-height: 0; } .owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; } /* * Owl Carousel - Video Plugin */ .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; transition: transform 100ms ease; } .owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon { display: none; } .owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease; } .owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; } * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { scroll-behavior: smooth; overflow-x: hidden; } a, button, input { outline: none; } img { vertical-align: middle; border: 0; width: 100%; height: auto; } #main-wrapper { background: #fff; overflow: hidden; } @media (max-width: 960px) { #main-wrapper { padding-top: 80px; } } @media (max-width: 991px) { #main-wrapper { margin-bottom: 0 !important; } } .container { padding: 0 15px; margin: 0 auto; max-width: 1270px; } @media (max-width: 1199px) { .container { max-width: 1000px; } } @media (max-width: 991px) { .container { max-width: 750px; } } .container.full-width { max-width: 100%; padding: 0; } .nav-wrap { padding-top: 138px; background-color: #2f2f2f; } @media (max-width: 960px) { .nav-wrap { display: none; } } .hidden { display: none; } .Zebra_DatePicker { z-index: 99999; } #preloader { position: fixed; left: 0; top: 0; z-index: 999999999; width: 100%; background: #fff; height: 100%; overflow: visible; } #preloader .spinner { height: 5px; width: 100%; position: relative; overflow: hidden; background-color: #f8f8f8; } #preloader .spinner:before { content: ''; background: #f1592a; display: block; position: absolute; left: -200px; width: 200px; height: 5px; animation: loading 2s linear infinite; } @keyframes loading { from { left: -200px; width: 30%; } 50% { width: 30%; } 70% { width: 70%; } 80% { left: 50%; } 95% { left: 120%; } to { left: 100%; } } .btn { display: inline-block; margin-bottom: 0; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; touch-action: manipulation; cursor: pointer; user-select: none; border: 1px solid transparent; } .btn:active, .btn:focus { outline: 0; } .btn.blue-btn { background-color: #24a9e2; color: #ffffff; padding: 17px 40px; font-weight: 600; text-transform: uppercase; font-size: 16px; } .specs-table { width: 100%; margin-bottom: 40px; } .specs-table td { max-width: 50%; width: 50%; border: 1px solid #888; padding: 5px 10px; } .custom-breadcrumbs { color: #ffffff; font-size: 16px; } .custom-breadcrumbs span { color: #cccccc; margin-right: 10px; font-weight: 400; } .custom-breadcrumbs span a { color: #ffffff; font-weight: 600; } .custom-breadcrumbs .active-page span { margin: 0; } .alignnone { margin: 5px 20px 20px 0; } .aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; } .alignright { float: right; margin: 5px 0 20px 20px; } .alignleft { float: left; margin: 5px 20px 20px 0; } .wp-caption { text-align: center; } .wp-caption p.wp-caption-text { line-height: 17px; margin: 10px 0; padding: 0 4px 5px; } .tags { margin-top: 0; margin-bottom: 25px; border-top: none; width: 100%; padding-top: 0; } .tags-label { display: inline-block; margin-right: 4px; font-size: 13px !important; -webkit-transition: 0.25s; -moz-transition: 0.25s; -ms-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; background: transparent; margin-bottom: 8px; text-transform: capitalize; border-radius: 0; font-weight: normal; color: inherit; line-height: 19px; padding: 5px 8px; border: 1px solid rgba(0, 0, 0, 0.1); } .navigation.pagination { text-align: center; width: 100%; padding-right: 10px; } .navigation.pagination:after { content: ''; display: block; float: none; clear: both; } .navigation.pagination a { color: #f1592a; border: 2px solid #f1592a; background: transparent; } .navigation.pagination a:hover { color: #ffffff; background: #f1592a; } .navigation.pagination a[rel="prev"] { float: left; -webkit-transition: 0.3s !important; -moz-transition: 0.3s !important; -ms-transition: 0.3s !important; -o-transition: 0.3s !important; transition: 0.3s !important; text-align: center; height: 46px; border-radius: 0; min-width: 170px; font-size: 13px; font-weight: 900; padding: 0 25px; margin: auto; display: table; text-transform: uppercase; box-sizing: border-box; line-height: 46px; outline: none; cursor: pointer; } @media (max-width: 960px) { .navigation.pagination a[rel="prev"] { width: 100%; margin-bottom: 10px; } } .navigation.pagination a[rel="prev"]:before { content: "\F104"; padding-right: 10px; font-weight: bold; font-family: FontAwesome; font-size: 16px; text-rendering: auto; -webkit-font-smoothing: antialiased; } .navigation.pagination a[rel="next"] { float: right; -webkit-transition: 0.3s !important; -moz-transition: 0.3s !important; -ms-transition: 0.3s !important; -o-transition: 0.3s !important; transition: 0.3s !important; text-align: center; height: 46px; border-radius: 0; min-width: 170px; font-size: 13px; font-weight: 900; padding: 0 25px; margin: auto; display: table; text-transform: uppercase; box-sizing: border-box; line-height: 46px; outline: none; cursor: pointer; } @media (max-width: 960px) { .navigation.pagination a[rel="next"] { width: 100%; margin-bottom: 10px; } } .navigation.pagination a[rel="next"]:after { content: "\F105"; padding-right: 0; margin: 0; padding-left: 10px; font-weight: bold; font-family: FontAwesome; font-size: 16px; text-rendering: auto; -webkit-font-smoothing: antialiased; } .pagination { display: inline-block; padding-left: 0; border-radius: 4px; } .destinations-page { padding: 0 0 40px; } @media (max-width: 960px) { #comments { margin-bottom: 60px; margin-top: 45px; padding: 0 15px; } } #comments .reply-title { margin-top: 0; margin-bottom: 30px; border-top: none; padding-top: 0; font-size: 18px; margin-right: 30px; line-height: 1; font-weight: bold; padding-bottom: 0; border-bottom: none; } #comments .comment-list { list-style-type: none; padding-left: 0; padding-right: 10px; margin-bottom: 50px; } #comments .comment { padding: 0; margin-bottom: 20px; } #comments .comment img { float: left; border-radius: 0; margin-right: 30px; width: 70px; height: 70px; } #comments .comment-body { position: relative; background: rgba(0, 0, 0, 0.05); padding: 20px; } #comments .comment-meta { margin: 0px 0 15px 0; line-height: 1; opacity: 1; margin-top: 5px; } #comments .comment-meta a { font-size: 13px; color: inherit; opacity: 1; font-weight: 600; } #comments .comment-meta a:hover { color: #f1592a; } #comments p { margin-bottom: 0; line-height: inherit; font-size: inherit; padding-left: 100px; } #comments .reply { margin-top: 15px; margin-left: 100px; line-height: 1.4; font-size: 13px; } #comments .reply a { text-transform: capitalize; font-size: 13px; color: inherit; opacity: 1; font-weight: 600; } #comments .reply a:hover { color: #f1592a; } #comments .fn { font-style: inherit; font-weight: bold; font-size: 14px; margin-bottom: 15px; text-transform: uppercase; } #comments .says { display: none; } #respond { margin-top: 20px; } #respond #reply-title { margin-top: 0; margin-bottom: 20px; border-top: none; padding-top: 0; font-size: 18px; margin-right: 30px; line-height: 1; font-weight: bold; padding-bottom: 0; border-bottom: none; letter-spacing: -0.3px; color: #2f2f2f; } #respond #reply-title .small { font-size: 65%; font-weight: normal; line-height: 1; color: #777; } .comment-notes { display: none; } #commentform p { padding-left: 0; } #commentform .comment-form-author { padding-right: 15px; } @media (max-width: 960px) { #commentform .comment-form-author { padding-right: 0; } } #commentform .comment-form-author { padding-right: 15px; } @media (max-width: 960px) { #commentform .comment-form-author { padding-right: 0; } } #commentform .comment-form-email { padding-left: 15px; } @media (max-width: 960px) { #commentform .comment-form-email { padding-left: 0; } } #commentform textarea { border-radius: 0; margin-bottom: 20px; height: 100px; margin-right: 0; display: block; border: 2px solid rgba(0, 0, 0, 0.1); max-width: calc(100% - 10px); padding: 20px; } #commentform #submit { border: 2px solid #f1592a; float: none; display: inline-block; height: 50px; line-height: 48px; -webkit-transition: 0.3s !important; -moz-transition: 0.3s !important; -ms-transition: 0.3s !important; -o-transition: 0.3s !important; transition: 0.3s !important; text-align: center; height: 46px; border-radius: 0; min-width: 170px; font-size: 13px; font-weight: 900; padding: 0 25px; display: table; text-transform: uppercase; box-sizing: border-box; line-height: 100%; -webkit-transition: 0.25s; -o-transition: 0.25s; outline: none; transition: 0.25s; cursor: pointer; background: transparent; color: #f1592a; } #commentform #submit:hover { background: #f1592a; color: #fff; } @media (max-width: 960px) { #commentform #submit { width: 100%; margin-bottom: 20px; } } #commentform input[type="text"], #commentform input[type="email"], .comment-form-author, .comment-form-email { width: 50%; float: left; } @media (max-width: 960px) { #commentform input[type="text"], #commentform input[type="email"], .comment-form-author, .comment-form-email { width: 100%; } } label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: bold; } #commentform textarea { -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; background-color: transparent; letter-spacing: 0; border: none; border-radius: 0; box-shadow: none; outline: none; display: block; padding: 0 25px; font-size: 13px; font-weight: 900; text-shadow: none; background: #fff; resize: none; max-height: 120px; width: 100%; line-height: 18px; color: #333; margin: 0; text-align: left; padding-top: 15px; min-width: auto; border: none; display: block; border-radius: 0; margin-bottom: 20px; height: 100px; margin-right: 0; display: block; border: 2px solid rgba(0, 0, 0, 0.1); max-width: calc(100% - 10px); padding: 20px; } input, button, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; } #comments input[type="text"], #comments input[type="email"], #comments input[type="text"], #comments input[type="email"] { width: 100%; height: 50px; background-color: transparent; border: 2px solid white; outline: none; display: inline-block; padding: 0 25px; font-size: 12px; text-transform: capitalize; font-weight: 600; text-shadow: none; letter-spacing: 1px; border: 2px solid #e8e9e9; } #comments input[type="text"], #comments input[type="email"], #comments input[type="text"], #comments input[type="email"] { min-width: 100px; box-shadow: none; border: none; width: 100%; margin-bottom: 28px; width: calc(100% - 30px); border: 2px solid #e8e9e9; } @media (max-width: 960px) { #comments input[type="text"], #comments input[type="email"], #comments input[type="text"], #comments input[type="email"] { width: 100%; } } #commentform input[type="text"], #commentform input[type="email"] { line-height: 50px; } button, input, optgroup, select, textarea { margin: 0; font: inherit; color: inherit; } input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; appearance: auto; } input[type="radio"], input[type="checkbox"] { margin: 4px 0 0; margin-top: 1px \9; line-height: normal; } @media (max-width: 960px) { #commentform textarea, #comments input { margin-bottom: 10px; max-width: 100%; } } .searchform { position: relative; } .searchform #search { width: 100%; padding: 0 20px; border: none; outline: none; font-size: inherit; line-height: 50px; height: 50px; margin-top: 0; border-radius: 0; background: rgba(0, 0, 0, 0.05); } .searchform #searchsubmit { background: #f1592a; position: absolute; outline: none; margin-top: 0; -webkit-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; border: none; top: 0; color: #fff; padding: 0; right: 0; height: 50px; width: 50px; font-size: 16px; font-family: FontAwesome; cursor: pointer; } .searchform #searchsubmit:hover { background: #2f2f2f; } .searchform.empty input[type=text] { border: 2px solid red !important; } .searchform.empty .form-error-handler { display: block !important; } .blog_widget { font-size: inherit; margin-bottom: 40px; padding-left: 0; } .blog_widget:first-child .widget-title { border-top: none; padding-top: 0; } .blog_widget .widget-title { letter-spacing: -0.3px; color: #2f2f2f; padding: 30px 0; padding-top: 33px; margin: 0; border-top: 2px solid; line-height: 1; font-size: 18px; font-weight: bold; border-color: #f1592a; } .blog_widget ul { padding: 0 !important; list-style-type: none; margin-bottom: 0 !important; } .blog_widget ul li { font-size: 14px; color: inherit; font-weight: bold; list-style-type: none; padding-top: 13px; padding-bottom: 13px; background: rgba(0, 0, 0, 0.05); padding-left: 20px; padding-right: 20px; margin-bottom: 1px; } .blog_widget ul li a { color: #2f2f2f; -webkit-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; font-size: 14px; font-weight: bold; line-height: 1; } .blog_widget ul li a:hover { color: #f1592a; } .blog_widget ul.children li { background: none; padding-bottom: 0; } .img-content { width: 50%; height: auto; margin: 0 auto; } @media (max-width: 768px) { .img-content { width: 100%; } } em { font-style: italic; } .default-ul { list-style: none; padding-left: 0; } .default-ul li { position: relative; padding-left: 25px; line-height: 25px; margin-bottom: 10px; } .default-ul li:before { content: ""; background: #f1592a; width: 9px; height: 9px; padding: 0; top: 7px; border-radius: 100%; position: absolute; left: 0; } .error404 .nav-wrap { padding: 0; } .page-404 { height: 100vh; display: table; width: 100%; } .page-404 .section-heading { color: #f1592a; } .page-404 .container { display: table-cell; vertical-align: middle; width: 100%; } .page-404, .search-no-results #posts-content { padding-top: 100px; height: 100vh; padding-bottom: 80px; } .page-404 .secondary-button-inverse { background: transparent; color: #fff; } .page-404 .section-subheading, .search-no-results #posts-content .section-subheading { margin-bottom: 50px; max-width: 420px; font-weight: 300; } .page-404 .section-subheading { font-weight: bold; margin-bottom: 35px; } .page-404 .tt_button { -webkit-transition: 0.3s !important; -moz-transition: 0.3s !important; -ms-transition: 0.3s !important; -o-transition: 0.3s !important; transition: 0.3s !important; text-align: center; border: 2px solid; min-width: 170px; font-size: 13px; font-weight: 900; color: #fff; padding: 0; padding: 17px 25px; margin: auto; display: table; text-transform: uppercase; box-sizing: border-box; line-height: 1; -webkit-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; cursor: pointer; border-color: #f1592a; background: #f1592a; } .page-404 .tt_button:hover { background: transparent; color: #f1592a; } .page-404 .section-heading { font-size: 96px; letter-spacing: -1px; line-height: 82px; margin-bottom: 25px; text-align: center; font-weight: 400; text-transform: inherit; } .page404-overlay { position: absolute; background-position: center; height: 100%; width: 100%; opacity: 0.2; top: 0; background-blend-mode: overlay; } body, html { font-family: "Open Sans"; font-weight: 400; color: #333333; font-size: 14px; line-height: 24px; } h1, .h1 { font-size: 36px; } h2, .h2 { font-size: 28px; font-weight: 700; line-height: 34px; color: #2f2f2f; } h3, .h3 { font-size: 24px; } h5, .h5 { font-size: 14px; line-height: 28px; } h6, .h6 { font-size: 12px; line-height: 28px; } h1, h2, h3, h4, h5 { font-weight: 700; line-height: 1.1; color: inherit; } h1, h2, h3 { margin-top: 20px; margin-bottom: 10px; letter-spacing: -0.7px; } h4, h5, h6 { margin-top: 10px; margin-bottom: 10px; } .container h2 { line-height: 34px; } h4, .h4 { font-size: 18px; color: #2f2f2f; line-height: 28px; } .section-heading { text-transform: uppercase; } h2.section-heading { margin: auto; margin-top: 0; margin-bottom: 10px; letter-spacing: -0.7px; max-width: 600px; text-align: center; } .section-subheading { margin: auto; margin-bottom: 50px; text-transform: none; text-align: center; margin-top: 10px; max-width: 650px; font-weight: 300; font-size: 18px; } @media (max-width: 960px) { p { margin-bottom: 20px; } } p:last-of-type { margin-bottom: 0; } a { text-decoration: none; color: #f1592a; } a:hover { color: #23527c; } ul, ol { margin-top: 0; margin-bottom: 10px; } strong { font-weight: 700; } .fancybox-slide--html { padding: 0; } header { background-color: #fff; position: fixed; width: 100%; z-index: 999; margin-top: 0; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -ms-transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; } @media (max-width: 960px) { header { padding: 8px 15px; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15); } } header.nav-shrink { margin-top: -46px; } @media (max-width: 960px) { header.nav-shrink { margin-top: 0; } } header .topbar { background-color: #1f1f1f; border-bottom: 1px solid rgba(0, 0, 0, 0.15); } @media (max-width: 960px) { header .topbar { display: none; } } header .topbar .topbar-contacts { margin: 0 15px; } header .topbar .topbar-contacts a { color: #ffffff; font-size: 13px; font-weight: 500; line-height: 45px; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -ms-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease; } header .topbar .topbar-contacts a:hover { color: #ff6600; } header .topbar .topbar-contacts a:hover .fa-whatsapp { color: #ff6600; } header .topbar .topbar-contacts span { color: #ffffff; font-size: 13px; } header .topbar .fa-whatsapp { color: #ffffff; margin-right: 5px; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -ms-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease; } header .topbar .iconsmind-Telephone { font-size: 16px !important; display: block; float: left; line-height: 45px; margin-right: 5px; } header .topbar-phone { font-weight: 500; line-height: 45px; margin-right: 30px; float: left; font-size: 13px; } header .topbar-socials { border-left: 1px solid rgba(255, 255, 255, 0.3); border-right: 1px solid rgba(255, 255, 255, 0.3); float: right; height: 45px; margin: 0 15px; } header .topbar-socials a { color: #ffffff; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -ms-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease; padding: 0 17px; line-height: 27px; display: block; float: left; margin-top: 9px; } header .topbar-socials a:hover { color: #ff6600; } header .topbar-socials a:first-of-type { border-right: 1px solid rgba(255, 255, 255, 0.3); } @media (max-width: 1024px) { header .container { max-width: 100%; } } @media (max-width: 960px) { header .container { padding: 8px 15px; } } header .container:after { content: ''; clear: both; display: block; float: none; } header #logo { float: left; margin-top: 1px; } header #logo .logo { width: calc(100% - 15px); display: block; margin-left: 15px; line-height: 89px; } @media (max-width: 960px) { header #logo .logo { margin-left: 0; line-height: 47px; } } @media (max-width: 960px) { header #logo .logo img { max-height: 47px; margin-top: 0px; width: auto; max-width: none; margin-left: -10px; display: block; } } header .page-scroll { display: none; margin: 0; } @media (max-width: 960px) { header .page-scroll { display: block; } } header .page-scroll .navbar-toggle { border: none; margin-right: -10px; position: relative; float: right; padding: 9px 10px; margin-top: 8px; margin-bottom: 8px; background-color: transparent; border-radius: 4px; } header .page-scroll .icon-bar { background: #1f1f1f; display: block; width: 22px; height: 2px; border-radius: 1px; } header .page-scroll .icon-bar+.icon-bar { margin-top: 4px; } header .page-scroll:after { content: ''; display: block; float: none; clear: both; } header #main-menu { float: right; } @media (max-width: 960px) { header #main-menu { display: none; overflow: scroll; max-height: calc(100vh - 65px); float: none; } } @media (min-width: 961px) { header #main-menu { display: block !important; } } header #main-menu .menu { margin-bottom: 0; } @media (max-width: 960px) { header #main-menu .menu { margin: 0; margin-top: 20px; margin-bottom: 20px; text-align: left; } } header #main-menu .menu:after { content: ''; display: block; float: none; clear: both; } header #main-menu li { float: left; } @media (max-width: 960px) { header #main-menu li { float: none; } } header #main-menu .menu-item { position: relative; display: block; } header #main-menu .menu-item a { color: #1f1f1f; display: block; font-size: 18px; font-weight: 700; line-height: 18px; margin: 0 15px; padding: 38px 0 36px; position: relative; text-transform: uppercase; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -ms-transition: all 0.25s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease; } @media (max-width: 960px) { header #main-menu .menu-item a { padding: 12px 0; margin: 0; } } header #main-menu .menu-item a:after { position: absolute; top: 100%; left: 0; width: 100%; height: 1px; content: ''; opacity: 0; background: #ff6600; -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px); -webkit-transition: height 0.25s ease, opacity 0.25s ease, transform 0.25s ease; -moz-transition: height 0.25s ease, opacity 0.25s ease, transform 0.25s ease; -ms-transition: height 0.25s ease, opacity 0.25s ease, transform 0.25s ease; -o-transition: height 0.25s ease, opacity 0.25s ease, transform 0.25s ease; transition: height 0.25s ease, opacity 0.25s ease, transform 0.25s ease; } header #main-menu .menu-item a:hover { color: #ff6600; } header #main-menu .menu-item a:hover:after { height: 3px; opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); } header #main-menu .menu-item.current-menu-item a { color: #ff6600; } header #main-menu .menu-item.current-menu-item a:after { height: 3px; opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); } @media (max-width: 960px) { header #main-menu .menu-item.current-menu-item a { color: #1f1f1f; } header #main-menu .menu-item.current-menu-item a:after { display: none; } } footer { position: fixed; bottom: 0; left: 0; right: 0; width: 100%; z-index: -1; } @media (max-width: 991px) { footer { position: relative; z-index: 1; } } footer .upper-footer { background: #f1592a; color: #ffffff; padding: 80px 0 70px; } @media (max-width: 991px) { footer .upper-footer { padding: 70px 0 50px; } } footer .upper-footer .fa-whatsapp { float: none; margin: 4px 5px 0 5px; } footer a { color: inherit; -webkit-transition: 0.25s; -moz-transition: 0.25s; -ms-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; } footer a:hover { color: #cccccc; } footer .footer-business-info { background: #d85026; padding: 40px; margin: -80px 15px 80px 15px; } @media (max-width: 991px) { footer .footer-business-info { padding: 40px 20px 20px 20px; margin: -70px 15px 20px 15px; } } footer .footer-business-info [class^="iconsmind-"], footer .footer-business-info [class*=" iconsmind-"] { display: block; float: left; font-size: 42px; } @media (max-width: 991px) { footer .footer-business-info [class^="iconsmind-"], footer .footer-business-info [class*=" iconsmind-"] { font-size: 25px; margin-top: 5px; } } footer .footer-business-wrapper { display: flex; flex-wrap: wrap; } footer .footer-business-wrapper>div { width: 28%; display: block; position: relative; margin-left: 5%; } @media (max-width: 991px) { footer .footer-business-wrapper>div { width: 100%; margin-left: 0; margin-bottom: 25px; } } footer .footer-business-title { font-size: 14px; font-weight: 700; width: calc(100% - 100px); text-transform: uppercase; display: block; margin-left: 20px; float: left; line-height: 1.4; margin-top: 3px; } footer .footer-business-content { display: block; float: left; margin-left: 20px; width: calc(100% - 100px); } footer .footer-business-address:after, footer .footer-business-phone:after { content: ''; display: block; width: 2px; height: 30px; background: rgba(255, 255, 255, 0.13); position: absolute; right: 0; top: 23px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 991px) { footer .footer-business-address:after, footer .footer-business-phone:after { display: none; } } footer .widget-title { font-size: 14px; font-weight: 700; margin-bottom: 20px; line-height: 20px; letter-spacing: 0; text-transform: uppercase; margin-top: 0; } @media (max-width: 991px) { footer .widget-title { margin-top: 25px; margin-bottom: 15px; } } footer .row { display: flex; flex-wrap: wrap; } footer .row .col { width: 25%; padding: 0 15px; } @media (max-width: 991px) { footer .row .col { width: 100%; } } footer .row p { font-size: 13px; } @media (max-width: 991px) { footer .row .content-wrap { text-align: center; } } footer .row .content-wrap.post-wrap { max-width: 100%; } @media (max-width: 991px) { footer .row .content-wrap.post-wrap ul { text-align: left; } } footer .footer-social-links li { display: inline-block; } footer .footer-social-links li i { margin-right: 10px; margin-top: 3px; } @media (max-width: 991px) { footer .footer-social-links li i { display: none; } } footer .post-image { width: 75px; height: 75px; background-size: cover; background-repeat: no-repeat; background-position: center center; display: inline-block; vertical-align: middle; } @media (max-width: 991px) { footer .post-wrap ul { display: inline-block; } } footer .post-wrap li { margin: 0 0 10px; } footer .post-wrap li span { display: inline-block; width: 60%; vertical-align: middle; margin-left: 7%; } @media (max-width: 1200px) { footer .post-wrap li span { width: 55%; } } footer .lower-footer { background-color: #1f1f1f; color: #ffffff; padding: 24px 0 25px; } @media (max-width: 991px) { footer .lower-footer { text-align: center; } } footer .lower-footer span { font-size: 13px; line-height: 25px; } footer .lower-footer .container { padding: 0 30px; } footer .lower-footer .container:after { display: block; content: ''; float: none; clear: both; } footer .lower-footer ul { margin-bottom: 0; } footer .lower-footer li { display: inline-block; } @media (max-width: 991px) { footer .lower-footer li { display: block; } } footer .lower-footer a { margin: 0; display: block; font-weight: 700; line-height: 25px; font-size: 13px; margin-left: 20px; } @media (max-width: 991px) { footer .lower-footer a { margin: 0; width: auto; display: inline-block; float: none; } } footer .lower-footer a:hover { color: #f1592a; } @media (max-width: 991px) { footer .lower-footer .pull-left { width: 100%; } } @media (max-width: 991px) { footer .lower-footer .pull-right { width: 100%; margin-top: 20px; } } .banner-slider-widget .item { position: relative; } .banner-slider-widget .slide-image { position: absolute; height: 100%; width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; } .banner-slider-widget .slide-content { height: 600px; position: relative; } @media (max-width: 960px) { .banner-slider-widget .slide-content { height: 225.55px; } } @media (max-width: 960px) { .banner-slider-widget .container { max-width: calc(90% + 30px); } } .banner-slider-widget .right-section-text { right: 0; position: absolute; top: 50%; -webkit-transform: translateY(-78%); -moz-transform: translateY(-78%); -ms-transform: translateY(-78%); -o-transform: translateY(-78%); transform: translateY(-78%); } @media (max-width: 960px) { .banner-slider-widget .right-section-text { position: relative; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: auto; } } .banner-slider-widget .right-section-text h1 { text-transform: uppercase; font-weight: 800; color: #ff6633; font-size: 42px; letter-spacing: -1px; } @media (max-width: 960px) { .banner-slider-widget .right-section-text h1 { font-size: 32px; margin-top: 10px; } } .banner-slider-widget .owl-nav { position: absolute; top: 50%; margin-top: -16px; width: 100%; } @media (max-width: 960px) { .banner-slider-widget .owl-nav { display: none; } } .banner-slider-widget .owl-nav .slider-prev, .banner-slider-widget .owl-nav .slider-next { position: absolute; top: 50%; margin-top: -16px; outline: 0; width: 32px; height: 32px; text-indent: -9999px; z-index: 9999; } .banner-slider-widget .owl-nav .slider-prev { left: 10px; background: url(../../src/images/controls.png) no-repeat 0 -32px; } .banner-slider-widget .owl-nav .slider-prev:hover, .banner-slider-widget .owl-nav .slider-prev:focus { background-position: 0 0; } .banner-slider-widget .owl-nav .slider-next { right: 10px; background: url(../../src/images/controls.png) no-repeat -43px -32px; } .banner-slider-widget .owl-nav .slider-next:hover, .banner-slider-widget .owl-nav .slider-next:focus { background-position: -43px 0; } .trust-elements { background-color: #f7f7f7; padding: 20px 0 80px; } @media (max-width: 960px) { .trust-elements .inner-container { padding: 0 15px; } } .trust-elements h2 { font-weight: 800; text-align: center; text-transform: uppercase; } .trust-elements h4 { text-align: center; } @media (max-width: 960px) { .trust-elements h4 { font-size: 16pt; } } .trust-elements .three-steps { width: 30%; margin: 0 auto; } @media (max-width: 960px) { .trust-elements .three-steps { width: 50%; } } @media (max-width: 560px) { .trust-elements .three-steps { width: 100%; } } .trust-elements .three-steps ul { text-align: center; } .trust-elements .three-steps ul li { display: inline-block; text-align: center; line-height: 30px; margin-bottom: 10px; padding-left: 35px; position: relative; } .trust-elements .three-steps ul li:before { content: "\F058"; color: #f1592a; padding-right: 20px; font-weight: bold; font-family: FontAwesome; font-size: 18px; text-rendering: auto; -webkit-font-smoothing: antialiased; position: absolute; left: 0; } .trust-elements .why-choose-campervan { margin-bottom: 85px; } .trust-elements .row { display: flex; flex-wrap: wrap; margin-bottom: 50px; } .trust-elements .row .col { width: 25%; padding: 0 15px; } @media (max-width: 768px) { .trust-elements .row .col { width: 100%; } } .trust-elements .row .col:after { content: ''; display: block; float: none; clear: both; } .trust-elements .row .col p { margin: 0 0 10px 80px; } @media (max-width: 1024px) { .trust-elements .row .col p { margin: 0; text-align: center; } } @media (max-width: 960px) { .trust-elements .row .col p { margin: 0 0 20px; } } .trust-elements .img-small-size { float: left; margin-right: 30px; margin-bottom: 0; width: 50px; height: 50px; margin-top: -15px; } @media (max-width: 1024px) { .trust-elements .img-small-size { float: none; margin: 0 auto 15px; text-align: center; } } .trust-elements .img-small-size img { width: auto; max-width: 50px; } .trust-elements .service-heading { margin-bottom: 10px; margin-top: 0; color: #2f2f2f; font-size: 16px; font-weight: 700; line-height: 1; text-transform: uppercase; text-align: left; } @media (max-width: 1024px) { .trust-elements .service-heading { text-align: center; } } @media (max-width: 960px) { .trust-elements .service-heading { font-size: 16pt; } } .testimonial-section { padding: 80px 0; } @media (max-width: 960px) { .testimonial-section { padding: 50px 0; } } .testimonial-section .headings { margin-bottom: 35px; } .testimonial-section .container { position: relative; } .testimonial-section .container:after { content: ""; width: 100%; height: 1px; background-color: #b2b2b2; position: absolute; bottom: -60px; } @media (max-width: 960px) { .testimonial-section .container .container-inner { padding: 0 15px; } } .testimonial-section .testimonial-cards { padding-bottom: 35px; } @media (max-width: 960px) { .testimonial-section .testimonial-cards { padding: 0 25px; } } @media (max-width: 960px) { .testimonial-section .section-heading { margin-top: 0; margin-bottom: 15px; font-size: 25px; letter-spacing: -0.3px; line-height: 30px; } } @media (max-width: 960px) { .testimonial-section .section-subheading { font-size: 14px; line-height: 24px; padding: 0 20px; } } .testimonial-cards .key-tcards { text-align: center; padding: 0 40px; } @media (max-width: 960px) { .testimonial-cards .key-tcards { padding: 0 5px; } } .with-overlay .testimonial-cards .tcards_header .tcards-job, .with-overlay .testimonial-cards .tcards_header .tcards-name { color: #fff; } .with-overlay .testimonial-cards .tcards_header .tcards-job, .with-overlay .testimonial-cards .tcards_header .tcards-name { color: #fff; } .testimonial-cards .tcards_header .tcards-name { font-size: 16px; font-weight: 700; line-height: 1; margin: 0; margin-bottom: 8px; margin-top: 20px; } .testimonial-cards .tcards_header .tcards-job { margin-bottom: 30px; display: block; font-style: normal; line-height: 1; color: inherit; } .testimonial-cards .tcards_header .tcards-image img { width: 70px; height: 70px; border-radius: 50%; background: #fff; margin: auto; border: 2px solid #fff; } .testimonial-cards .tcards_message { position: relative; border: none; border-radius: 0; padding: 35px; margin-top: 0; margin-bottom: 30px; background-color: white; } .testimonial-cards .owl-controls { text-align: center; margin-top: 20px; } .testimonial-cards.white-navigation .owl-controls .owl-prev, .testimonial-cards.white-navigation .owl-controls .owl-next { color: #FFF; } .testimonial-cards.black-navigation .owl-controls .owl-prev, .testimonial-cards.black-navigation .owl-controls .owl-next { color: #1F1F1F; } .testimonial-cards .tcards_message.author-bottom:before { bottom: -20px; top: auto; border-color: #fff transparent transparent transparent; } .testimonial-cards .tcards_message:before { content: ''; display: block; position: absolute; left: 50%; margin-left: -10px; width: 0; height: 0; border-style: solid; border-width: 10px; } .testimonial-cards .tcards_message:before { top: -20px; border-color: transparent transparent #fff transparent; } .testimonial-cards .tcards-title { text-transform: none; font-size: 16px; margin-top: 0; text-transform: uppercase; font-weight: 700; line-height: 22px; margin-bottom: 15px; } .testimonial-cards .owl-carousel .owl-item { -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-opacity: 0; -moz-opacity: 0; opacity: 0; } .testimonial-cards .owl-carousel .owl-item.active { -webkit-opacity: 1; -moz-opacity: 1; opacity: 1; } .new-tcards .fa-star { color: #FFA500; margin: 0 2.5px; } .testimonial-cards .tcards_message { background-color: #f7f7f7; } .testimonial-cards .owl-nav { text-align: center; margin-top: 20px; height: 30px; } .testimonial-cards .owl-nav button { border: 2px solid !important; } .testimonial-cards .owl-nav button:hover { background: #f1592a; color: #ffffff; border: 2px solid #f1592a !important; } .testimonial-cards .owl-nav .owl-prev { right: auto; left: 0; display: inline-block; zoom: 1; margin: 0; width: 30px; border: 2px solid; height: 30px; font-size: 0; margin: 0 3px; margin-top: 0; filter: Alpha(Opacity=30); opacity: 1; -webkit-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; } .testimonial-cards .owl-nav .owl-prev:before { content: "\F104"; display: block; font: normal normal normal 14px/1 FontAwesome; font-size: 15px; line-height: 26px; box-sizing: border-box; font-weight: bold; } .testimonial-cards .owl-nav .owl-prev span { font-size: 0; } .testimonial-cards .owl-nav .owl-next { right: auto; left: 0; display: inline-block; zoom: 1; margin: 0; width: 30px; border: 2px solid; height: 30px; font-size: 0; margin: 0 3px; margin-top: 0; filter: Alpha(Opacity=30); opacity: 1; -webkit-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; } .testimonial-cards .owl-nav .owl-next:before { content: "\F105"; display: block; font: normal normal normal 14px/1 FontAwesome; font-size: 15px; line-height: 26px; box-sizing: border-box; font-weight: bold; } .testimonial-cards .owl-nav .owl-next span { font-size: 0; } .shopper-approved-logo { text-align: right; margin-top: 20px; } .shopper-approved-logo img { width: auto; } .destinations-page .testimonial-section { padding: 0; } .destinations-page .testimonial-section .container:after { display: none; } .destinations-subpage .testimonial-section { padding-top: 0; padding-bottom: 40px; } .destinations-subpage .testimonial-section .container:after { display: none; } .destinations-subpage .testimonial-section .container .container-inner { border-top: 1px solid #ff6633; padding-top: 50px; } .rent-a-car { background-color: #f7f7f7; padding-bottom: 20px; } @media (max-width: 960px) { .rent-a-car>.container { padding: 0; } } .rent-a-car .check-availability-form { background-color: #f1592a; margin-top: -100px; padding-right: 35px; padding-bottom: 30px; padding-left: 35px; position: relative; z-index: 2; } @media (max-width: 991px) { .rent-a-car .check-availability-form { margin-top: 0; } } .rent-a-car .check-availability-form h2 { color: #ffffff; letter-spacing: -0.7px; text-align: center; text-transform: uppercase; margin-top: 0; margin-bottom: 30px; } .rent-a-car .form-inner { padding: 35px 15px 0; } .rent-a-car .form-wrap { display: flex; flex-wrap: wrap; } .rent-a-car select, .rent-a-car input[type=text] { width: 100%; box-sizing: border-box; min-width: 100%; background: #fff; box-shadow: none; letter-spacing: 0; outline: none; line-height: 50px; height: 50px; padding: 0 12px; text-align: left; color: #333; border: none; font-weight: 400; font-size: 15px; font-family: "Open Sans"; text-transform: none; margin: 0 0 5px; text-indent: 0.01px; cursor: pointer; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; } .rent-a-car .input-field { width: calc(20.6% - 5px); margin-right: 5px; position: relative; } @media (max-width: 1199px) { .rent-a-car .input-field { width: calc(20% - 5px); } } @media (max-width: 991px) { .rent-a-car .input-field { width: calc(16.6% - 5px); float: left; } } @media (max-width: 960px) { .rent-a-car .input-field { width: 100%; margin-right: 0; margin-bottom: 10px; } } .rent-a-car .custom-drop-down:after { height: 1em; line-height: 1; right: 15px; top: 42%; margin-top: -0.5em; color: #f1592a; content: "\F107"; font-family: "FontAwesome"; font-size: 20px; position: absolute; pointer-events: none; } .rent-a-car .custom-drop-down:hover:after { color: #24a9e2; } .rent-a-car .date-select:after { background: url(../../src/images/icon-calendar-sprite.png); width: 22px; height: 26px; transform: translateY(-50%); right: 12px; font-size: 0; top: 40%; background-color: #fff; background-position-x: 100%; line-height: 1; margin-top: -0.5em; content: "\F107"; font-family: "FontAwesome"; position: absolute; } .rent-a-car .date-select:hover:after { color: #24a9e2; background-position-x: 0; } .rent-a-car .availability-submit { background: transparent; color: #ffffff; text-align: center; border-radius: 0; min-width: 170px; font-size: 13px; font-weight: 900; margin: 0; display: table; text-transform: uppercase; box-sizing: border-box; outline: none; cursor: pointer; border: 2px solid #fff; height: 50px; line-height: 48px; width: 16.6%; margin-top: 0; font-family: "Open Sans"; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } @media (max-width: 960px) { .rent-a-car .availability-submit { width: 100%; } } .rent-a-car .availability-submit:hover { color: #24a9e2; background: #fff; } #range-form-overlay { background: #e5e5e5; border-bottom: 7px solid #f1592a; overflow: visible; padding: 24px; max-width: 1063px; width: 100%; cursor: default; } #range-form-overlay .rfs-slider-item { width: 315px; font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif; } #range-form-overlay .rfs-si-image-container { height: 190px; position: relative; overflow: visible; } #range-form-overlay .rfs-si-image-container .image { width: 100%; height: 100%; background-size: 100% 100%; background-position: center center; } #range-form-overlay .rfo-header h2 { font-size: 28px; font-weight: 800; color: #333333; text-transform: uppercase; margin-top: 0; } #range-form-overlay .rfo-header h3 { color: #f1592a; font-size: 20px; text-transform: uppercase; font-weight: normal; margin-top: 0; } #range-form-overlay .rfs-si-copy-container { text-align: center; min-height: 127px; } #range-form-overlay .rfs-si-copy-container h4 { color: #24a9e2; text-align: center; text-transform: uppercase; font-size: 16px; font-weight: 700; line-height: 16px; } #range-form-overlay .rfs-bottom-content-container { text-align: center; } #range-form-overlay .rfs-bottom-content-container * { display: inline-block; margin: 8px; width: auto; max-width: 100%; } #range-form-overlay .btn-container a { display: block; width: 90%; max-width: 230px; margin: 0 auto; background-color: #24a9e2; color: #fff; text-align: center; padding: 12px 8px; font-size: 16px; font-family: "Open Sans"; } #range-form-overlay .owl-nav { position: absolute; top: calc(50% - 15px); width: 100%; } #range-form-overlay .owl-nav .owl-prev { position: absolute; left: 0; } #range-form-overlay .owl-nav .owl-next { position: absolute; right: 0; } #range-form-overlay .owl-nav .fa { font-size: 30px; color: #f1592a; } @media (max-width: 1200px) { #range-form-overlay #our-range-slider-container { max-width: 90%; margin: 0 auto; } } #range-form-overlay button.fancybox-close-small { right: 15px !important; top: -15px !important; position: absolute; opacity: 1; padding: 0 !important; height: auto; width: auto; } #range-form-overlay button.fancybox-close-small svg { display: none; } #range-form-overlay .fancybox-close-small:after { background: #f1592a; border-radius: 0; color: #fff; top: 0; right: 0; content: "\D7"; position: relative; width: 30px; height: 30px; font: 20px/30px Arial, Helvetica Neue, Helvetica, sans-serif; font-weight: 300; text-align: center; transition: background-color .25s; box-sizing: border-box; z-index: 2; display: block; } #cv-rental-form { max-width: 1200px; border-bottom: 7px solid #f1592a; overflow: visible; background-color: #e5e5e5; font-family: "Open Sans"; padding: 0; } #cv-rental-form .form-wrap { max-height: 90vh; overflow: auto; padding: 24px; } #cv-rental-form .row { display: flex; flex-wrap: wrap; } #cv-rental-form .row .col { width: 50%; padding: 0 15px; } @media (max-width: 991px) { #cv-rental-form .row .col { width: 100%; } } #cv-rental-form .row .col.one-col { width: 100%; } #cv-rental-form .row .col.one-col label { font-weight: 700; color: #333333; } #cv-rental-form .head-section { min-height: 60px; } #cv-rental-form .head-section h1 { color: #333333; font-weight: 800; text-transform: uppercase; font-size: 28px; margin-bottom: 5px; margin-top: 0; } #cv-rental-form .head-section h2 { color: #f1592a; font-size: 20px; font-weight: lighter; margin-top: 0; } #cv-rental-form .input-field { display: block; position: relative; margin-bottom: 5px; } #cv-rental-form input[type="text"], #cv-rental-form input[type="email"], #cv-rental-form input[type="number"] { width: 100%; box-sizing: border-box; min-width: 100%; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; background: #fff !important; box-shadow: none; letter-spacing: 0; outline: none; line-height: 50px; height: 50px; padding: 0 12px; text-align: left; color: #333333; border: none; font-weight: normal; font-size: 15px; font-family: "Open Sans"; text-transform: none; } #cv-rental-form input[type="checkbox"] { margin: 4px 0 0; line-height: normal; box-sizing: border-box; padding: 0; -webkit-appearance: checkbox; } #cv-rental-form input[type="submit"] { max-width: 230px; margin: 0 auto; display: inline-block; float: none; background-color: #24a9e2; border: none !important; font-weight: bold; font-size: 16px; height: 50px; line-height: 48px; color: #fff; width: 100%; text-align: center; border-radius: 0; min-width: 170px; text-transform: uppercase; box-sizing: border-box; padding: 0 25px; outline: none; cursor: pointer; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } #cv-rental-form input[type="submit"]:hover { background: #fff; color: #f1592a; } #cv-rental-form input[type="submit"]:disabled { pointer-events: none; background: #aaa; opacity: 0.5; } #cv-rental-form select { width: 100%; box-sizing: border-box; min-width: 100%; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; background: #fff !important; box-shadow: none; letter-spacing: 0; outline: none; line-height: 50px; height: 50px; padding: 0 12px; text-align: left; color: #333333; border: none; font-weight: normal; font-size: 15px; font-family: "Open Sans"; text-transform: none; } #cv-rental-form textarea { letter-spacing: 0; border-radius: 0; box-shadow: none; outline: none; display: block; padding: 0 25px; font-size: 13px; font-weight: 900; text-shadow: none; background: #fff; resize: none; max-height: 120px; width: 100%; line-height: 18px; color: #333; margin: 0; text-align: left; padding-top: 15px; min-width: auto; border: none; display: block; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; font-family: inherit; font-size: inherit; font-weight: 400; } #cv-rental-form .custom-drop-down:after { height: 1em; line-height: 1; right: 15px; top: 42%; margin-top: -0.5em; color: #f1592a; content: "\F107"; font-family: "FontAwesome"; font-size: 20px; position: absolute; pointer-events: none; } #cv-rental-form .custom-drop-down:hover:after { color: #24a9e2; } #cv-rental-form .f-right-container { display: flex; flex-wrap: wrap; justify-content: space-between; } #cv-rental-form .f-right-container>div { width: 49.1%; } @media (max-width: 450px) { #cv-rental-form .f-right-container>div { width: 100%; } } #cv-rental-form .date-select:after { background: url(../../src/images/icon-calendar-sprite.png); width: 22px; height: 26px; transform: translateY(-50%); right: 12px; font-size: 0; top: 40%; background-color: #fff; background-position-x: 100%; line-height: 1; margin-top: -0.5em; content: "\F107"; font-family: "FontAwesome"; position: absolute; } #cv-rental-form .date-select:hover:after { color: #24a9e2; background-position-x: 0; } #cv-rental-form .checkbox { margin: 5px 0 10px; display: block; font-size: 16px; color: #999999; } #cv-rental-form .preview-container { background-color: #fff; margin-bottom: 10px; padding: 12px 15px; } #cv-rental-form .preview-container .img-container img { max-width: 280px; height: auto; margin: 0 auto; display: block; width: 95%; } #cv-rental-form .preview-container .title-container { text-align: center; } #cv-rental-form .preview-container h1 a { color: #24a9e2; font-size: 16px; text-align: center; text-transform: uppercase; } #cv-rental-form .preview-container .short-desc-container p { text-align: center; font-size: 16px; max-width: 400px; margin: 0 auto; } #cv-rental-form .bottom-container { text-align: center; padding: 15px 0 20px; } #cv-rental-form .bottom-container div { display: inline-block; } #cv-rental-form .bottom-container div img { width: auto; } #cv-rental-form .bottom-container div>* { margin: 0 6px; } #cv-rental-form button.fancybox-close-small { right: 15px !important; top: -15px !important; position: absolute; opacity: 1; padding: 0 !important; height: auto; width: auto; } #cv-rental-form button.fancybox-close-small:after { background: #f1592a; border-radius: 0; color: #fff; top: 0; right: 0; content: "\D7"; position: relative; width: 30px; height: 30px; font: 20px/30px Arial, Helvetica Neue, Helvetica, sans-serif; font-weight: 300; text-align: center; transition: background-color .25s; box-sizing: border-box; z-index: 2; display: block; } #cv-rental-form button.fancybox-close-small svg { display: none; } #cv-rental-form .submit-btn-wrap { text-align: center; } #cv-rental-form label { font-weight: 400; margin-bottom: 0; display: initial; } .our-range-single .rent-a-car, .our-range .rent-a-car, .destinations-page .rent-a-car { background-color: #fff; padding-bottom: 0; } .clients { padding: 35px 0; } .clients .inner-container { padding: 0 15px; } .clients .client-slider { margin: 38px auto; } .clients .client-item { position: relative; height: 72px; } .clients .client-item:after { content: ""; display: block; width: 2px; height: 28px; background: #dadada; position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 960px) { .clients .client-item:after { display: none; } } .clients .client-item img { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-height: 100%; width: auto; max-width: 100%; -webkit-filter: grayscale(100%); filter: grayscale(100%); display: block; margin: auto; -webkit-transition: 0.2s; -moz-transition: 0.2s; -ms-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; height: auto; cursor: pointer; } .clients .client-item img:hover { -webkit-filter: grayscale(0%); filter: grayscale(0%); } .default-banner { height: 500px; padding: 100px 0 60px; position: relative; display: flex; flex-wrap: wrap; align-items: center; } .default-banner .banner-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; } .default-banner .container { position: relative; z-index: 1; width: 100%; padding-bottom: 60px; color: #ffffff; } .default-banner .section-heading { color: #ff6633; max-width: 600px; margin: 0; font-size: 42px; letter-spacing: 1px; padding-left: 0; line-height: 50px; font-weight: 800; } @media (max-width: 500px) { .default-banner .section-heading { font-size: 35px; line-height: 37px; margin: 4px 0 10px; } } .default-banner .section-heading span { font-weight: 300; color: #ffffff; } .default-banner .section-subheading { margin: 15px 0 0 15px; text-align: left; max-width: 500px; } @media (max-width: 960px) { .default-banner .section-subheading { font-size: 14px; line-height: 24px; } } .default-banner.our-range-banner { background-color: #1f1f1f; } .default-banner.our-range-banner .inner-container { max-width: 620px; width: 100%; } .default-banner.our-range-banner .custom-breadcrumbs { color: #ffffff; font-size: 16px; } .default-banner.our-range-banner .custom-breadcrumbs a { color: #ffffff; font-weight: 700; margin-right: 5px; } .default-banner.our-range-banner .custom-breadcrumbs .fa { color: #ffffff; font-weight: 700; margin-right: 5px; } .default-banner.our-range-banner .custom-breadcrumbs .active-page { color: #cccccc; } .default-banner.our-range-banner h1 { color: #ffffff; font-size: 42px; font-weight: 400; text-transform: uppercase; margin-top: 10px; line-height: 57px; } .default-banner.our-range-banner p { margin-bottom: 10px; } .default-banner.our-range-banner .bottom-content-container * { margin: 0 10px; } .default-banner.our-range-banner .bottom-content-container *:first-of-type { margin-left: 0; } .default-banner.our-range-banner .bottom-content-container img { width: auto; } .default-banner.destination-banner .section-subheading { max-width: 480px; font-weight: 400; color: #ffffff; font-size: 14px; line-height: 24px; margin: 0; } .our-services-section { padding-bottom: 140px; } .our-services-section .container { position: relative; } .our-services-section .our-location-content { position: absolute; top: 45%; left: 65%; z-index: 2; max-width: 420px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media (max-width: 1440px) { .our-services-section .our-location-content { left: 75%; top: 35%; -webkit-transform: translate(-30%, -50%); -moz-transform: translate(-30%, -50%); -ms-transform: translate(-30%, -50%); -o-transform: translate(-30%, -50%); transform: translate(-30%, -50%); background: rgba(255, 255, 255, 0.7); padding: 0 30px; } } @media (max-width: 1200px) { .our-services-section .our-location-content { left: 30%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); padding: 0 20px; } } @media (max-width: 700px) { .our-services-section .our-location-content { left: 50%; max-width: 90%; width: 100%; } } .our-services-section .our-location-content h2 { text-align: left; text-transform: uppercase; font-weight: 800; color: #333333; } .our-services-section .our-location-content p { margin-bottom: 25px; } .our-services-section .hp-locations-parallax-container { min-height: 715px; background-repeat: no-repeat; background-size: cover; } .our-services-section .hp-locations-wrap { position: relative; z-index: 2; top: 550px; } @media (max-width: 1199px) { .our-services-section .hp-locations-wrap .container { max-width: 86%; } } @media (max-width: 480px) { .our-services-section .hp-locations-wrap .container { padding: 0; } } .our-services-section .services-slide .service-item { border: 3px solid #f1592a; position: relative; overflow: hidden; height: 308px; width: 413px; } @media (max-width: 480px) { .our-services-section .services-slide .service-item { width: 100%; } } .our-services-section .services-slide .slide-image { height: 100%; width: 100%; position: relative; background-repeat: no-repeat; background-size: cover; background-position: center center; } .our-services-section .services-slide .slide-content { position: absolute; bottom: 0; left: 0; width: 100%; background-color: rgba(0, 0, 0, 0.4); color: #fff; padding: 20px 27px; } .our-services-section .services-slide h4 { color: #fff; } .our-services-section .services-slide p { margin-bottom: 20px; } .our-services-section .inner-container { width: 1239px; margin: 0 auto; } @media (max-width: 1419px) { .our-services-section .inner-container { width: 826px; } } @media (max-width: 989px) { .our-services-section .inner-container { width: 413px; } } @media (max-width: 480px) { .our-services-section .inner-container { width: 100%; } } .our-services-section .custom-slide-buttons { position: absolute; top: 46%; left: 0; width: 100%; z-index: 1; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .our-services-section .custom-slide-buttons .prev-button { position: absolute; left: -72px; } @media (max-width: 1419px) { .our-services-section .custom-slide-buttons .prev-button { left: 105px; } } @media (max-width: 1199px) { .our-services-section .custom-slide-buttons .prev-button { left: 0; } } .our-services-section .custom-slide-buttons .next-button { position: absolute; right: -72px; } @media (max-width: 1419px) { .our-services-section .custom-slide-buttons .next-button { right: 105px; } } @media (max-width: 1199px) { .our-services-section .custom-slide-buttons .next-button { right: 0; } } .our-services-section .custom-slide-buttons a { line-height: 50px; width: 50px; height: 50px; text-align: center; background: #b1b1b1; color: #fff; font-size: 30px; } .our-services-section .custom-slide-buttons i { color: #ffffff; } .campervan-listing { padding-bottom: 40px; } .campervan-listing .inner-container { padding: 0 15px; } @media (max-width: 900px) { .campervan-listing .inner-container { padding: 0; } } .campervan-listing .clc-inner { width: 80%; margin: 50px auto; position: relative; display: flex; flex-wrap: wrap; } @media (max-width: 991px) { .campervan-listing .clc-inner { display: block; text-align: center; width: 100%; } } .campervan-listing .clc-inner:before { content: ''; width: 100%; height: 1px; position: absolute; top: -25px; background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(31, 31, 31, 0.5), rgba(255, 255, 255, 0)); left: 0; } .campervan-listing .clc-inner .btn { -webkit-transition: 0.3s all ease; -moz-transition: 0.3s all ease; -ms-transition: 0.3s all ease; -o-transition: 0.3s all ease; transition: 0.3s all ease; display: inline-block; border: 1px solid rgba(255, 255, 255, 0.3); background-color: #24a9e2; text-align: center; color: #ffffff; border-radius: 0; padding: 10px 20px; font-size: 16px; width: 16.6667%; } @media (max-width: 991px) { .campervan-listing .clc-inner .btn { width: auto; margin: 2px 0; } } .campervan-listing .active-filter .btn { background-color: #ccc; } .campervan-listing .active-filter .btn.active { background-color: #24a9e2; } .campervan-listing .campervan-list { text-align: center; } .campervan-listing .our-range--item { display: inline-block; vertical-align: top; padding: 10px 15px; margin-bottom: 30px; -webkit-transition: 0.3s all ease; -moz-transition: 0.3s all ease; -ms-transition: 0.3s all ease; -o-transition: 0.3s all ease; transition: 0.3s all ease; max-width: 400px; width: 100%; } @media (max-width: 900px) { .campervan-listing .our-range--item { max-width: 350px; } } .campervan-listing .our-range--item .ori-image-container { display: block; height: 208px; background-size: 100% auto; background-repeat: no-repeat; background-position: center center; } .campervan-listing .ori-copy-container a { color: #24a9e2; font-size: 18px; font-weight: 700; } .campervan-listing .bottom-content-container { margin: 10px 0 15px; } .campervan-listing .bottom-content-container * { margin: 8px; } .campervan-listing .bottom-content-container img { width: auto; } .campervan-listing .ori-button-container a { display: inline-block; background-color: #24a9e2; color: #ffffff; padding: 12px 23px; font-size: 13px; font-weight: 700; text-transform: uppercase; } .our-range-single-content .inner-container { position: relative; padding: 70px 0 90px; } .our-range-single-content .inner-container:after { content: ""; width: 100%; position: absolute; bottom: 0; height: 1px; background: #f1592a; left: 0; } .our-range-single-content .row { display: flex; flex-wrap: wrap; } .our-range-single-content .row .col { width: 100%; padding: 0 15px; } @media (max-width: 991px) { .our-range-single-content .row .col { padding: 0; } } .our-range-single-content .row .col-one { max-width: 58.33%; } @media (max-width: 991px) { .our-range-single-content .row .col-one { max-width: 100%; } } .our-range-single-content .row .col-two { max-width: 41.66%; } @media (max-width: 991px) { .our-range-single-content .row .col-two { max-width: 100%; } } .our-range-single-content h2 { margin-top: 0; margin-bottom: 10px; text-transform: uppercase; font-weight: 800; } .our-range-single-content h2.specs-heading { font-size: 18px; } .our-range-single-content p { margin-bottom: 20px; } .our-range-single-content .enquire-button-container a { display: inline-block; padding: 15px 40px; background: #24a9e2; color: #ffffff; font-weight: 700; font-size: 16px; text-transform: uppercase; } @media (max-width: 991px) { .our-range-single-content .enquire-button-container a { margin-bottom: 35px; } } .our-range-single-content .gallery-container { width: 100%; max-width: 485px; margin: 0 auto; } .our-range-single-content .gallery-container .gallery-item { margin-bottom: 2%; } .our-range-single-content .gallery-container .gallery-item:after { content: ''; display: block; clear: both; float: none; } .our-range-single-content .gallery-container .gallery-item:not(:first-of-type) { width: 32%; float: left; height: 125px; position: relative; overflow: hidden; } .our-range-single-content .gallery-container .gallery-item:not(:first-of-type) img { position: absolute; width: auto; height: 100%; max-width: none; max-height: 100%; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .our-range-single-content .gallery-container .gallery-item:nth-of-type(3n) { margin: 0 2%; } .destination-listing { margin: 0 0 50px; } .destination-listing .container { padding: 0 15px 70px; border-bottom: 1px solid #f1592a; } .destination-listing .container-inner { padding: 0 15px; } .destination-listing .destination-heading h2 { margin-top: 50px; text-align: center; line-height: 45px; font-weight: 800; } .destination-listing .tab-list { text-align: center; padding: 15px 0 50px; border-bottom: 1px solid #f1592a; } @media (max-width: 768px) { .destination-listing .tab-list { display: none; } } .destination-listing .tab-list .tab-item { padding: 5px 0; flex-grow: 1; flex-basis: 0; text-align: center; display: inline-block; } @media (max-width: 960px) { .destination-listing .tab-list .tab-item { display: block; } } .destination-listing .tab-list .tab-item:last-of-type a { border-right: 0; } .destination-listing .tab-list .active-tab a { font-weight: 700; color: #f1592a; } .destination-listing .tab-list a { height: auto; width: auto; font-weight: normal; font-size: 16px; border-right: 1px solid #8a8a8a; line-height: 18px; color: #2f2f2f; padding: 0 10px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } @media (max-width: 960px) { .destination-listing .tab-list a { border-right: 0; display: block; } } .destination-listing .tab-contents { position: relative; margin-top: 50px; } .destination-listing .tab-contents .tab-content { position: absolute; opacity: 0; visibility: hidden; } @media (max-width: 768px) { .destination-listing .tab-contents .tab-content { position: relative; opacity: 1; visibility: visible; } } .destination-listing .tab-contents .tab-content.active-content { position: relative; z-index: 1; opacity: 1; visibility: visible; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -ms-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .destination-listing .tab-contents .row { display: flex; flex-wrap: wrap; } .destination-listing .tab-contents .col { width: 50%; padding: 0 15px; margin-bottom: 35px; } @media (max-width: 768px) { .destination-listing .tab-contents .col { width: 100%; } } .destination-listing .tab-contents .col:last-of-type { text-align: right; } @media (max-width: 768px) { .destination-listing .tab-contents .col:last-of-type { text-align: center; } } .destination-listing .tab-contents img { width: auto; } .destination-listing .tab-contents h2 { margin: 0 0 5px; text-transform: uppercase; line-height: 45px; font-weight: 800; } .destination-listing .tab-contents p { margin-bottom: 20px; } .destination-listing .tab-contents p:last-of-type { margin-bottom: 0; } .destination-listing .tab-contents .btn-link { color: #ff6633; font-weight: 700; font-size: 16px; position: relative; text-decoration: none; padding: 6px 12px 6px 25px; margin-left: 15px; } .destination-listing .tab-contents .btn-link:before { content: '\F138'; font-family: FontAwesome; position: absolute; left: -5px; } @media (max-width: 768px) { .destination-listing .active-content .tab-heading a { background: #f1592a; color: #fff; font-weight: 700; } } @media (max-width: 768px) { .destination-listing .active-content .tab-body { display: block; } } .destination-listing .tab-heading { display: none; border: 1px solid #f0f0f0; background-color: #f8f8f8; } .destination-listing .tab-heading a { color: #666; display: block; padding: 14px 20px; box-sizing: border-box; text-decoration: none; position: relative; -webkit-transition: color 0.2s ease-in-out; -moz-transition: color 0.2s ease-in-out; -ms-transition: color 0.2s ease-in-out; -o-transition: color 0.2s ease-in-out; transition: color 0.2s ease-in-out; box-shadow: none; font-size: 16px; vertical-align: middle; line-height: 25px; text-align: center; } @media (max-width: 768px) { .destination-listing .tab-heading { display: block; } } @media (max-width: 768px) { .destination-listing .tab-body { display: none; border: 1px solid #f0f0f0; } } .destination-content { margin-top: 80px; margin-bottom: 110px; } .destination-content .container-inner { padding: 0 15px; } .destination-content .accordion-heading h4 { position: relative; font-size: 14px; color: #2f2f2f; line-height: 1; font-weight: 400; } .destination-content .accordion-heading h4:after { content: "\F106"; position: absolute; right: 2%; top: 50%; font-family: FontAwesome; -webkit-transform: translateY(-50%) rotate(180deg); -moz-transform: translateY(-50%) rotate(180deg); -ms-transform: translateY(-50%) rotate(180deg); -o-transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg); -webkit-transition: 0.3s all ease; -moz-transition: 0.3s all ease; -ms-transition: 0.3s all ease; -o-transition: 0.3s all ease; transition: 0.3s all ease; pointer-events: none; } .destination-content .accordion-heading a { display: block; color: #ff6633; font-size: 18px; font-weight: 800; padding: 5px 0; line-height: 25px; text-transform: uppercase; } .destination-content .accordion-body { display: none; padding: 14px 5px 14px 0; } .destination-content .accordion-body p { margin-bottom: 20px; } .destination-content .accordion-body ul { margin-bottom: 0; } .destination-content .accordion-body ul li { position: relative; margin-bottom: 10px; line-height: 25px; padding-left: 25px; } .destination-content .accordion-body ul li:last-of-type { margin-bottom: 0; } .destination-content .accordion-body ul li:before { content: ""; background: #f1592a; width: 9px; height: 9px; padding: 0; top: 7px; left: 0; border-radius: 100%; display: block; position: absolute; } .destination-content .accordion-item.active-accordion .accordion-heading h4:after { -webkit-transform: translateY(-50%) rotate(0deg); -moz-transform: translateY(-50%) rotate(0deg); -ms-transform: translateY(-50%) rotate(0deg); -o-transform: translateY(-50%) rotate(0deg); transform: translateY(-50%) rotate(0deg); } .destination-content .alignleft { float: left; margin: 5px 20px 20px 0; } .destination-content img { width: auto; height: auto; } .blog-single-content { padding: 60px 0 100px; } @media (max-width: 960px) { .blog-single-content { padding: 25px 0 0; } } .blog-single-content .row { display: flex; flex-wrap: wrap; } .blog-single-content .row .col { padding: 0 15px; } .blog-single-content .row .col-one { width: 75%; } @media (max-width: 991px) { .blog-single-content .row .col-one { width: 100%; } } .blog-single-content .row .col-one .col-wrap { border-bottom: 1px solid rgba(0, 0, 0, 0.1); margin-right: 10px; margin-bottom: 47px; padding-bottom: 40px; } @media (max-width: 960px) { .blog-single-content .row .col-one .col-wrap { margin-right: 0; } } .blog-single-content .row .col-two { width: 25%; } @media (max-width: 991px) { .blog-single-content .row .col-two { width: 100%; } } .blog-single-content .blog-single-title { font-weight: 900; font-size: 34px; letter-spacing: -1px; text-align: left; margin-top: 0; line-height: 1; margin-bottom: 18px; } @media (max-width: 960px) { .blog-single-content .blog-single-title { font-size: 18px; line-height: 30px; margin-bottom: 18px; margin-top: 5px; } } .blog-single-content .entry-meta { width: 100%; margin-bottom: 22px; color: inherit; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; font-size: 13px; font-weight: 400; padding-top: 0; line-height: 1.3; margin-top: 0; } .blog-single-content .entry-meta .fa { margin-right: 8px; font-size: 14px; color: #f1592a; } .blog-single-content .entry-meta .published, .blog-single-content .entry-meta .author { padding-right: 15px; position: relative; } .blog-single-content .entry-meta .published:before, .blog-single-content .entry-meta .author:before { content: ''; width: 1px; height: 12px; background: rgba(0, 0, 0, 0.15); position: absolute; right: 0; top: 2px; } .blog-single-content .entry-meta span { margin-right: 15px; } @media (max-width: 960px) { .blog-single-content .entry-meta span { float: left; width: auto; font-weight: bold; line-height: 1; margin-bottom: 8px; } } .blog-single-content .entry-meta a { color: inherit; font-weight: inherit; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; } .blog-single-content img { margin-bottom: 25px; width: auto; } .blog-single-content p { margin-bottom: 25px; overflow-wrap: initial; } .blog-single-content h1 { text-align: left; font-size: 42px; line-height: 50px; margin-bottom: 25px; margin-top: 25px; } .blog-single-content h2 { text-align: left; font-size: 35px; line-height: 35px; margin-bottom: 25px; margin-top: 25px; } .blog-single-content h3 { text-align: left; font-size: 25px; line-height: 25px; margin-bottom: 25px; margin-top: 25px; } .blog-single-content blockquote { margin: 20px 0; font-size: inherit; font-style: normal; border-left-width: 2px; float: left; width: 100%; margin-top: 0; } .blog-single-content blockquote p { margin-bottom: 0; } .blog-single-content table { border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; margin-bottom: 25px; } .blog-single-content td, .blog-single-content th { border-top: 1px solid #e6e6e6; border-left: 1px solid #e6e6e6; padding: 10px; } .blog-single-content dl { margin: 0; } .blog-single-content dd { margin: 0 0 20px; } .blog-single-content ul { margin-bottom: 25px; padding-left: 40px; } .blog-single-content li { list-style-type: none; font-size: 14px; line-height: 25px; } .blog-listing-content { padding: 60px 0 100px; } @media (max-width: 960px) { .blog-listing-content { padding: 25px 0 0; } } .blog-listing-content .row { display: flex; flex-wrap: wrap; } .blog-listing-content .row .col { padding: 0 15px; } .blog-listing-content .row .col-one { width: 75%; } @media (max-width: 991px) { .blog-listing-content .row .col-one { width: 100%; } } .blog-listing-content .row .col-one .col-wrap { margin-right: 10px; margin-bottom: 47px; } @media (max-width: 960px) { .blog-listing-content .row .col-one .col-wrap { margin-right: 0; } } .blog-listing-content .row .col-two { width: 25%; } @media (max-width: 991px) { .blog-listing-content .row .col-two { width: 100%; } } .blog-listing-content .blog-single-title { font-weight: 900; margin-bottom: 20px; font-size: 22px; text-align: left; margin-top: 0; line-height: 1; } @media (max-width: 960px) { .blog-listing-content .blog-single-title { font-size: 18px; line-height: 30px; margin-bottom: 18px; margin-top: 5px; } } .blog-listing-content .entry-meta { width: 100%; margin-bottom: 22px; color: inherit; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; font-size: 13px; font-weight: 400; padding-top: 0; line-height: 1.3; margin-top: 0; } .blog-listing-content .entry-meta .fa { margin-right: 8px; font-size: 14px; color: #f1592a; } .blog-listing-content .entry-meta .published, .blog-listing-content .entry-meta .author { padding-right: 15px; position: relative; } .blog-listing-content .entry-meta .published:before, .blog-listing-content .entry-meta .author:before { content: ''; width: 1px; height: 12px; background: rgba(0, 0, 0, 0.15); position: absolute; right: 0; top: 2px; } .blog-listing-content .entry-meta span { margin-right: 15px; } @media (max-width: 960px) { .blog-listing-content .entry-meta span { float: left; width: auto; font-weight: bold; line-height: 1; margin-bottom: 8px; } } .blog-listing-content .entry-meta a { color: inherit; font-weight: inherit; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; } .blog-listing-content .entry-meta .comment-count { float: right; margin-right: 0; } @media (max-width: 960px) { .blog-listing-content .entry-meta .comment-count { float: left; } } .blog-listing-content .entry-meta:after { content: ''; clear: both; float: none; display: block; } .blog-listing-content img { margin-bottom: 25px; width: auto; } .blog-listing-content p { margin-bottom: 25px; overflow-wrap: initial; } .blog-listing-content h1 { text-align: left; font-size: 42px; line-height: 50px; margin-bottom: 25px; margin-top: 25px; } .blog-listing-content h2 { text-align: left; font-size: 35px; line-height: 35px; margin-bottom: 25px; margin-top: 25px; } .blog-listing-content h3 { text-align: left; font-size: 25px; line-height: 25px; margin-bottom: 25px; margin-top: 25px; } .blog-listing-content blockquote { margin: 20px 0; font-size: inherit; font-style: normal; border-left-width: 2px; float: left; width: 100%; margin-top: 0; } .blog-listing-content blockquote p { margin-bottom: 0; } .blog-listing-content table { border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; margin-bottom: 25px; } .blog-listing-content td, .blog-listing-content th { border-top: 1px solid #e6e6e6; border-left: 1px solid #e6e6e6; padding: 10px; } .blog-listing-content dl { margin: 0; } .blog-listing-content dd { margin: 0 0 20px; } .blog-listing-content ul { margin-bottom: 25px; padding-left: 40px; } .blog-listing-content li { list-style-type: none; font-size: 14px; line-height: 25px; } .blog-listing-content .tt_button { border: 2px solid #f1592a; background: #f1592a; text-align: center; min-width: 170px; font-size: 13px; font-weight: 900; color: #fff; padding: 17px 25px; display: table; text-transform: uppercase; box-sizing: border-box; line-height: 1; cursor: pointer; -webkit-transition: 0.3s !important; -moz-transition: 0.3s !important; -ms-transition: 0.3s !important; -o-transition: 0.3s !important; transition: 0.3s !important; } .blog-listing-content .tt_button:hover { color: #f1592a; background: transparent; } .blog-listing-content .tt_button:hover .fa { color: #f1592a; } .blog-listing-content .tt_button .fa { color: #fff; margin-left: 10px; font-size: 12px; -webkit-transition: 0.25s; -o-transition: 0.25s; transition: 0.25s; } .blog-listing-content .more-link { display: none; } .blog-listing-content .post-wrap:not(:last-of-type) { margin-bottom: 47px; padding-bottom: 50px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } @media (max-width: 960px) { .blog-listing-content .post-wrap:not(:last-of-type) { margin-bottom: 15px; padding-bottom: 45px; padding-top: 15px; } } .no-result { padding: 100px 0 50px; height: 100vh; } .no-result h2 { margin: 0 auto 10px; letter-spacing: -0.7px; max-width: 600px; color: #2f2f2f; font-weight: 700; font-family: Open Sans; font-size: 28px; text-align: center; line-height: 34px; } .no-result p { font-size: 18px; max-width: 420px; font-weight: 300; margin: 10px auto 50px; text-align: center; } .no-result .searchform { width: 80%; max-width: 320px; margin: auto; } .contact-us-content { padding-bottom: 50px; } .contact-us-content .container-inner { padding: 0 15px; } @media (max-width: 960px) { .contact-us-content .container-inner { padding: 0; } } .contact-us-content .row { display: flex; flex-wrap: wrap; } .contact-us-content .row .col { padding: 35px 15px 0; width: 50%; } @media (max-width: 960px) { .contact-us-content .row .col { width: 100%; } } .contact-us-content h2 { font-weight: 800; line-height: 45px; margin: 25px 0 5px; text-transform: uppercase; } .contact-us-content p { margin-bottom: 20px; } .contact-us-content .cgit-list li { position: relative; font-size: 16px; font-weight: bold; padding-left: 60px; text-transform: uppercase; line-height: 25px; margin-bottom: 20px; text-align: left; } .contact-us-content .cgit-list li:before { color: #f1592a; font-family: 'iconsmind'; speak: none; font-style: normal; font-variant: normal; text-transform: none; line-height: 1; font-weight: bold; font-size: 40px; position: absolute; top: 50%; left: 0px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .contact-us-content .cgit-list li.cgit-phone:before { content: "\ED27"; } .contact-us-content .cgit-list li.cgit-address:before { content: "\EA99"; } .contact-us-content .cgit-list li a { font-size: 14px; color: #333333; font-weight: normal; display: block; text-transform: none; } .contact-us-content .cgit-list li p { font-size: 14px; color: #333333; font-weight: normal; display: block; text-transform: none; } .contact-us-content .wpcf7-form-control-wrap { position: relative; margin-bottom: 0; width: 100%; display: inline-block; } .contact-us-content input:not([type=submit]):not([type=checkbox]) { background-color: #edeae8 !important; font-weight: normal !important; margin-bottom: 4px; font-size: 16px !important; height: 45px; width: 100%; box-sizing: border-box; min-width: 100%; box-shadow: none; letter-spacing: 0; outline: none; line-height: 50px; padding: 0 12px; text-align: left; color: #333; border: none; font-family: "Open Sans", sans-serif; text-transform: none; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; } .contact-us-content input:not([type=submit]):not([type=checkbox])::-webkit-input-placeholder { color: #999; } .contact-us-content input:not([type=submit]):not([type=checkbox])::-moz-placeholder { color: #999; } .contact-us-content input:not([type=submit]):not([type=checkbox]):-ms-input-placeholder { color: #999; } .contact-us-content input:not([type=submit]):not([type=checkbox]):-moz-placeholder { color: #999; } .contact-us-content input[type=checkbox] { background-color: #edeae8 !important; font-weight: normal !important; margin-bottom: 4px; font-size: 16px !important; display: inline-block; background-color: #edeae8 !important; font-weight: normal !important; margin-bottom: 4px; font-size: 16px !important; margin: 4px 0 0; line-height: normal; box-sizing: border-box; padding: 0; } .contact-us-content textarea { background-color: #edeae8 !important; font-weight: normal !important; margin-bottom: 4px; font-size: 16px !important; letter-spacing: 0; border-radius: 0; box-shadow: none; outline: none; padding: 0 25px; text-shadow: none; background: #fff; resize: none; max-height: 120px; width: 100%; line-height: 18px; color: #333; margin: 0; text-align: left; padding-top: 15px; min-width: auto; border: none; display: block; overflow: auto; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; } .contact-us-content textarea::-webkit-input-placeholder { color: #999; } .contact-us-content textarea::-moz-placeholder { color: #999; } .contact-us-content textarea:-ms-input-placeholder { color: #999; } .contact-us-content textarea:-moz-placeholder { color: #999; } .contact-us-content #cbxReceiveLatestNews .wpcf7-list-item-label { display: inline-block; width: 91%; vertical-align: top; margin-left: 10px; font-weight: normal; color: #999999 !important; } .contact-us-content #btnSendEnquiry { background: #24a9e2 !important; display: block; width: auto; font-weight: 700; font-size: 16px; padding: 0px 40px; height: auto; margin-bottom: 25px; color: #fff; margin-top: 5px; border: 2px solid #fff !important; -webkit-transition: 0.3s !important; -moz-transition: 0.3s !important; -ms-transition: 0.3s !important; -o-transition: 0.3s !important; transition: 0.3s !important; border-radius: 0; min-width: 170px; text-transform: uppercase; box-sizing: border-box; outline: none; cursor: pointer; line-height: 48px; } .contact-us-content span.wpcf7-not-valid-tip { position: absolute; top: 0; left: 0; height: 45px; width: 100%; margin: 0; z-index: 10; border: 2px solid #ea1a22; padding-left: 20px; background: #fff !important; text-transform: capitalize; color: #ea1a22; font-weight: bold; border-radius: 0; line-height: 45px; cursor: pointer; } @media (max-width: 991px) { .contact-us-content span.wpcf7-not-valid-tip { font-size: 11px; } } .contact-us-content span.wpcf7-not-valid-tip:before { font: normal normal normal 17px/1 FontAwesome; content: "\F00D"; position: absolute; right: 19px; top: 12px; color: #ea1a22; font-size: 15px; } .contact-us-content .wpcf7-spinner { display: none !important; } #map { height: 500px; width: 100%; } .content-page { padding-bottom: 75px; } .content-page .content-banner { background: #1f1f1f; padding: 100px 0px 66px 0; margin-bottom: 60px; } .content-page .content-banner h1 { margin: 0; text-transform: uppercase; max-width: 600px; font-size: 42px; letter-spacing: 1px; padding-left: 0; line-height: 50px; } .content-page .content-banner h1 span { font-weight: 300; color: #ffffff; } .content-page .container-inner { padding: 0 15px; } @media (max-width: 960px) { .content-page .container-inner { padding: 0; } } .content-page .content-section h2 { font-size: 28px !important; text-transform: uppercase; font-weight: 800; margin-bottom: 5px !important; text-align: left; line-height: 45px; margin-top: 25px; } .content-page p { margin-bottom: 20px; } .our-range-slider { padding: 80px 0; } @media (max-width: 960px) { .our-range-slider { padding: 50px 0; } } .our-range-slider>.container { position: relative; } .our-range-slider>.container:after { width: 100%; content: ""; height: 1px; background: #f1592a; position: absolute; bottom: -14%; } @media (max-width: 960px) { .our-range-slider>.container:after { bottom: -4%; } } .our-range-slider .section-heading { margin: auto; margin-top: 0; margin-bottom: 10px; letter-spacing: -0.7px; max-width: 600px; color: #2f2f2f; font-weight: 700; font-family: Open Sans; font-size: 28px; text-align: center; line-height: 34px; } .our-range-slider .section-subheading { margin: auto; margin-bottom: 50px; text-transform: none; text-align: center; margin-top: 10px; max-width: 650px; font-weight: 300; font-size: 18px; } .our-range-slider .our-range-carousel { max-width: 1050px; margin: 0 auto; } @media (max-width: 1200px) { .our-range-slider .our-range-carousel { max-width: 90%; } } .our-range-slider .our-range-carousel .item { width: 350px; } @media (max-width: 418px) { .our-range-slider .our-range-carousel .item { width: 100%; } } .our-range-slider .our-range-carousel .rfs-si-image-container { height: 208px; position: relative; overflow: visible; } .our-range-slider .our-range-carousel .rfs-si-image-container .image { width: 100%; height: 100%; background-size: contain; background-position: center center; background-repeat: no-repeat; } .our-range-slider .our-range-carousel .rfo-header h2 { font-size: 28px; font-weight: 800; color: #333333; text-transform: uppercase; margin-top: 0; } .our-range-slider .our-range-carousel .rfo-header h3 { color: #f1592a; font-size: 20px; text-transform: uppercase; font-weight: normal; margin-top: 0; } .our-range-slider .our-range-carousel .rfs-si-copy-container { text-align: center; } .our-range-slider .our-range-carousel .rfs-si-copy-container h4 { color: #24a9e2; text-align: center; font-size: 18px; font-weight: 700; line-height: 28px; } .our-range-slider .our-range-carousel .rfs-si-copy-container h4:hover { color: #f1592a; } .our-range-slider .our-range-carousel .rfs-bottom-content-container { text-align: center; font-size: 13px; margin-top: 10px; } .our-range-slider .our-range-carousel .rfs-bottom-content-container img { display: inline-block; margin: 0 5px; width: auto; } .our-range-slider .our-range-carousel .btn-container a { display: block; width: 90%; max-width: 230px; margin: 0 auto; background-color: #24a9e2; color: #fff; text-align: center; padding: 12px 8px; font-size: 16px; font-family: "Open Sans"; } .our-range-slider .our-range-carousel .owl-nav { position: absolute; bottom: 200px; width: 100%; } .our-range-slider .our-range-carousel .owl-nav i { background-color: #cccccc; color: #fff; padding: 10px 19.7px; font-size: 30px; } .our-range-slider .our-range-carousel .owl-nav .owl-prev { position: absolute; left: -95px; } @media (max-width: 1199px) { .our-range-slider .our-range-carousel .owl-nav .owl-prev { left: -60px; } } @media (max-width: 992px) { .our-range-slider .our-range-carousel .owl-nav .owl-prev { left: -50px; } } @media (max-width: 400px) { .our-range-slider .our-range-carousel .owl-nav .owl-prev { left: -34px; } } .our-range-slider .our-range-carousel .owl-nav .owl-next { position: absolute; right: -95px; } @media (max-width: 1199px) { .our-range-slider .our-range-carousel .owl-nav .owl-next { right: -60px; } } @media (max-width: 992px) { .our-range-slider .our-range-carousel .owl-nav .owl-next { right: -50px; } } @media (max-width: 400px) { .our-range-slider .our-range-carousel .owl-nav .owl-next { right: -34px; } } @media (max-width: 1200px) { .our-range-slider .our-range-carousel #our-range-slider-container { max-width: 90%; margin: 0 auto; } } .contact-us-content form.wpcf7-form.submitting input#btnSendEnquiry { pointer-events: none; background: #aaa; opacity: 0.5; }