@charset "utf-8";

* {

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}

*:before,

*:after {

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}

html {

    font-family: sans-serif;

    /* 1 */

    

    -ms-text-size-adjust: 100%;

    /* 2 */

    

    -webkit-text-size-adjust: 100%;

    /* 2 */

}

/**

 * Remove default margin.

 */



ul {

    list-style: none;

}

a {

    text-decoration: none;

}

/* HTML5 display definitions

   ========================================================================== */

/**

 * Correct `block` display not defined for any HTML5 element in IE 8/9.

 * Correct `block` display not defined for `details` or `summary` in IE 10/11

 * and Firefox.

 * Correct `block` display not defined for `main` in IE 11.

 */



article,

aside,

details,

figcaption,

figure,

footer,

header,

hgroup,

main,

menu,

nav,

section,

summary {

    display: block;

}

/**

 * 1. Correct `inline-block` display not defined in IE 8/9.

 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.

 */



audio,

canvas,

progress,

video {

    display: inline-block;

    /* 1 */

    

    vertical-align: baseline;

    /* 2 */

}

/**

 * Prevent modern browsers from displaying `audio` without controls.

 * Remove excess height in iOS 5 devices.

 */



audio:not([controls]) {

    display: none;

    height: 0;

}

/**

 * Address `[hidden]` styling not present in IE 8/9/10.

 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.

 */



[hidden],

template {

    display: none;

}

/* Links

   ========================================================================== */

/**

 * Remove the gray background color from active links in IE 10.

 */



a {

    background-color: transparent;

}

/**

 * Improve readability of focused elements when they are also in an

 * active/hover state.

 */



a:active,

a:hover {

    outline: 0;

}

/* Text-level semantics

   ========================================================================== */

/**

 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.

 */



abbr[title] {

    border-bottom: 1px dotted;

}

/**

 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.

 */



b,

strong {

    font-weight: bold;

}

/**

 * Address styling not present in Safari and Chrome.

 */



dfn {

    font-style: italic;

}

/**

 * Address variable `h1` font-size and margin within `section` and `article`

 * contexts in Firefox 4+, Safari, and Chrome.

 */



h1 {

    font-size: 2em;

    margin: 0.67em 0;

}

/**

 * Address styling not present in IE 8/9.

 */



mark {

    background: #ff0;

    color: #000;

}

/**

 * Address inconsistent and variable font size in all browsers.

 */



small {

    font-size: 80%;

}

/**

 * Prevent `sub` and `sup` affecting `line-height` in all browsers.

 */



sub,

sup {

    font-size: 75%;

    line-height: 0;

    position: relative;

    vertical-align: baseline;

}

sup {

    top: -0.5em;

}

sub {

    bottom: -0.25em;

}

/* Embedded content

   ========================================================================== */

/**

 * Remove border when inside `a` element in IE 8/9/10.

 */



img {

    border: 0;

}

/**

 * Correct overflow not hidden in IE 9/10/11.

 */



svg:not(:root) {

    overflow: hidden;

}

/* Grouping content

   ========================================================================== */

/**

 * Address margin not present in IE 8/9 and Safari.

 */



figure {

    margin: 1em 40px;

}

/**

 * Address differences between Firefox and other browsers.

 */



hr {

    box-sizing: content-box;

    height: 0;

}

/**

 * Contain overflow in all browsers.

 */



pre {

    overflow: auto;

}

/**

 * Address odd `em`-unit font size rendering in all browsers.

 */



code,

kbd,

pre,

samp {

    font-family: monospace, monospace;

    font-size: 1em;

}

/* Forms

   ========================================================================== */

/**

 * Known limitation: by default, Chrome and Safari on OS X allow very limited

 * styling of `select`, unless a `border` property is set.

 */

/**

 * 1. Correct color not being inherited.

 *    Known issue: affects color of disabled elements.

 * 2. Correct font properties not being inherited.

 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.

 */



button,

input,

optgroup,

select,

textarea {

    color: inherit;

    /* 1 */

    

    font: inherit;

    /* 2 */

    

    margin: 0;

    /* 3 */

}

/**

 * Address `overflow` set to `hidden` in IE 8/9/10/11.

 */



button {

    overflow: visible;

}

/**

 * Address inconsistent `text-transform` inheritance for `button` and `select`.

 * All other form control elements do not inherit `text-transform` values.

 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.

 * Correct `select` style inheritance in Firefox.

 */



button,

select {

    text-transform: none;

}

/**

 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`

 *    and `video` controls.

 * 2. Correct inability to style clickable `input` types in iOS.

 * 3. Improve usability and consistency of cursor style between image-type

 *    `input` and others.

 */



button,

html input[type="button"],

/* 1 */



input[type="reset"],

input[type="submit"] {

    -webkit-appearance: button;

    /* 2 */

    

    cursor: pointer;

    /* 3 */

}

/**

 * Re-set default cursor for disabled elements.

 */



button[disabled],

html input[disabled] {

    cursor: default;

}

/**

 * Remove inner padding and border in Firefox 4+.

 */



button::-moz-focus-inner,

input::-moz-focus-inner {

    border: 0;

    padding: 0;

}

/**

 * Address Firefox 4+ setting `line-height` on `input` using `!important` in

 * the UA stylesheet.

 */



input {

    line-height: normal;

}

/**

 * It's recommended that you don't attempt to style these elements.

 * Firefox's implementation doesn't respect box-sizing, padding, or width.

 *

 * 1. Address box sizing set to `content-box` in IE 8/9/10.

 * 2. Remove excess padding in IE 8/9/10.

 */



input[type="checkbox"],

input[type="radio"] {

    box-sizing: border-box;

    /* 1 */

    

    padding: 0;

    /* 2 */

}

/**

 * Fix the cursor style for Chrome's increment/decrement buttons. For certain

 * `font-size` values of the `input`, it causes the cursor style of the

 * decrement button to change from `default` to `text`.

 */



input[type="number"]::-webkit-inner-spin-button,

input[type="number"]::-webkit-outer-spin-button {

    height: auto;

}

/**

 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.

 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.

 */



input[type="search"] {

    -webkit-appearance: textfield;

    /* 1 */

    

    box-sizing: content-box;

    /* 2 */

}

/**

 * Remove inner padding and search cancel button in Safari and Chrome on OS X.

 * Safari (but not Chrome) clips the cancel button when the search input has

 * padding (and `textfield` appearance).

 */



input[type="search"]::-webkit-search-cancel-button,

input[type="search"]::-webkit-search-decoration {

    -webkit-appearance: none;

}

/**

 * Define consistent border, margin, and padding.

 */



fieldset {

    border: 1px solid #c0c0c0;

    margin: 0 2px;

    padding: 0.35em 0.625em 0.75em;

}

/**

 * 1. Correct `color` not being inherited in IE 8/9/10/11.

 * 2. Remove padding so people aren't caught out if they zero out fieldsets.

 */



legend {

    border: 0;

    /* 1 */

    

    padding: 0;

    /* 2 */

}

/**

 * Remove default vertical scrollbar in IE 8/9/10/11.

 */



textarea {

    overflow: auto;

}

/**

 * Don't inherit the `font-weight` (applied by a rule above).

 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.

 */



optgroup {

    font-weight: bold;

}

/* Tables

   ========================================================================== */

/**

 * Remove most spacing between table cells.

 */



table {

    border-collapse: collapse;

    border-spacing: 0;

}

td,

th {

    padding: 0;

}

/* 

 *  Owl Carousel - Animate Plugin

 */

/* Feel free to change duration  */



.animated {

    -webkit-animation-duration: 1000 ms;

    animation-duration: 1000 ms;

    -webkit-animation-fill-mode: both;

    animation-fill-mode: both;

}

/* .owl-animated-out - only for current item */

/* This is very important class. Use z-index if you want move Out item above In item */



.owl-animated-out {

    z-index: 1

}

/* .owl-animated-in - only for upcoming item

/* This is very important class. Use z-index if you want move In item above Out item */



.owl-animated-in {

    z-index: 0

}

/* .fadeOut is style taken from Animation.css and this is how it looks in owl.carousel.css:  */



.fadeOut {

    -webkit-animation-name: fadeOut;

    animation-name: fadeOut;

}

@-webkit-keyframes fadeOut {

    0% {

        opacity: 1;

    }

    100% {

        opacity: 0;

    }

}

@keyframes fadeOut {

    0% {

        opacity: 1;

    }

    100% {

        opacity: 0;

    }

}

/* 

 *  Owl Carousel - Auto Height Plugin

 */



.owl-height {

    -webkit-transition: height 500ms ease-in-out;

    -moz-transition: height 500ms ease-in-out;

    -ms-transition: height 500ms ease-in-out;

    -o-transition: height 500ms ease-in-out;

    transition: height 500ms ease-in-out;

}

/* 

 *  Core Owl Carousel CSS File

 */



.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;

}

.owl-carousel .owl-stage {

    position: relative;

    -ms-touch-action: pan-Y;

}

.owl-carousel .owl-stage:after {

    content: ".";

    display: block;

    clear: both;

    visibility: hidden;

    line-height: 0;

    height: 0;

}

.owl-carousel .owl-stage-outer {

    position: relative;

    overflow: hidden;

    /* fix for flashing background */

    /*-webkit-transform: translate3d(0px, 0px, 0px);*/

}

.owl-carousel .owl-controls .owl-nav .owl-prev,

.owl-carousel .owl-controls .owl-nav .owl-next,

.owl-carousel .owl-controls .owl-dot {

    cursor: pointer;

    cursor: hand;

    -webkit-user-select: none;

    -khtml-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

}

.owl-carousel.owl-loaded {

    display: block;

}

.owl-carousel.owl-loading {

    opacity: 0;

    display: block;

}

.owl-carousel.owl-hidden {

    opacity: 0;

}

.owl-carousel .owl-refresh .owl-item {

    display: none;

}

.owl-carousel .owl-item {

    position: relative;

    min-height: 1px;

    float: left;

    -webkit-backface-visibility: hidden;

    -webkit-tap-highlight-color: transparent;

    -webkit-touch-callout: none;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

}

.owl-carousel .owl-item img {

    display: block;

    width: 100%;

    /* -webkit-transform-style: preserve-3d;*/

}

.owl-carousel.owl-text-select-on .owl-item {

    -webkit-user-select: auto;

    -moz-user-select: auto;

    -ms-user-select: auto;

    user-select: auto;

}

.owl-carousel .owl-grab {

    cursor: move;

    cursor: -webkit-grab;

    cursor: -o-grab;

    cursor: -ms-grab;

    cursor: grab;

}

.owl-carousel.owl-rtl {

    direction: rtl;

}

.owl-carousel.owl-rtl .owl-item {

    float: right;

}

/* No Js */



.no-js .owl-carousel {

    display: block;

}

/* 

 *  Owl Carousel - Lazy Load Plugin

 */



.owl-carousel .owl-item .owl-lazy {

    opacity: 0;

    -webkit-transition: opacity 400ms ease;

    -moz-transition: opacity 400ms ease;

    -ms-transition: opacity 400ms ease;

    -o-transition: opacity 400ms ease;

    transition: opacity 400ms ease;

}

.owl-carousel .owl-item img {

    /*transform-style: preserve-3d;*/

}

/* 

 *  Owl Carousel - 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;

    -webkit-transition: scale 100ms ease;

    -moz-transition: scale 100ms ease;

    -ms-transition: scale 100ms ease;

    -o-transition: scale 100ms ease;

    transition: scale 100ms ease;

}

.owl-carousel .owl-video-play-icon:hover {

    -webkit-transition: scale(1.3, 1.3);

    -moz-transition: scale(1.3, 1.3);

    -ms-transition: scale(1.3, 1.3);

    -o-transition: scale(1.3, 1.3);

    transition: scale(1.3, 1.3);

}

.owl-carousel .owl-video-playing .owl-video-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;

    -webkit-background-size: contain;

    -moz-background-size: contain;

    -o-background-size: contain;

    background-size: contain;

    -webkit-transition: opacity 400ms ease;

    -moz-transition: opacity 400ms ease;

    -ms-transition: opacity 400ms ease;

    -o-transition: opacity 400ms ease;

    transition: opacity 400ms ease;

}

.owl-carousel .owl-video-frame {

    position: relative;

    z-index: 1;

}

/* Owl Navigation Styling */



.owl-nav {

    position: absolute;

    left: 0;

    width: 100%;

    height: 0;

}

.owl-nav div {

    -webkit-transition: all .15s ease-in-out;

    -moz-transition: all .15s ease-in-out;

    -ms-transition: all .15s ease-in-out;

    -o-transition: all .15s ease-in-out;

    transition: all .15s ease-in-out;

}

/* Owl Dot Styling */



.owl-dot {

    -webkit-transition: all .15s ease-in-out;

    -moz-transition: all .15s ease-in-out;

    -ms-transition: all .15s ease-in-out;

    -o-transition: all .15s ease-in-out;

    transition: all .15s ease-in-out;

}

.owl-dots {

    position: absolute;

    bottom:10px;

    right: 0;

    z-index: 999;

    width: 100%;

    text-align: center;

    line-height: 1em;

}

.owl-dot {

    display: inline-block;

    width: 10px;

    height: 10px;

    margin: 0 4px;

    border: #47572b 2px solid;

    background: transparent;

    -webkit-border-radius: 100%;

    -moz-border-radius: 100%;

    border-radius: 100%;

}

.owl-dot:hover,

.owl-dot.active {

    background: #47572b;

}

@media only screen and (min-width: 769px) {

    .owl-dots {

        display: block !important;

    }

}

/****animate css*****/

/*!

 * 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: 1s;

    animation-duration: 1s;

    -webkit-animation-fill-mode: both;

    animation-fill-mode: both;

}

.animated.infinite {

    -webkit-animation-iteration-count: infinite;

    animation-iteration-count: infinite;

}

.animated.hinge {

    -webkit-animation-duration: 2s;

    animation-duration: 2s;

}

.animated.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.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    40%,

    43% {

        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);

        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);

        -webkit-transform: translate3d(0, -30px, 0);

        transform: translate3d(0, -30px, 0);

    }

    70% {

        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);

        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);

        -webkit-transform: translate3d(0, -15px, 0);

        transform: translate3d(0, -15px, 0);

    }

    90% {

        -webkit-transform: translate3d(0, -4px, 0);

        transform: translate3d(0, -4px, 0);

    }

}

@keyframes bounce {

    from, 20%, 53%, 80%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    40%,

    43% {

        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);

        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);

        -webkit-transform: translate3d(0, -30px, 0);

        transform: translate3d(0, -30px, 0);

    }

    70% {

        -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);

        animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);

        -webkit-transform: translate3d(0, -15px, 0);

        transform: translate3d(0, -15px, 0);

    }

    90% {

        -webkit-transform: translate3d(0, -4px, 0);

        transform: translate3d(0, -4px, 0);

    }

}

.bounce {

    -webkit-animation-name: bounce;

    animation-name: bounce;

    -webkit-transform-origin: center bottom;

    transform-origin: center bottom;

}

@-webkit-keyframes flash {

    from, 50%, to {

        opacity: 1;

    }

    25%,

    75% {

        opacity: 0;

    }

}

@keyframes flash {

    from, 50%, to {

        opacity: 1;

    }

    25%,

    75% {

        opacity: 0;

    }

}

.flash {

    -webkit-animation-name: flash;

    animation-name: flash;

}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */



@-webkit-keyframes pulse {

    from {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

    50% {

        -webkit-transform: scale3d(1.05, 1.05, 1.05);

        transform: scale3d(1.05, 1.05, 1.05);

    }

    to {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

}

@keyframes pulse {

    from {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

    50% {

        -webkit-transform: scale3d(1.05, 1.05, 1.05);

        transform: scale3d(1.05, 1.05, 1.05);

    }

    to {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

}

.pulse {

    -webkit-animation-name: pulse;

    animation-name: pulse;

}

@-webkit-keyframes rubberBand {

    from {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

    30% {

        -webkit-transform: scale3d(1.25, 0.75, 1);

        transform: scale3d(1.25, 0.75, 1);

    }

    40% {

        -webkit-transform: scale3d(0.75, 1.25, 1);

        transform: scale3d(0.75, 1.25, 1);

    }

    50% {

        -webkit-transform: scale3d(1.15, 0.85, 1);

        transform: scale3d(1.15, 0.85, 1);

    }

    65% {

        -webkit-transform: scale3d(.95, 1.05, 1);

        transform: scale3d(.95, 1.05, 1);

    }

    75% {

        -webkit-transform: scale3d(1.05, .95, 1);

        transform: scale3d(1.05, .95, 1);

    }

    to {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

}

@keyframes rubberBand {

    from {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

    30% {

        -webkit-transform: scale3d(1.25, 0.75, 1);

        transform: scale3d(1.25, 0.75, 1);

    }

    40% {

        -webkit-transform: scale3d(0.75, 1.25, 1);

        transform: scale3d(0.75, 1.25, 1);

    }

    50% {

        -webkit-transform: scale3d(1.15, 0.85, 1);

        transform: scale3d(1.15, 0.85, 1);

    }

    65% {

        -webkit-transform: scale3d(.95, 1.05, 1);

        transform: scale3d(.95, 1.05, 1);

    }

    75% {

        -webkit-transform: scale3d(1.05, .95, 1);

        transform: scale3d(1.05, .95, 1);

    }

    to {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

}

.rubberBand {

    -webkit-animation-name: rubberBand;

    animation-name: rubberBand;

}

@-webkit-keyframes shake {

    from, to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    10%,

    30%,

    50%,

    70%,

    90% {

        -webkit-transform: translate3d(-10px, 0, 0);

        transform: translate3d(-10px, 0, 0);

    }

    20%,

    40%,

    60%,

    80% {

        -webkit-transform: translate3d(10px, 0, 0);

        transform: translate3d(10px, 0, 0);

    }

}

@keyframes shake {

    from, to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    10%,

    30%,

    50%,

    70%,

    90% {

        -webkit-transform: translate3d(-10px, 0, 0);

        transform: translate3d(-10px, 0, 0);

    }

    20%,

    40%,

    60%,

    80% {

        -webkit-transform: translate3d(10px, 0, 0);

        transform: translate3d(10px, 0, 0);

    }

}

.shake {

    -webkit-animation-name: shake;

    animation-name: shake;

}

@-webkit-keyframes 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(.9, .9, .9) rotate3d(0, 0, 1, -3deg);

        transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);

    }

    30%,

    50%,

    70%,

    90% {

        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);

        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);

    }

    40%,

    60%,

    80% {

        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);

        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);

    }

    to {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

}

@keyframes tada {

    from {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

    10%,

    20% {

        -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);

        transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);

    }

    30%,

    50%,

    70%,

    90% {

        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);

        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);

    }

    40%,

    60%,

    80% {

        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);

        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);

    }

    to {

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

}

.tada {

    -webkit-animation-name: tada;

    animation-name: tada;

}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */



@-webkit-keyframes wobble {

    from {

        -webkit-transform: none;

        transform: none;

    }

    15% {

        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);

        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);

    }

    30% {

        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);

        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);

    }

    45% {

        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);

        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);

    }

    60% {

        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);

        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);

    }

    75% {

        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);

        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);

    }

    to {

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes wobble {

    from {

        -webkit-transform: none;

        transform: none;

    }

    15% {

        -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);

        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);

    }

    30% {

        -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);

        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);

    }

    45% {

        -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);

        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);

    }

    60% {

        -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);

        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);

    }

    75% {

        -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);

        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);

    }

    to {

        -webkit-transform: none;

        transform: none;

    }

}

.wobble {

    -webkit-animation-name: wobble;

    animation-name: wobble;

}

@-webkit-keyframes jello {

    from, 11.1%, to {

        -webkit-transform: none;

        transform: none;

    }

    22.2% {

        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);

        transform: skewX(-12.5deg) skewY(-12.5deg);

    }

    33.3% {

        -webkit-transform: skewX(6.25deg) skewY(6.25deg);

        transform: skewX(6.25deg) skewY(6.25deg);

    }

    44.4% {

        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);

        transform: skewX(-3.125deg) skewY(-3.125deg);

    }

    55.5% {

        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

        transform: skewX(1.5625deg) skewY(1.5625deg);

    }

    66.6% {

        -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

        transform: skewX(-0.78125deg) skewY(-0.78125deg);

    }

    77.7% {

        -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);

        transform: skewX(0.390625deg) skewY(0.390625deg);

    }

    88.8% {

        -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

        transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

    }

}

@keyframes jello {

    from, 11.1%, to {

        -webkit-transform: none;

        transform: none;

    }

    22.2% {

        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);

        transform: skewX(-12.5deg) skewY(-12.5deg);

    }

    33.3% {

        -webkit-transform: skewX(6.25deg) skewY(6.25deg);

        transform: skewX(6.25deg) skewY(6.25deg);

    }

    44.4% {

        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);

        transform: skewX(-3.125deg) skewY(-3.125deg);

    }

    55.5% {

        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

        transform: skewX(1.5625deg) skewY(1.5625deg);

    }

    66.6% {

        -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

        transform: skewX(-0.78125deg) skewY(-0.78125deg);

    }

    77.7% {

        -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);

        transform: skewX(0.390625deg) skewY(0.390625deg);

    }

    88.8% {

        -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

        transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

    }

}

.jello {

    -webkit-animation-name: jello;

    animation-name: jello;

    -webkit-transform-origin: center;

    transform-origin: center;

}

@-webkit-keyframes bounceIn {

    from, 20%, 40%, 60%, 80%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    0% {

        opacity: 0;

        -webkit-transform: scale3d(.3, .3, .3);

        transform: scale3d(.3, .3, .3);

    }

    20% {

        -webkit-transform: scale3d(1.1, 1.1, 1.1);

        transform: scale3d(1.1, 1.1, 1.1);

    }

    40% {

        -webkit-transform: scale3d(.9, .9, .9);

        transform: scale3d(.9, .9, .9);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(1.03, 1.03, 1.03);

        transform: scale3d(1.03, 1.03, 1.03);

    }

    80% {

        -webkit-transform: scale3d(.97, .97, .97);

        transform: scale3d(.97, .97, .97);

    }

    to {

        opacity: 1;

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

}

@keyframes bounceIn {

    from, 20%, 40%, 60%, 80%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    0% {

        opacity: 0;

        -webkit-transform: scale3d(.3, .3, .3);

        transform: scale3d(.3, .3, .3);

    }

    20% {

        -webkit-transform: scale3d(1.1, 1.1, 1.1);

        transform: scale3d(1.1, 1.1, 1.1);

    }

    40% {

        -webkit-transform: scale3d(.9, .9, .9);

        transform: scale3d(.9, .9, .9);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(1.03, 1.03, 1.03);

        transform: scale3d(1.03, 1.03, 1.03);

    }

    80% {

        -webkit-transform: scale3d(.97, .97, .97);

        transform: scale3d(.97, .97, .97);

    }

    to {

        opacity: 1;

        -webkit-transform: scale3d(1, 1, 1);

        transform: scale3d(1, 1, 1);

    }

}

.bounceIn {

    -webkit-animation-name: bounceIn;

    animation-name: bounceIn;

}

@-webkit-keyframes bounceInDown {

    from, 60%, 75%, 90%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(0, -3000px, 0);

        transform: translate3d(0, -3000px, 0);

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(0, 25px, 0);

        transform: translate3d(0, 25px, 0);

    }

    75% {

        -webkit-transform: translate3d(0, -10px, 0);

        transform: translate3d(0, -10px, 0);

    }

    90% {

        -webkit-transform: translate3d(0, 5px, 0);

        transform: translate3d(0, 5px, 0);

    }

    to {

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes bounceInDown {

    from, 60%, 75%, 90%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(0, -3000px, 0);

        transform: translate3d(0, -3000px, 0);

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(0, 25px, 0);

        transform: translate3d(0, 25px, 0);

    }

    75% {

        -webkit-transform: translate3d(0, -10px, 0);

        transform: translate3d(0, -10px, 0);

    }

    90% {

        -webkit-transform: translate3d(0, 5px, 0);

        transform: translate3d(0, 5px, 0);

    }

    to {

        -webkit-transform: none;

        transform: none;

    }

}

.bounceInDown {

    -webkit-animation-name: bounceInDown;

    animation-name: bounceInDown;

}

@-webkit-keyframes bounceInLeft {

    from, 60%, 75%, 90%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(-3000px, 0, 0);

        transform: translate3d(-3000px, 0, 0);

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(25px, 0, 0);

        transform: translate3d(25px, 0, 0);

    }

    75% {

        -webkit-transform: translate3d(-10px, 0, 0);

        transform: translate3d(-10px, 0, 0);

    }

    90% {

        -webkit-transform: translate3d(5px, 0, 0);

        transform: translate3d(5px, 0, 0);

    }

    to {

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes bounceInLeft {

    from, 60%, 75%, 90%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    0% {

        opacity: 0;

        -webkit-transform: translate3d(-3000px, 0, 0);

        transform: translate3d(-3000px, 0, 0);

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(25px, 0, 0);

        transform: translate3d(25px, 0, 0);

    }

    75% {

        -webkit-transform: translate3d(-10px, 0, 0);

        transform: translate3d(-10px, 0, 0);

    }

    90% {

        -webkit-transform: translate3d(5px, 0, 0);

        transform: translate3d(5px, 0, 0);

    }

    to {

        -webkit-transform: none;

        transform: none;

    }

}

.bounceInLeft {

    -webkit-animation-name: bounceInLeft;

    animation-name: bounceInLeft;

}

@-webkit-keyframes bounceInRight {

    from, 60%, 75%, 90%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    from {

        opacity: 0;

        -webkit-transform: translate3d(3000px, 0, 0);

        transform: translate3d(3000px, 0, 0);

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(-25px, 0, 0);

        transform: translate3d(-25px, 0, 0);

    }

    75% {

        -webkit-transform: translate3d(10px, 0, 0);

        transform: translate3d(10px, 0, 0);

    }

    90% {

        -webkit-transform: translate3d(-5px, 0, 0);

        transform: translate3d(-5px, 0, 0);

    }

    to {

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes bounceInRight {

    from, 60%, 75%, 90%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    from {

        opacity: 0;

        -webkit-transform: translate3d(3000px, 0, 0);

        transform: translate3d(3000px, 0, 0);

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(-25px, 0, 0);

        transform: translate3d(-25px, 0, 0);

    }

    75% {

        -webkit-transform: translate3d(10px, 0, 0);

        transform: translate3d(10px, 0, 0);

    }

    90% {

        -webkit-transform: translate3d(-5px, 0, 0);

        transform: translate3d(-5px, 0, 0);

    }

    to {

        -webkit-transform: none;

        transform: none;

    }

}

.bounceInRight {

    -webkit-animation-name: bounceInRight;

    animation-name: bounceInRight;

}

@-webkit-keyframes bounceInUp {

    from, 60%, 75%, 90%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, 3000px, 0);

        transform: translate3d(0, 3000px, 0);

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(0, -20px, 0);

        transform: translate3d(0, -20px, 0);

    }

    75% {

        -webkit-transform: translate3d(0, 10px, 0);

        transform: translate3d(0, 10px, 0);

    }

    90% {

        -webkit-transform: translate3d(0, -5px, 0);

        transform: translate3d(0, -5px, 0);

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

@keyframes bounceInUp {

    from, 60%, 75%, 90%, to {

        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);

    }

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, 3000px, 0);

        transform: translate3d(0, 3000px, 0);

    }

    60% {

        opacity: 1;

        -webkit-transform: translate3d(0, -20px, 0);

        transform: translate3d(0, -20px, 0);

    }

    75% {

        -webkit-transform: translate3d(0, 10px, 0);

        transform: translate3d(0, 10px, 0);

    }

    90% {

        -webkit-transform: translate3d(0, -5px, 0);

        transform: translate3d(0, -5px, 0);

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

.bounceInUp {

    -webkit-animation-name: bounceInUp;

    animation-name: bounceInUp;

}

@-webkit-keyframes bounceOut {

    20% {

        -webkit-transform: scale3d(.9, .9, .9);

        transform: scale3d(.9, .9, .9);

    }

    50%,

    55% {

        opacity: 1;

        -webkit-transform: scale3d(1.1, 1.1, 1.1);

        transform: scale3d(1.1, 1.1, 1.1);

    }

    to {

        opacity: 0;

        -webkit-transform: scale3d(.3, .3, .3);

        transform: scale3d(.3, .3, .3);

    }

}

@keyframes bounceOut {

    20% {

        -webkit-transform: scale3d(.9, .9, .9);

        transform: scale3d(.9, .9, .9);

    }

    50%,

    55% {

        opacity: 1;

        -webkit-transform: scale3d(1.1, 1.1, 1.1);

        transform: scale3d(1.1, 1.1, 1.1);

    }

    to {

        opacity: 0;

        -webkit-transform: scale3d(.3, .3, .3);

        transform: scale3d(.3, .3, .3);

    }

}

.bounceOut {

    -webkit-animation-name: bounceOut;

    animation-name: bounceOut;

}

@-webkit-keyframes bounceOutDown {

    20% {

        -webkit-transform: translate3d(0, 10px, 0);

        transform: translate3d(0, 10px, 0);

    }

    40%,

    45% {

        opacity: 1;

        -webkit-transform: translate3d(0, -20px, 0);

        transform: translate3d(0, -20px, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, 2000px, 0);

        transform: translate3d(0, 2000px, 0);

    }

}

@keyframes bounceOutDown {

    20% {

        -webkit-transform: translate3d(0, 10px, 0);

        transform: translate3d(0, 10px, 0);

    }

    40%,

    45% {

        opacity: 1;

        -webkit-transform: translate3d(0, -20px, 0);

        transform: translate3d(0, -20px, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, 2000px, 0);

        transform: translate3d(0, 2000px, 0);

    }

}

.bounceOutDown {

    -webkit-animation-name: bounceOutDown;

    animation-name: bounceOutDown;

}

@-webkit-keyframes bounceOutLeft {

    20% {

        opacity: 1;

        -webkit-transform: translate3d(20px, 0, 0);

        transform: translate3d(20px, 0, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(-2000px, 0, 0);

        transform: translate3d(-2000px, 0, 0);

    }

}

@keyframes bounceOutLeft {

    20% {

        opacity: 1;

        -webkit-transform: translate3d(20px, 0, 0);

        transform: translate3d(20px, 0, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(-2000px, 0, 0);

        transform: translate3d(-2000px, 0, 0);

    }

}

.bounceOutLeft {

    -webkit-animation-name: bounceOutLeft;

    animation-name: bounceOutLeft;

}

@-webkit-keyframes bounceOutRight {

    20% {

        opacity: 1;

        -webkit-transform: translate3d(-20px, 0, 0);

        transform: translate3d(-20px, 0, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(2000px, 0, 0);

        transform: translate3d(2000px, 0, 0);

    }

}

@keyframes bounceOutRight {

    20% {

        opacity: 1;

        -webkit-transform: translate3d(-20px, 0, 0);

        transform: translate3d(-20px, 0, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(2000px, 0, 0);

        transform: translate3d(2000px, 0, 0);

    }

}

.bounceOutRight {

    -webkit-animation-name: bounceOutRight;

    animation-name: bounceOutRight;

}

@-webkit-keyframes bounceOutUp {

    20% {

        -webkit-transform: translate3d(0, -10px, 0);

        transform: translate3d(0, -10px, 0);

    }

    40%,

    45% {

        opacity: 1;

        -webkit-transform: translate3d(0, 20px, 0);

        transform: translate3d(0, 20px, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, -2000px, 0);

        transform: translate3d(0, -2000px, 0);

    }

}

@keyframes bounceOutUp {

    20% {

        -webkit-transform: translate3d(0, -10px, 0);

        transform: translate3d(0, -10px, 0);

    }

    40%,

    45% {

        opacity: 1;

        -webkit-transform: translate3d(0, 20px, 0);

        transform: translate3d(0, 20px, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, -2000px, 0);

        transform: translate3d(0, -2000px, 0);

    }

}

.bounceOutUp {

    -webkit-animation-name: bounceOutUp;

    animation-name: bounceOutUp;

}

@-webkit-keyframes fadeIn {

    from {

        opacity: 0;

    }

    to {

        opacity: 1;

    }

}

@keyframes fadeIn {

    from {

        opacity: 0;

    }

    to {

        opacity: 1;

    }

}

.fadeIn {

    -webkit-animation-name: fadeIn;

    animation-name: fadeIn;

}

@-webkit-keyframes fadeInDown {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes fadeInDown {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.fadeInDown {

    -webkit-animation-name: fadeInDown;

    animation-name: fadeInDown;

}

@-webkit-keyframes fadeInDownBig {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, -2000px, 0);

        transform: translate3d(0, -2000px, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes fadeInDownBig {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, -2000px, 0);

        transform: translate3d(0, -2000px, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.fadeInDownBig {

    -webkit-animation-name: fadeInDownBig;

    animation-name: fadeInDownBig;

}

@-webkit-keyframes fadeInLeft {

    from {

        opacity: 0;

        -webkit-transform: translate3d(-100%, 0, 0);

        transform: translate3d(-100%, 0, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes fadeInLeft {

    from {

        opacity: 0;

        -webkit-transform: translate3d(-100%, 0, 0);

        transform: translate3d(-100%, 0, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.fadeInLeft {

    -webkit-animation-name: fadeInLeft;

    animation-name: fadeInLeft;

}

@-webkit-keyframes fadeInLeftBig {

    from {

        opacity: 0;

        -webkit-transform: translate3d(-2000px, 0, 0);

        transform: translate3d(-2000px, 0, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes fadeInLeftBig {

    from {

        opacity: 0;

        -webkit-transform: translate3d(-2000px, 0, 0);

        transform: translate3d(-2000px, 0, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.fadeInLeftBig {

    -webkit-animation-name: fadeInLeftBig;

    animation-name: fadeInLeftBig;

}

@-webkit-keyframes fadeInRight {

    from {

        opacity: 0;

        -webkit-transform: translate3d(100%, 0, 0);

        transform: translate3d(100%, 0, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes fadeInRight {

    from {

        opacity: 0;

        -webkit-transform: translate3d(100%, 0, 0);

        transform: translate3d(100%, 0, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.fadeInRight {

    -webkit-animation-name: fadeInRight;

    animation-name: fadeInRight;

}

@-webkit-keyframes fadeInRightBig {

    from {

        opacity: 0;

        -webkit-transform: translate3d(2000px, 0, 0);

        transform: translate3d(2000px, 0, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes fadeInRightBig {

    from {

        opacity: 0;

        -webkit-transform: translate3d(2000px, 0, 0);

        transform: translate3d(2000px, 0, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.fadeInRightBig {

    -webkit-animation-name: fadeInRightBig;

    animation-name: fadeInRightBig;

}

@-webkit-keyframes fadeInUp {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes fadeInUp {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.fadeInUp {

    -webkit-animation-name: fadeInUp;

    animation-name: fadeInUp;

}

@-webkit-keyframes fadeInUpBig {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, 2000px, 0);

        transform: translate3d(0, 2000px, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes fadeInUpBig {

    from {

        opacity: 0;

        -webkit-transform: translate3d(0, 2000px, 0);

        transform: translate3d(0, 2000px, 0);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.fadeInUpBig {

    -webkit-animation-name: fadeInUpBig;

    animation-name: fadeInUpBig;

}

@-webkit-keyframes fadeOut {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

    }

}

@keyframes fadeOut {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

    }

}

.fadeOut {

    -webkit-animation-name: fadeOut;

    animation-name: fadeOut;

}

@-webkit-keyframes fadeOutDown {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

    }

}

@keyframes fadeOutDown {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

    }

}

.fadeOutDown {

    -webkit-animation-name: fadeOutDown;

    animation-name: fadeOutDown;

}

@-webkit-keyframes fadeOutDownBig {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, 2000px, 0);

        transform: translate3d(0, 2000px, 0);

    }

}

@keyframes fadeOutDownBig {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, 2000px, 0);

        transform: translate3d(0, 2000px, 0);

    }

}

.fadeOutDownBig {

    -webkit-animation-name: fadeOutDownBig;

    animation-name: fadeOutDownBig;

}

@-webkit-keyframes fadeOutLeft {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(-100%, 0, 0);

        transform: translate3d(-100%, 0, 0);

    }

}

@keyframes fadeOutLeft {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(-100%, 0, 0);

        transform: translate3d(-100%, 0, 0);

    }

}

.fadeOutLeft {

    -webkit-animation-name: fadeOutLeft;

    animation-name: fadeOutLeft;

}

@-webkit-keyframes fadeOutLeftBig {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(-2000px, 0, 0);

        transform: translate3d(-2000px, 0, 0);

    }

}

@keyframes fadeOutLeftBig {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(-2000px, 0, 0);

        transform: translate3d(-2000px, 0, 0);

    }

}

.fadeOutLeftBig {

    -webkit-animation-name: fadeOutLeftBig;

    animation-name: fadeOutLeftBig;

}

@-webkit-keyframes fadeOutRight {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(100%, 0, 0);

        transform: translate3d(100%, 0, 0);

    }

}

@keyframes fadeOutRight {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(100%, 0, 0);

        transform: translate3d(100%, 0, 0);

    }

}

.fadeOutRight {

    -webkit-animation-name: fadeOutRight;

    animation-name: fadeOutRight;

}

@-webkit-keyframes fadeOutRightBig {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(2000px, 0, 0);

        transform: translate3d(2000px, 0, 0);

    }

}

@keyframes fadeOutRightBig {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(2000px, 0, 0);

        transform: translate3d(2000px, 0, 0);

    }

}

.fadeOutRightBig {

    -webkit-animation-name: fadeOutRightBig;

    animation-name: fadeOutRightBig;

}

@-webkit-keyframes fadeOutUp {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }

}

@keyframes fadeOutUp {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }

}

.fadeOutUp {

    -webkit-animation-name: fadeOutUp;

    animation-name: fadeOutUp;

}

@-webkit-keyframes fadeOutUpBig {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, -2000px, 0);

        transform: translate3d(0, -2000px, 0);

    }

}

@keyframes fadeOutUpBig {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(0, -2000px, 0);

        transform: translate3d(0, -2000px, 0);

    }

}

.fadeOutUpBig {

    -webkit-animation-name: fadeOutUpBig;

    animation-name: fadeOutUpBig;

}

@-webkit-keyframes flip {

    from {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);

        transform: perspective(400px) rotate3d(0, 1, 0, -360deg);

        -webkit-animation-timing-function: ease-out;

        animation-timing-function: ease-out;

    }

    40% {

        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);

        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);

        -webkit-animation-timing-function: ease-out;

        animation-timing-function: ease-out;

    }

    50% {

        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);

        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

    80% {

        -webkit-transform: perspective(400px) scale3d(.95, .95, .95);

        transform: perspective(400px) scale3d(.95, .95, .95);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

    to {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

}

@keyframes flip {

    from {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);

        transform: perspective(400px) rotate3d(0, 1, 0, -360deg);

        -webkit-animation-timing-function: ease-out;

        animation-timing-function: ease-out;

    }

    40% {

        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);

        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);

        -webkit-animation-timing-function: ease-out;

        animation-timing-function: ease-out;

    }

    50% {

        -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);

        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

    80% {

        -webkit-transform: perspective(400px) scale3d(.95, .95, .95);

        transform: perspective(400px) scale3d(.95, .95, .95);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

    to {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

}

.animated.flip {

    -webkit-backface-visibility: visible;

    backface-visibility: visible;

    -webkit-animation-name: flip;

    animation-name: flip;

}

@-webkit-keyframes flipInX {

    from {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

        opacity: 0;

    }

    40% {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

    60% {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);

        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);

        opacity: 1;

    }

    80% {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

    }

    to {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

    }

}

@keyframes flipInX {

    from {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

        opacity: 0;

    }

    40% {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

    60% {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);

        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);

        opacity: 1;

    }

    80% {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

    }

    to {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

    }

}

.flipInX {

    -webkit-backface-visibility: visible !important;

    backface-visibility: visible !important;

    -webkit-animation-name: flipInX;

    animation-name: flipInX;

}

@-webkit-keyframes flipInY {

    from {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

        opacity: 0;

    }

    40% {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);

        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

    60% {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);

        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);

        opacity: 1;

    }

    80% {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);

        transform: perspective(400px) rotate3d(0, 1, 0, -5deg);

    }

    to {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

    }

}

@keyframes flipInY {

    from {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

        opacity: 0;

    }

    40% {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);

        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);

        -webkit-animation-timing-function: ease-in;

        animation-timing-function: ease-in;

    }

    60% {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);

        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);

        opacity: 1;

    }

    80% {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);

        transform: perspective(400px) rotate3d(0, 1, 0, -5deg);

    }

    to {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

    }

}

.flipInY {

    -webkit-backface-visibility: visible !important;

    backface-visibility: visible !important;

    -webkit-animation-name: flipInY;

    animation-name: flipInY;

}

@-webkit-keyframes flipOutX {

    from {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

    }

    30% {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

        opacity: 1;

    }

    to {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

        opacity: 0;

    }

}

@keyframes flipOutX {

    from {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

    }

    30% {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

        opacity: 1;

    }

    to {

        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

        opacity: 0;

    }

}

.flipOutX {

    -webkit-animation-name: flipOutX;

    animation-name: flipOutX;

    -webkit-backface-visibility: visible !important;

    backface-visibility: visible !important;

}

@-webkit-keyframes flipOutY {

    from {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

    }

    30% {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);

        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);

        opacity: 1;

    }

    to {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

        opacity: 0;

    }

}

@keyframes flipOutY {

    from {

        -webkit-transform: perspective(400px);

        transform: perspective(400px);

    }

    30% {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);

        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);

        opacity: 1;

    }

    to {

        -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

        opacity: 0;

    }

}

.flipOutY {

    -webkit-backface-visibility: visible !important;

    backface-visibility: visible !important;

    -webkit-animation-name: flipOutY;

    animation-name: flipOutY;

}

@-webkit-keyframes lightSpeedIn {

    from {

        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);

        transform: translate3d(100%, 0, 0) skewX(-30deg);

        opacity: 0;

    }

    60% {

        -webkit-transform: skewX(20deg);

        transform: skewX(20deg);

        opacity: 1;

    }

    80% {

        -webkit-transform: skewX(-5deg);

        transform: skewX(-5deg);

        opacity: 1;

    }

    to {

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

@keyframes lightSpeedIn {

    from {

        -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);

        transform: translate3d(100%, 0, 0) skewX(-30deg);

        opacity: 0;

    }

    60% {

        -webkit-transform: skewX(20deg);

        transform: skewX(20deg);

        opacity: 1;

    }

    80% {

        -webkit-transform: skewX(-5deg);

        transform: skewX(-5deg);

        opacity: 1;

    }

    to {

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

.lightSpeedIn {

    -webkit-animation-name: lightSpeedIn;

    animation-name: lightSpeedIn;

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

}

@-webkit-keyframes lightSpeedOut {

    from {

        opacity: 1;

    }

    to {

        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);

        transform: translate3d(100%, 0, 0) skewX(30deg);

        opacity: 0;

    }

}

@keyframes lightSpeedOut {

    from {

        opacity: 1;

    }

    to {

        -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);

        transform: translate3d(100%, 0, 0) skewX(30deg);

        opacity: 0;

    }

}

.lightSpeedOut {

    -webkit-animation-name: lightSpeedOut;

    animation-name: lightSpeedOut;

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

}

@-webkit-keyframes rotateIn {

    from {

        -webkit-transform-origin: center;

        transform-origin: center;

        -webkit-transform: rotate3d(0, 0, 1, -200deg);

        transform: rotate3d(0, 0, 1, -200deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: center;

        transform-origin: center;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

@keyframes rotateIn {

    from {

        -webkit-transform-origin: center;

        transform-origin: center;

        -webkit-transform: rotate3d(0, 0, 1, -200deg);

        transform: rotate3d(0, 0, 1, -200deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: center;

        transform-origin: center;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

.rotateIn {

    -webkit-animation-name: rotateIn;

    animation-name: rotateIn;

}

@-webkit-keyframes rotateInDownLeft {

    from {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: rotate3d(0, 0, 1, -45deg);

        transform: rotate3d(0, 0, 1, -45deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

@keyframes rotateInDownLeft {

    from {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: rotate3d(0, 0, 1, -45deg);

        transform: rotate3d(0, 0, 1, -45deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

.rotateInDownLeft {

    -webkit-animation-name: rotateInDownLeft;

    animation-name: rotateInDownLeft;

}

@-webkit-keyframes rotateInDownRight {

    from {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: rotate3d(0, 0, 1, 45deg);

        transform: rotate3d(0, 0, 1, 45deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

@keyframes rotateInDownRight {

    from {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: rotate3d(0, 0, 1, 45deg);

        transform: rotate3d(0, 0, 1, 45deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

.rotateInDownRight {

    -webkit-animation-name: rotateInDownRight;

    animation-name: rotateInDownRight;

}

@-webkit-keyframes rotateInUpLeft {

    from {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: rotate3d(0, 0, 1, 45deg);

        transform: rotate3d(0, 0, 1, 45deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

@keyframes rotateInUpLeft {

    from {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: rotate3d(0, 0, 1, 45deg);

        transform: rotate3d(0, 0, 1, 45deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

.rotateInUpLeft {

    -webkit-animation-name: rotateInUpLeft;

    animation-name: rotateInUpLeft;

}

@-webkit-keyframes rotateInUpRight {

    from {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: rotate3d(0, 0, 1, -90deg);

        transform: rotate3d(0, 0, 1, -90deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

@keyframes rotateInUpRight {

    from {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: rotate3d(0, 0, 1, -90deg);

        transform: rotate3d(0, 0, 1, -90deg);

        opacity: 0;

    }

    to {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: none;

        transform: none;

        opacity: 1;

    }

}

.rotateInUpRight {

    -webkit-animation-name: rotateInUpRight;

    animation-name: rotateInUpRight;

}

@-webkit-keyframes rotateOut {

    from {

        -webkit-transform-origin: center;

        transform-origin: center;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: center;

        transform-origin: center;

        -webkit-transform: rotate3d(0, 0, 1, 200deg);

        transform: rotate3d(0, 0, 1, 200deg);

        opacity: 0;

    }

}

@keyframes rotateOut {

    from {

        -webkit-transform-origin: center;

        transform-origin: center;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: center;

        transform-origin: center;

        -webkit-transform: rotate3d(0, 0, 1, 200deg);

        transform: rotate3d(0, 0, 1, 200deg);

        opacity: 0;

    }

}

.rotateOut {

    -webkit-animation-name: rotateOut;

    animation-name: rotateOut;

}

@-webkit-keyframes rotateOutDownLeft {

    from {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: rotate3d(0, 0, 1, 45deg);

        transform: rotate3d(0, 0, 1, 45deg);

        opacity: 0;

    }

}

@keyframes rotateOutDownLeft {

    from {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: rotate3d(0, 0, 1, 45deg);

        transform: rotate3d(0, 0, 1, 45deg);

        opacity: 0;

    }

}

.rotateOutDownLeft {

    -webkit-animation-name: rotateOutDownLeft;

    animation-name: rotateOutDownLeft;

}

@-webkit-keyframes rotateOutDownRight {

    from {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: rotate3d(0, 0, 1, -45deg);

        transform: rotate3d(0, 0, 1, -45deg);

        opacity: 0;

    }

}

@keyframes rotateOutDownRight {

    from {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: rotate3d(0, 0, 1, -45deg);

        transform: rotate3d(0, 0, 1, -45deg);

        opacity: 0;

    }

}

.rotateOutDownRight {

    -webkit-animation-name: rotateOutDownRight;

    animation-name: rotateOutDownRight;

}

@-webkit-keyframes rotateOutUpLeft {

    from {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: rotate3d(0, 0, 1, -45deg);

        transform: rotate3d(0, 0, 1, -45deg);

        opacity: 0;

    }

}

@keyframes rotateOutUpLeft {

    from {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: left bottom;

        transform-origin: left bottom;

        -webkit-transform: rotate3d(0, 0, 1, -45deg);

        transform: rotate3d(0, 0, 1, -45deg);

        opacity: 0;

    }

}

.rotateOutUpLeft {

    -webkit-animation-name: rotateOutUpLeft;

    animation-name: rotateOutUpLeft;

}

@-webkit-keyframes rotateOutUpRight {

    from {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: rotate3d(0, 0, 1, 90deg);

        transform: rotate3d(0, 0, 1, 90deg);

        opacity: 0;

    }

}

@keyframes rotateOutUpRight {

    from {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        opacity: 1;

    }

    to {

        -webkit-transform-origin: right bottom;

        transform-origin: right bottom;

        -webkit-transform: rotate3d(0, 0, 1, 90deg);

        transform: rotate3d(0, 0, 1, 90deg);

        opacity: 0;

    }

}

.rotateOutUpRight {

    -webkit-animation-name: rotateOutUpRight;

    animation-name: rotateOutUpRight;

}

@-webkit-keyframes hinge {

    0% {

        -webkit-transform-origin: top left;

        transform-origin: top left;

        -webkit-animation-timing-function: ease-in-out;

        animation-timing-function: ease-in-out;

    }

    20%,

    60% {

        -webkit-transform: rotate3d(0, 0, 1, 80deg);

        transform: rotate3d(0, 0, 1, 80deg);

        -webkit-transform-origin: top left;

        transform-origin: top left;

        -webkit-animation-timing-function: ease-in-out;

        animation-timing-function: ease-in-out;

    }

    40%,

    80% {

        -webkit-transform: rotate3d(0, 0, 1, 60deg);

        transform: rotate3d(0, 0, 1, 60deg);

        -webkit-transform-origin: top left;

        transform-origin: top left;

        -webkit-animation-timing-function: ease-in-out;

        animation-timing-function: ease-in-out;

        opacity: 1;

    }

    to {

        -webkit-transform: translate3d(0, 700px, 0);

        transform: translate3d(0, 700px, 0);

        opacity: 0;

    }

}

@keyframes hinge {

    0% {

        -webkit-transform-origin: top left;

        transform-origin: top left;

        -webkit-animation-timing-function: ease-in-out;

        animation-timing-function: ease-in-out;

    }

    20%,

    60% {

        -webkit-transform: rotate3d(0, 0, 1, 80deg);

        transform: rotate3d(0, 0, 1, 80deg);

        -webkit-transform-origin: top left;

        transform-origin: top left;

        -webkit-animation-timing-function: ease-in-out;

        animation-timing-function: ease-in-out;

    }

    40%,

    80% {

        -webkit-transform: rotate3d(0, 0, 1, 60deg);

        transform: rotate3d(0, 0, 1, 60deg);

        -webkit-transform-origin: top left;

        transform-origin: top left;

        -webkit-animation-timing-function: ease-in-out;

        animation-timing-function: ease-in-out;

        opacity: 1;

    }

    to {

        -webkit-transform: translate3d(0, 700px, 0);

        transform: translate3d(0, 700px, 0);

        opacity: 0;

    }

}

.hinge {

    -webkit-animation-name: hinge;

    animation-name: hinge;

}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */



@-webkit-keyframes rollIn {

    from {

        opacity: 0;

        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);

        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

@keyframes rollIn {

    from {

        opacity: 0;

        -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);

        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);

    }

    to {

        opacity: 1;

        -webkit-transform: none;

        transform: none;

    }

}

.rollIn {

    -webkit-animation-name: rollIn;

    animation-name: rollIn;

}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */



@-webkit-keyframes rollOut {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

    }

}

@keyframes rollOut {

    from {

        opacity: 1;

    }

    to {

        opacity: 0;

        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

    }

}

.rollOut {

    -webkit-animation-name: rollOut;

    animation-name: rollOut;

}

@-webkit-keyframes zoomIn {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.3, .3, .3);

        transform: scale3d(.3, .3, .3);

    }

    50% {

        opacity: 1;

    }

}

@keyframes zoomIn {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.3, .3, .3);

        transform: scale3d(.3, .3, .3);

    }

    50% {

        opacity: 1;

    }

}

.zoomIn {

    -webkit-animation-name: zoomIn;

    animation-name: zoomIn;

}

@-webkit-keyframes zoomInDown {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);

        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);

        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

@keyframes zoomInDown {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);

        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);

        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

.zoomInDown {

    -webkit-animation-name: zoomInDown;

    animation-name: zoomInDown;

}

@-webkit-keyframes zoomInLeft {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);

        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);

        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

@keyframes zoomInLeft {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);

        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);

        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

.zoomInLeft {

    -webkit-animation-name: zoomInLeft;

    animation-name: zoomInLeft;

}

@-webkit-keyframes zoomInRight {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);

        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);

        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

@keyframes zoomInRight {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);

        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);

        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

.zoomInRight {

    -webkit-animation-name: zoomInRight;

    animation-name: zoomInRight;

}

@-webkit-keyframes zoomInUp {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);

        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);

        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

@keyframes zoomInUp {

    from {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);

        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    60% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);

        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

.zoomInUp {

    -webkit-animation-name: zoomInUp;

    animation-name: zoomInUp;

}

@-webkit-keyframes zoomOut {

    from {

        opacity: 1;

    }

    50% {

        opacity: 0;

        -webkit-transform: scale3d(.3, .3, .3);

        transform: scale3d(.3, .3, .3);

    }

    to {

        opacity: 0;

    }

}

@keyframes zoomOut {

    from {

        opacity: 1;

    }

    50% {

        opacity: 0;

        -webkit-transform: scale3d(.3, .3, .3);

        transform: scale3d(.3, .3, .3);

    }

    to {

        opacity: 0;

    }

}

.zoomOut {

    -webkit-animation-name: zoomOut;

    animation-name: zoomOut;

}

@-webkit-keyframes zoomOutDown {

    40% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);

        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    to {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);

        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);

        -webkit-transform-origin: center bottom;

        transform-origin: center bottom;

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

@keyframes zoomOutDown {

    40% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);

        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    to {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);

        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);

        -webkit-transform-origin: center bottom;

        transform-origin: center bottom;

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

.zoomOutDown {

    -webkit-animation-name: zoomOutDown;

    animation-name: zoomOutDown;

}

@-webkit-keyframes zoomOutLeft {

    40% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);

        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);

        transform: scale(.1) translate3d(-2000px, 0, 0);

        -webkit-transform-origin: left center;

        transform-origin: left center;

    }

}

@keyframes zoomOutLeft {

    40% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);

        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);

        transform: scale(.1) translate3d(-2000px, 0, 0);

        -webkit-transform-origin: left center;

        transform-origin: left center;

    }

}

.zoomOutLeft {

    -webkit-animation-name: zoomOutLeft;

    animation-name: zoomOutLeft;

}

@-webkit-keyframes zoomOutRight {

    40% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);

        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);

        transform: scale(.1) translate3d(2000px, 0, 0);

        -webkit-transform-origin: right center;

        transform-origin: right center;

    }

}

@keyframes zoomOutRight {

    40% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);

        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);

    }

    to {

        opacity: 0;

        -webkit-transform: scale(.1) translate3d(2000px, 0, 0);

        transform: scale(.1) translate3d(2000px, 0, 0);

        -webkit-transform-origin: right center;

        transform-origin: right center;

    }

}

.zoomOutRight {

    -webkit-animation-name: zoomOutRight;

    animation-name: zoomOutRight;

}

@-webkit-keyframes zoomOutUp {

    40% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);

        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    to {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);

        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);

        -webkit-transform-origin: center bottom;

        transform-origin: center bottom;

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

@keyframes zoomOutUp {

    40% {

        opacity: 1;

        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);

        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);

        -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

        animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);

    }

    to {

        opacity: 0;

        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);

        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);

        -webkit-transform-origin: center bottom;

        transform-origin: center bottom;

        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

        animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);

    }

}

.zoomOutUp {

    -webkit-animation-name: zoomOutUp;

    animation-name: zoomOutUp;

}

@-webkit-keyframes slideInDown {

    from {

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

        visibility: visible;

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

@keyframes slideInDown {

    from {

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

        visibility: visible;

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

.slideInDown {

    -webkit-animation-name: slideInDown;

    animation-name: slideInDown;

}

@-webkit-keyframes slideInLeft {

    from {

        -webkit-transform: translate3d(-100%, 0, 0);

        transform: translate3d(-100%, 0, 0);

        visibility: visible;

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

@keyframes slideInLeft {

    from {

        -webkit-transform: translate3d(-100%, 0, 0);

        transform: translate3d(-100%, 0, 0);

        visibility: visible;

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

.slideInLeft {

    -webkit-animation-name: slideInLeft;

    animation-name: slideInLeft;

}

@-webkit-keyframes slideInRight {

    from {

        -webkit-transform: translate3d(100%, 0, 0);

        transform: translate3d(100%, 0, 0);

        visibility: visible;

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

@keyframes slideInRight {

    from {

        -webkit-transform: translate3d(100%, 0, 0);

        transform: translate3d(100%, 0, 0);

        visibility: visible;

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

.slideInRight {

    -webkit-animation-name: slideInRight;

    animation-name: slideInRight;

}

@-webkit-keyframes slideInUp {

    from {

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

        visibility: visible;

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

@keyframes slideInUp {

    from {

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

        visibility: visible;

    }

    to {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

}

.slideInUp {

    -webkit-animation-name: slideInUp;

    animation-name: slideInUp;

}

@-webkit-keyframes slideOutDown {

    from {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    to {

        visibility: hidden;

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

    }

}

@keyframes slideOutDown {

    from {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    to {

        visibility: hidden;

        -webkit-transform: translate3d(0, 100%, 0);

        transform: translate3d(0, 100%, 0);

    }

}

.slideOutDown {

    -webkit-animation-name: slideOutDown;

    animation-name: slideOutDown;

}

@-webkit-keyframes slideOutLeft {

    from {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    to {

        visibility: hidden;

        -webkit-transform: translate3d(-100%, 0, 0);

        transform: translate3d(-100%, 0, 0);

    }

}

@keyframes slideOutLeft {

    from {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    to {

        visibility: hidden;

        -webkit-transform: translate3d(-100%, 0, 0);

        transform: translate3d(-100%, 0, 0);

    }

}

.slideOutLeft {

    -webkit-animation-name: slideOutLeft;

    animation-name: slideOutLeft;

}

@-webkit-keyframes slideOutRight {

    from {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    to {

        visibility: hidden;

        -webkit-transform: translate3d(100%, 0, 0);

        transform: translate3d(100%, 0, 0);

    }

}

@keyframes slideOutRight {

    from {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    to {

        visibility: hidden;

        -webkit-transform: translate3d(100%, 0, 0);

        transform: translate3d(100%, 0, 0);

    }

}

.slideOutRight {

    -webkit-animation-name: slideOutRight;

    animation-name: slideOutRight;

}

@-webkit-keyframes slideOutUp {

    from {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    to {

        visibility: hidden;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }

}

@keyframes slideOutUp {

    from {

        -webkit-transform: translate3d(0, 0, 0);

        transform: translate3d(0, 0, 0);

    }

    to {

        visibility: hidden;

        -webkit-transform: translate3d(0, -100%, 0);

        transform: translate3d(0, -100%, 0);

    }

}

.slideOutUp {

    -webkit-animation-name: slideOutUp;

    animation-name: slideOutUp;

}

/********/

/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */



.fancybox-wrap,

.fancybox-skin,

.fancybox-outer,

.fancybox-inner,

.fancybox-image,

.fancybox-wrap iframe,

.fancybox-wrap object,

.fancybox-nav,

.fancybox-nav span,

.fancybox-tmp {

    padding: 0;

    margin: 0;

    border: 0;

    outline: none;

    vertical-align: top;

}

.fancybox-wrap {

    position: absolute;

    top: 0;

    left: 0;

    z-index: 8020;

}

.fancybox-skin {

    position: relative;

    background: #f9f9f9;

    color: #444;

    text-shadow: none;

    -webkit-border-radius: 4px;

    -moz-border-radius: 4px;

    border-radius: 4px;

}

.fancybox-opened {

    z-index: 8030;

}

.fancybox-opened .fancybox-skin {

    -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);

    -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);

    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);

}

.fancybox-outer,

.fancybox-inner {

    position: relative;

}

.fancybox-inner {

    overflow: hidden;

}

.fancybox-type-iframe .fancybox-inner {

    -webkit-overflow-scrolling: touch;

}

.fancybox-error {

    color: #444;

    font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;

    margin: 0;

    padding: 15px;

    white-space: nowrap;

}

.fancybox-image,

.fancybox-iframe {

    display: block;

    width: 100%;

    height: 100%;

}

.fancybox-image {

    max-width: 100%;

    max-height: 100%;

}

#fancybox-loading,

.fancybox-close,

.fancybox-prev span,

.fancybox-next span {

    background-image: url('images/fancybox_sprite.png');

}

#fancybox-loading {

    position: fixed;

    top: 50%;

    left: 50%;

    margin-top: -22px;

    margin-left: -22px;

    background-position: 0 -108px;

    opacity: 0.8;

    cursor: pointer;

    z-index: 8060;

}

#fancybox-loading div {

    width: 44px;

    height: 44px;

    background: url('images/fancybox_loading.gif') center center no-repeat;

}

.fancybox-close {

    position: absolute;

    top: -18px;

    right: -18px;

    width: 36px;

    height: 36px;

    cursor: pointer;

    z-index: 8040;

}

.fancybox-nav {

    position: absolute;

    top: 0;

    width: 40%;

    height: 100%;

    cursor: pointer;

    text-decoration: none;

    background: transparent url('images/blank.gif');

    /* helps IE */

    

    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

    z-index: 8040;

}

.fancybox-prev {

    left: 0;

}

.fancybox-next {

    right: 0;

}

.fancybox-nav span {

    position: absolute;

    top: 50%;

    width: 36px;

    height: 34px;

    margin-top: -18px;

    cursor: pointer;

    z-index: 8040;

    visibility: hidden;

}

.fancybox-prev span {

    left: 10px;

    background-position: 0 -36px;

}

.fancybox-next span {

    right: 10px;

    background-position: 0 -72px;

}

.fancybox-nav:hover span {

    visibility: visible;

}

.fancybox-tmp {

    position: absolute;

    top: -99999px;

    left: -99999px;

    visibility: hidden;

    max-width: 99999px;

    max-height: 99999px;

    overflow: visible !important;

}

/* Overlay helper */



.fancybox-lock {

    overflow: hidden !important;

    width: auto;

}

.fancybox-lock body {

    overflow: hidden !important;

}

.fancybox-lock-test {

    overflow-y: hidden !important;

}

.fancybox-overlay {

    position: absolute;

    top: 0;

    left: 0;

    overflow: hidden;

    display: none;

    z-index: 8010;

    background: url('images/fancybox_overlay.png');

}

.fancybox-overlay-fixed {

    position: fixed;

    bottom: 0;

    right: 0;

}

.fancybox-lock .fancybox-overlay {

    overflow: auto;

    overflow-y: scroll;

}

/* Title helper */



.fancybox-title {

    visibility: hidden;

    font: normal 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;

    position: relative;

    text-shadow: none;

    z-index: 8050;

}

.fancybox-opened .fancybox-title {

    visibility: visible;

}

.fancybox-title-float-wrap {

    position: absolute;

    bottom: 0;

    right: 50%;

    margin-bottom: -35px;

    z-index: 8050;

    text-align: center;

}

.fancybox-title-float-wrap .child {

    display: inline-block;

    margin-right: -100%;

    padding: 2px 20px;

    background: transparent;

    /* Fallback for web browsers that doesn't support RGBa */

    

    background: rgba(0, 0, 0, 0.8);

    -webkit-border-radius: 15px;

    -moz-border-radius: 15px;

    border-radius: 15px;

    text-shadow: 0 1px 2px #222;

    color: #FFF;

    font-weight: bold;

    line-height: 24px;

    white-space: nowrap;

}

.fancybox-title-outside-wrap {

    position: relative;

    margin-top: 10px;

    color: #fff;

}

.fancybox-title-inside-wrap {

    padding-top: 10px;

}

.fancybox-title-over-wrap {

    position: absolute;

    bottom: 0;

    left: 0;

    color: #fff;

    padding: 10px;

    background: #000;

    background: rgba(0, 0, 0, .8);

}

/*Retina graphics!*/



@media only screen and (-webkit-min-device-pixel-ratio: 1.5),

only screen and (min--moz-device-pixel-ratio: 1.5),

only screen and (min-device-pixel-ratio: 1.5) {

    #fancybox-loading,

    .fancybox-close,

    .fancybox-prev span,

    .fancybox-next span {

        background-image: url('images/fancybox_sprite@2x.png');

        background-size: 44px 152px;

        /*The size of the normal image, half the size of the hi-res image*/

    }

    #fancybox-loading div {

        background-image: url('images/fancybox_loading@2x.gif');

        background-size: 24px 24px;

        /*The size of the normal image, half the size of the hi-res image*/

    }

}

/**************global css end*******/



::-moz-selection {

    background-color: #007d9d;

    color: #fff;

    text-shadow: none;

}

::selection {

    background-color: #007d9d;

    color: #fff;

    text-shadow: none;

}

input::-moz-placeholder,

textarea::-moz-placeholder {

    color: inherit;

    opacity: 1;

}

input:-ms-input-placeholder,

textarea:-ms-input-placeholder {

    color: inherit;

}

input::-webkit-input-placeholder,

textarea::-webkit-input-placeholder {

    color: inherit;

}

body {
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
    overflow-x: hidden;
    background: #FFF;
    color: #FFF;
}

.container:after,

.container:before {

    content: " ";

    display: table;

}

.container:after {

    clear: both;

}

h1,

h2,

h3,

h4,

h5,

h6,

ul,

li,

figure {

    margin: 0;

    padding: 0;

}

img {

    margin: 0;

    padding: 0;

    border: none;

    max-width: 100%;

    display: block;

}

.container {

    width: 100%;

    position: relative;

    max-width:1120px;

    margin: 0 auto;

    padding: 0 15px;

}



@font-face {

    font-family: 'Conv_Proxima Nova Semibold';

    src: url('fonts/Proxima Nova Semibold.eot');

    src: local('☺'), url('fonts/Proxima Nova Semibold.woff') format('woff'), url('fonts/Proxima Nova Semibold.ttf') format('truetype'), url('fonts/Proxima Nova Semibold.svg') format('svg');

    font-weight: normal;

    font-style: normal;

}



/***** header css start ******/



.main-header {

    width: 100%;

    float: left;

    position: relative;

}

.nav-area {

    width: 100%;

    float: left;

    padding: 20px 0 5px;

}

.logo {

    display: block;

    margin:0 0 15px;

}

.logo img {

    margin: 0 auto;

}

.mobilemenu {

    display: block;

    height: 40px;

    color: #FFF;

    font-size: 20px;

    font-weight: bold;

    width: 100%;

    float: left;

    text-align: left;

    background: #20a8e0;

    padding: 4px 10px;

    margin-bottom: 2px;

    text-decoration: none;

}

.mobilemenu:hover,

.mobilemenu.active {

    background: #19789f;

    color: #FFF;

}

.nav-sup {

    width: 100%;

    float:right;

    display: none;

    background: #e2e2e2;

}

.nav-sup ul li {

    display: block;

    line-height: 1em;

    position: relative;

}

.nav-sup ul li a {

    font-size:18px;

    color: #20a8e0;

    font-weight: 900;

    line-height: 1em;

    text-transform: uppercase;

    display: block;

    padding: 10px 15px;

    -webkit-transition: all 0.3s ease-in-out;

    -moz-transition: all 0.3s ease-in-out;

    -o-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

}

.nav-sup ul > li > a:hover,

.nav-sup ul > li.active > a {

    color: #FFF;

    background:#20a8e0;

    -webkit-transition: all 0.3s ease-in-out;

    -moz-transition: all 0.3s ease-in-out;

    -o-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

}

.nav-sup ul ul.sub-menu {

    width: 100%;

    position: relative;

    padding-left: 10px;

    background: #a2a2a2;

}

.nav-sup ul ul.sub-menu > li > a:hover {

    color: #ff9800;

    -webkit-transition: all 0.3s ease-in-out;

    -moz-transition: all 0.3s ease-in-out;

    -o-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

}

/***banner****/



.banner {

    width: 100%;

    float: left;

    display: table;

    height:500px;

    position: relative;

}

.banner img {

    width: 100%;

}

.banner-caption {

    width: 100%;

    position: relative;

    display: table-cell;

    vertical-align: middle;

    padding:0 15px;

    text-align: center;

}

.banner-caption h2 {
    font-size: 26px;
    color: #FFF;
    line-height: 1.3em;
    font-weight:300;    
    margin: 0 0 25px 0;
}

.banner-caption h2 strong{
    display: block;
}
.banner-caption p{
    font-size:20px;
    color: #FFF;
    font-family: 'Lato', sans-serif;
    line-height: 1.7em;
    margin: 0 0 30px 0;
}

.banner-caption .btn{

    font-size:18px;

    font-family: 'Lato', sans-serif;

    color: #FFF;

    text-transform: uppercase;

    display: inline-block;

    vertical-align: middle;

    padding: 15px 20px;

    border:#FFF 1px solid;

    border-radius: 5px;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}

.banner-caption .btn:hover{

    background: #FFF;

    color: #000;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}

.banner .cloud-sec{

    width: 100%;

    position: absolute;

    height: 200px;

    left: 0;

    bottom: -60px;

    background: url(images/cloud.png) repeat-x center;

    background-size: cover;

}

/**/



/**/

.body {

    width: 100%;

    float: left;

}

.body h1.heading{

    font-size: 26px;

    color: #FFF;

    text-transform: uppercase;

    font-weight: 900;

    line-height: 1em;

    margin:0 0 30px 0;

}

.story-text-sec{

    width: 100%;

    float: left;

    text-align: center;

    background: #1478af url(images/pic.png) no-repeat center bottom;

    background-size: 65%;

    padding:100px 0;

}

.story-text-sec h4{

    font-size: 22px;

    color:#FFF;

    font-family: 'Lato', sans-serif;

    font-weight: normal;

    line-height: 1.4em;

    margin: 0 0 30px 0;

    font-style: italic;

}

.story-text-sec p{

    font-size: 16px;

    color:#FFF;

    font-family: 'Lato', sans-serif;

    line-height: 1.7em;

    margin: 0 0 20px 0;

}



.product-sec{

    width: 100%;

    float: left;

    text-align: center;

    background: #ff8400;

    padding: 40px 0;

}

.product-sec ul{

    margin: 0 -31px;

}

.product-sec ul li{

    width: 100%;

    float: left;

    padding: 0 31px;

    margin-bottom:35px;

}

.product-sec .product-thumb{

    width: 100%;

    float: left;

}

.product-sec .product-thumb .image-sec{

    width: 100%;

    float: left;

    margin-bottom: 30px;

}

.product-sec .product-thumb img{

    width:269px;

    height: 269px;

    border:#FFF 15px solid;

    border-radius: 100%;

    margin: 0 auto;

}

.product-sec .product-thumb .figure-caption{

    width: 100%;

    float: left;

}

.product-sec .product-thumb p.title{

    color: #fefefe;

    font-size: 24px;

    font-family: 'Conv_Proxima Nova Semibold';

    text-transform: uppercase;

    line-height: 1em;

    margin: 0 0 15px 0;

}

.product-sec .product-thumb p{

    font-family: 'Lato', sans-serif;

    font-weight: 300;

    font-size: 24px;

    color: #FFF;

    margin: 0 0 15px;

}

.product-sec .product-thumb .btn-lrnmore{

    display: inline-block;

    vertical-align: middle;

    line-height: 1em;

    margin: 0;

    color: #FFF;

    font-size: 18px;

    font-family: 'Lato', sans-serif;

    text-transform: uppercase;

    border:#FFF 1px solid;

    padding: 12px 30px;

    border-radius: 5px;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}

.product-sec .product-thumb .btn-lrnmore:hover{

    background: #FFF;

    color: #000;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}



/**/

.newsletter-sec{

    width: 100%;

    float: left;

    text-align: center;

    background: #0971ab;

    padding: 40px 0;

}

.newsletter-sec p{

    color: #fefefe;

    font-size: 24px;

    font-family: 'Lato', sans-serif;

    font-weight: 300;

    margin: 0 0 30px 0;

}

.newsletter-sec .wrapper{

    width: 100%;

    max-width: 548px;

    margin: 0 auto;

}

.newsletter-sec .input-fields{

    width: 100%;

    float: left;

    position: relative;

    padding-right: 120px;

    border-radius:6px;

    overflow: hidden;

}

.newsletter-sec input[type="text"]{

    width: 100%;

    display: block;

    height: 67px;

    background: #FFF;

    font-size: 18px;

    color: #404040;

    font-family: 'Lato', sans-serif;

    font-weight: 300;

    border:none;

    padding: 0 12px;

    outline: none;

}

.newsletter-sec .btn-sec{

    width: 120px;

    position: absolute;

    right: 0;

    top: 0;

}

.newsletter-sec input[type="submit"]{

    width: 100%;

    height:67px;

    display:block;

    border:none;

    outline: none;

    font-family: 'Lato', sans-serif;

    font-size:15px;

    text-transform: uppercase;

    background: #ff8400;

    color: #FFF;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}

.newsletter-sec input[type="submit"]:hover{

    background:#20a8e0;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}

/**/

.contact-sec-module{

    width: 100%;

    float: left;

    text-align: center;

    padding:40px 0;

    background: #20a8e0;

}

.contact-sec-module .wrapper{

    width: 100%;

    max-width: 519px;

    margin:0 auto;

}

.contact-sec-module p{

    color: #fefefe;

    font-size: 24px;

    font-family: 'Lato', sans-serif;

    font-weight: 300;

    margin: 0 0 30px 0;

}



.contact-sec-module .input-fields{

    width: 100%;

    float: left;

    margin-bottom: 11px;

}

.contact-sec-module .btn-sec{

    width: 100%;

    float: left;

}

.contact-sec-module input[type="text"],

.contact-sec-module textarea{

    width: 100%;

    display: block;

    height: 57px;

    background: #FFF;

    border:none;

    font-size: 18px;

    color: #404040;

    font-family: 'Lato', sans-serif;

    font-weight: 300;

    padding: 0 15px;

    border-radius:5px;

    outline: none;

}

.contact-sec-module textarea{

    padding:15px;

    height: 227px;

}

.contact-sec-module input[type="submit"]{

    width: 100%;

    height: 57px;

    display: block;

    font-size: 18px;

    color: #FFF;

    font-family: 'Lato', sans-serif;

    border:#FFF 1px solid;

    border-radius:5px;

    background: transparent;

    outline: none;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}

.contact-sec-module input[type="submit"]:hover{

    background:#FFF;

    color: #000;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}

/**/



.main-footer {

    width: 100%;

    float: left;

    text-align: center;

    background: #242424;

    padding: 35px 0;

}

.main-footer img{

    display: inline-block;

    vertical-align: middle;

    margin: 0 auto;

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}

.main-footer img:hover{

    transform: scale(1.1);

    -webkit-transition:all 0.3s ease-in-out;

    -moz-transition:all 0.3s ease-in-out;

    -o-transition:all 0.3s ease-in-out;

    transition:all 0.3s ease-in-out;

}



.main-footer p{

    font-family: 'Lato', sans-serif;

    font-size: 18px;

    color: #fefefe;

    font-weight: 300;

    line-height: 1.5em;

    margin:0 0 15px 0;

}

.main-footer p.social-icon{

    margin:25px 0;

}

.main-footer p.social-icon img{

    margin: 0 5px;

}

/*******/



@media only screen and (min-width: 521px) {} 

@media only screen and (min-width: 641px) {

    .banner-caption h2 {

        font-size: 40px;

    }

    .body h1.heading {

        font-size: 40px;

    }

    .story-text-sec {

        padding: 150px 0 200px;

    }

    .newsletter-sec .input-fields {

        padding-right: 200px;

    }

    .newsletter-sec .btn-sec {

        width:200px;        

    }

    .newsletter-sec input[type="submit"]{

        font-size: 18px;

    }

    .newsletter-sec input[type="text"] {        

        padding: 0 25px;

    }

    .main-footer p {

        font-size: 24px;

    }

}

@media only screen and (min-width: 768px) {

    /*header css*/

    

    .mobilemenu {

        display: none;

    }

    .main-header {

        padding-top: 10px;

    }

    .logo {

        width: 290px;

        position: absolute;

        left: 0;

        right: 0;

        bottom: -178px;

        margin: 0 auto;

        z-index: 9;

        -webkit-transition:all 0.3s ease-in-out;

        -moz-transition:all 0.3s ease-in-out;

        -o-transition:all 0.3s ease-in-out;

        transition:all 0.3s ease-in-out;

    }

    .nav-area {

         padding: 27px 0 40px;

        -webkit-transition:all 0.3s ease-in-out;

        -moz-transition:all 0.3s ease-in-out;

        -o-transition:all 0.3s ease-in-out;

        transition:all 0.3s ease-in-out;

    }

    .nav-area.fixed-header{

        padding:10px 0;

        float: none;

        position: fixed;

        top: 0;

        left: 0;

        z-index: 999;

        background: #FFF;

        -webkit-transition:all 0.3s ease-in-out;

        -moz-transition:all 0.3s ease-in-out;

        -o-transition:all 0.3s ease-in-out;

        transition:all 0.3s ease-in-out;

    }

    .nav-area.fixed-header .logo {

        width: 150px;

        bottom: -80px;

        -webkit-transition:all 0.3s ease-in-out;

        -moz-transition:all 0.3s ease-in-out;

        -o-transition:all 0.3s ease-in-out;

        transition:all 0.3s ease-in-out;

    }

    .nav-sup {

        display: block;

        width:100%;

        max-width: 965px;

        background: transparent;

        margin: 0 auto;

        float: none;

    }

    .nav-sup ul li a {

        font-size: 14px;

    }

    .nav-sup .pull-left{

        float: left;

    }

    .nav-sup .pull-right{

        float:right;

    }

    .nav-sup ul li {

        display: inline-block;

        vertical-align: middle;

    }

    .nav-sup ul li > a:hover, .nav-sup ul li.active > a{

        background: transparent;

        color:#000;

        -webkit-transition: all 0.3s ease-in-out;

        -moz-transition: all 0.3s ease-in-out;

        -o-transition: all 0.3s ease-in-out;

        transition: all 0.3s ease-in-out;

    }    

    .nav-sup ul li + li{

        margin-left:13px;

    }

    .banner {

        height: 800px;

    }

    

}

@media only screen and (min-width: 941px) {

.nav-sup ul li a {

    font-size: 20px;

}

.banner .cloud-sec {

    height: 418px;

    bottom: -150px;

}

.banner-caption h2 {

    font-size: 60px;

}

.banner-caption .btn {

    font-size: 30px;

    padding: 22px 69px;

}

.body h1.heading {

    font-size: 48px;

}

.story-text-sec h1.heading{

    margin: 0 0 60px 0;

}

.story-text-sec{

    padding: 230px 0 400px;

    background-size: auto;

}

.story-text-sec h4 {

    font-size: 30px;

}

.story-text-sec p {

    font-size: 20px;

    max-width: 965px;

    margin: 0 auto 36px;

}

.product-sec ul li {

    width: 33.33%;

}

.newsletter-sec {

    padding: 150px 0 140px;

}

.newsletter-sec h1.heading{

    margin: 0 0 26px 0;

}

.contact-sec-module {

    padding: 145px 0 155px;

}

}

@media only screen and (min-width: 1041px) {

.product-sec {

    padding: 155px 0;

}

.product-sec h1.heading{

    margin: 0 0 133px 0;

}

.product-sec .product-thumb img {

    width: 320px;

    height: 320px;

    border: #FFF 25px solid;

}

} 

@media only screen and (min-width: 1199px) {

.banner .cloud-sec {

    bottom: -330px;

}
.banner-caption p{
    margin: 0 0 36px 0;
}

.story-text-sec {

    padding:220px 0 400px;

    margin-top: 220px;

}

.main-footer {

    padding: 65px 0 35px;

}

.story-text-sec h4 {

    margin: 0 0 60px 0;

}

.product-sec .product-thumb .image-sec {

    margin-bottom: 55px;

}

.product-sec .product-thumb p.title {

    font-size: 30px;

    margin: 0 0 22px 0;

}

.product-sec .product-thumb p {

    margin: 0 0 45px;

}

.product-sec .product-thumb .btn-lrnmore {

    width: 100%;

    max-width: 215px;

}

.newsletter-sec p {

    margin: 0 0 43px 0;

}

.contact-sec-module h1.heading{

    margin: 0 0 55px 0;

}

.contact-sec-module p {

    margin: 0 0 60px 0;

}

.main-footer p.social-icon {

    margin: 35px 0 45px;

}

.main-footer p{

    margin: 0 0 35px 0;

}

}

@media only screen and (min-width: 1320px) {

.nav-sup ul li a {

    font-size: 24px;

}

.banner-caption h2 {

    font-size:72px;

    margin: 0 0 30px 0;

}

.story-text-sec {

    padding:250px 0 470px;

}

}