

*,
::before,
::after {
    box-sizing: border-box;
    margin: 0px;
    padding: 0px
}

body,h1, h2, h3, h4, h5, h6,* {
    font-family: "futura-pt", Helvetica, Arial, sans-serif;
}

ul{
    margin: 0px;
}

/* --- General helpers --- */
.inline {  display: inline-block; }
.hide { display: none; }


/* --- Paddings --- */
/* All */
.p0 { padding: 0; }
.p5 { padding: 5px; }
.p10 { padding: 10px; }
.p15 { padding: 15px; }
.p20 { padding: 20px; }

/* Top */
.pt0 { padding-top: 0; }
.pt5 { padding-top: 5px; }
.pt10 { padding-top: 10px; }
.pt15 { padding-top: 15px; }
.pt20 { padding-top: 20px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }
.pt50 { padding-top: 50px; }

/* Right */
.pr0 { padding-right: 0; }
.pr5 { padding-right: 5px; }
.pr10 { padding-right: 10px; }
.pr15 { padding-right: 15px; }
.pr20 { padding-right: 20px; }
.pr30 { padding-right: 30px; }
.pr40 { padding-right: 40px; }
.pr50 { padding-right: 50px; }

/* Bottom */
.pb0 { padding-bottom: 0; }
.pb5 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }
.pb15 { padding-bottom: 15px; }
.pb20 { padding-bottom: 20px; }
.pb30 { padding-bottom: 30px; }
.pb40 { padding-bottom: 40px; }
.pb50 { padding-bottom: 50px; }
.pb60 { padding-bottom: 60px; }

/* Left */
.pl0 { padding-left: 0; }
.pl5 { padding-left: 5px; }
.pl10 { padding-left: 10px; }
.pl15 { padding-left: 15px; }
.pl20 { padding-left: 20px; }

/* Left & Right */
.plr0 { padding-left: 0; padding-right: 0; }
.plr5 { padding-left: 5px; padding-right: 5px; }
.plr10 { padding-left: 10px; padding-right: 10px; }
.plr20 { padding-left: 20px; padding-right: 20px; }
.plr25 { padding-left: 25px; padding-right: 25px; }
.plr30 { padding-left: 30px; padding-right: 30px; }
.plr40 { padding-left: 40px; padding-right: 40px; }
.plr80 { padding-left: 80px; padding-right: 80px; }
.plr120 { padding-left: 120px; padding-right: 120px; }

/* Top & Bottom */
.ptb0 { padding-top: 0; padding-bottom: 0; }
.ptb5 { padding-top: 5px; padding-bottom: 5px; }
.ptb15 { padding-top: 15px; padding-bottom: 15px; }
.ptb20 { padding-top: 20px; padding-bottom: 20px; }
.ptb25 { padding-top: 25px; padding-bottom: 25px; }
.ptb40 { padding-top: 40px; padding-bottom: 40px; }
.ptb80 { padding-top: 80px; padding-bottom: 80px; }
.ptb120 { padding-top: 120px; padding-bottom: 120px; }


/* --- Margins --- */

/* All */
.m0 { margin: 0; }
.m5 { margin: 5px; }
.m10 { margin: 10px; }
.m15 { margin: 15px; }
.m20 { margin: 20px; }

/* Top */
.mt0 { margin-top: 0; }
.mt5 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt50 { margin-top: 50px; }
.mt60 { margin-top: 60px; }
.mt80 { margin-top: 80px; }
.mt90 { margin-top: 90px; }
.mt100 { margin-top: 100px; }

/* Right */
.mr0 { margin-right: 0; }
.mr5 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.mr15 { margin-right: 15px; }
.mr20 { margin-right: 20px; }
.mr50 { margin-right: 50px; }

/* Bottom */
.mb0 { margin-bottom: 0; }
.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb50 { margin-bottom: 50px; }
.mb60 { margin-bottom: 60px; }
.mb80 { margin-bottom: 80px; }
.mb90 { margin-bottom: 90px; }
.mb100 { margin-bottom: 100px; }

/* Left */
.ml0 { margin-left: 0; }
.ml5 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml15 { margin-left: 15px; }
.mb50 { margin-bottom: 50px; }

/* Left & Right */
.center { margin-left: auto; margin-right: auto; }
.mlr0 { margin-left: 0; margin-right: 0; }
.mlr5 { margin-left: 5px; margin-right: 5px; }
.mlr10 { margin-left: 10px; margin-right: 10px; }
.mlr15 { margin-left: 15px; margin-right: 15px; }
.mlr20 { margin-left: 20px; margin-right: 20px; }
.mlr30 { margin-left: 30px; margin-right: 30px; }
.mlr40 { margin-left: 40px; margin-right: 40px; }

/* Top & Bottom */
.mtb0 { margin-top: 0; margin-bottom: 0; }
.mtb5 { margin-top: 5px; margin-bottom: 5px; }
.mtb10 { margin-top: 10px; margin-bottom: 10px; }
.mtb15 { margin-top: 15px; margin-bottom: 15px; }
.mtb20 { margin-top: 20px; margin-bottom: 20px; }
.mtb20 { margin-top: 20px; margin-bottom: 20px; }
.mtb40 { margin-top: 40px; margin-bottom: 40px; }


/* --- Widths --- */
.w-third { width: 33.33333%; }
.w-two-thirds { width: 66.66667%; }

.w-100 { width: 100%; }
.w-90 { width: 90%; }
.w-80 { width: 80%; }
.w-75 { width: 75%; }
.w-70 { width: 70%; }
.w-60 { width: 60%; }
.w-50 { width: 50%; }
.w-40 { width: 40%; }
.w-30 { width: 30%; }
.w-25 { width: 25%; }
.w-20 { width: 20%; }
.w-10 { width: 10%; }

/* Font weights */
.fw100 { font-weight: 100; } /* Thin 100 */
.fw300 { font-weight: 300; } /* Light 300 */
.fw400 { font-weight: 400; } /* Regular 400 */
.fw500 { font-weight: 500; } /* Regular 400 */
.fw600 { font-weight: 600; } /* Semibold 600 */
.fw700 { font-weight: 700; } /* Bold 700 */
.fw800 { font-weight: 800; } /* Extrabold 800 */
.fw900 { font-weight: 900; } /* Black 900 */

.text-center { text-align: center; }

.aw-color { color: #F36C2D; }
a.aw-color:hover,
a.aw-hover-color:hover { color: #c4410d; }
.black { color: #000; }
.white { color: #fff; }

.white{
    cursor: unset;
}

.white:hover{
    text-decoration: none;
    cursor: normal;
}

.bg-black { background: #000; }

body {
    color: #888;
    line-height: 1.5;
    font-size: 14px;
    font-family: "proxima-nova", sans-serif;
}

section

sub, sup {
    font-size: 60%;
}

/* Top Bar */

.navigation__top a {
    color: #fff;
    font-size: 15px;
}

.nav__item{
    list-style-type: none;
}

.header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1;
    background: rgba(0, 0, 0, 0.6);
    transition: all 0.25s ease-out;
    color: white;
}

.header .navigation__bottom {
    padding-top: 0.6rem;
}

.nav__link {
    color: white;
    padding: 5px 15px;
    border: 1px solid transparent;
    text-decoration: none;
    transition: all 0.25s ease-out;
    margin-top: 0px;
    margin-bottom: 0px;
    text-align: center;
    display: block;
    font-size: 16px;
}

.header .container {
    padding-bottom: 0.4rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.header .navigation__top {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    padding-bottom: 0.6rem;
}

.header.top-bar {
    background: #fff;
    color: #4a4a4a;
    transition: all 0.25s ease-out
}

.header.top-bar .container {
    padding: 13px 0;
    font-size: 16px;
    line-height: 24px;
    height: 52px;
}

.header.top-bar p {
    margin-bottom: 0;
    font-weight: 400;
}

.header.top-bar a.retailer-name {
    color: #4a4a4a;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 16px;
}
.header.top-bar a.retailer-name:hover {
    color: #F36C2D;
    text-decoration: none;
}


.italic {
    font-style: italic;
    font-weight: 700;
    font-size: 1.875rem
}

.light {
    border-color: #476180
}

.title,
.contactus__title {
    font-size: 3.125rem;
    margin: 1.125rem;
    font-weight: 700
}

.subtitle {
    font-size: 1.125rem
}

.img {
    display: block;
    height: 257px;
    background: lightgray
}



.header--inner.anim .navigation .navigation__top {
    font-size: 13px
}

.op-05 {
    opacity: 0.5
}

.op-07 {
    opacity: 0.7
}

.bold-700 {
    font-weight: 700
}

.hide {
    visibility: hidden
}

.products,
.contactus {
    background-color: #F7F7F7
}

.products {
    text-align: center;
    padding-top: 70px;
    padding-bottom: 90px;
}

.hero {
    position: relative;
    background: url(../images/ppc/AW-Home-Hero.jpg);
    color: white;
    padding-top: 0rem;
    padding-bottom: 0rem;
    overflow: hidden;
    height: 1060px;
    justify-content: space-between;
    align-items: center;
}

.hero-black-bg {
    background-color: rgba(0, 0, 0, 0.7);
    padding-top: 35px;
    padding-bottom: 35px;
    color: #fff;
}

.hero .left-side {
    width: 780px;
}

.hero .right-side {
    width: 50%;
}

.hero .title-container {
    margin-left: 175px;
}

.hero__title {
    font-size: 67px;
    font-weight: 700;
    line-height: 76px;
}

.hero .subtitle {
    font-size: 23px;
}

.hero .divider {
    height: 2px;
    background: #fff;
    width: 450px;
}

.hero .container {
    position: absolute;
    z-index: 0;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0
}

.g-recaptcha{
    display: flex;
    justify-content: center;
    align-items: center;
}

form .has-error .form-control {
    border-color: red !important;
}
.g-recaptcha.highlight-input .rc-anchor-light.rc-anchor-normal {
    border: 1px solid red;
}

.hero .form {
    color: #2d3345;
    background-color: white;
    padding: 1.875rem;
    width: 363px;
}

.hero .form .h4-like {
    margin-bottom: 20px;
    font-size: 1.5rem;
    font-family: "futura-pt", Helvetica, Arial, sans-serif;
}
.hero .form-group {
    margin-bottom: 13px;
}

.hero .section-captcha {
    margin-bottom: 13px;
}

.hero .section-captcha .g-recaptcha > div,
.hero .section-captcha .g-recaptcha iframe,
.hero .section-captcha .g-recaptcha .rc-anchor-normal {
    /* width: 100% !important; */
}
.hero .form-control,
.hero select.form-control {
    border: 1px solid #ddd;
    padding: 0 14px 1px 15px;
    height: 40px !important;
}

.hero textarea.form-control {
  height: 60px !important;
}

.hero select.form-control {
    padding: 0 9px 1px 10px;
}

.form-control::placeholder,
select.form-control:required:invalid {
    color: #A7A7A7;
    opacity: 1;
  }

.hero .form__btn {
    width: 100%;
    background-color: #fff;
    border-color: #F16128;
    color: #F16128;
    text-transform: uppercase;
    font-weight: 700;
    height: 45px;
    border-radius: 3px;
}

@media (max-width: 1500px) {
    .hero .left-side {
        width: 625px;
    }

    .hero .title-container {
        margin-left: 150px;
    }

    .hero__title {
        font-size: 62px;
        line-height: 70px;
    }

    .hero .divider {
        width: 415px;
    }
}

@media (max-width: 1300px) {
    .hero .left-side {
        width: 600px;
    }

    .hero .title-container {
        margin-left: 140px;
    }

    .hero__title {
        font-size: 58px;
        line-height: 68px;
    }

    .hero .divider {
        width: 390px;
    }

    .hero .right-side {
        width: 40%;
    }
}

@media (max-width: 1050px) {
    .hero .right-side {
        width: 50%;
    }
    .hero .left-side {
        width: 50%;
    }
    .hero .title-container {
        margin-left: 10%;
    }
}

@media (max-width: 991px) {

    .hero .left-side {
        width: 440px;
    }
    .hero .title-container {
        margin-left: 52px;
    }
    .hero__title {
        font-size: 53px;
        line-height: 63px;
    }
    .hero .divider {
        width: 356px;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .hero .subtitle {
        font-size: 21px;
    }

    .hero .right-side {
        width: 45%;
        align-self: center;
        margin-bottom: 25px;
    }

    .hero .form {
        width: 90%;
        padding: 20px;
    }
    .hero .form-group {
        flex-direction: column;
        margin-bottom: 0;
    }
    .hero .form-control {
        margin-bottom: 11px;
    }
    .hero .form-control {
        padding: 10px 16px 11px;
        height: 35px;
    }
    .hero select.form-control {
        padding: 7px 13px 7px;
    }
    .hero {
        height: 1190px;
}}

@media (max-width: 850px) {
.hero .left-side {
        width: 395px;
    }
    .hero .title-container {
        margin-left: 52px;
    }
    .hero__title {
        font-size: 45px;
        line-height: 58px;
    }
    .hero .divider {
        width: 305px;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .hero .subtitle {
        font-size: 19px;
    }
}

@media (max-width: 767px) {
    .hero {
        flex-direction: column;
    }
    .hero .right-side {
        width: 100%;
        align-self: auto;
        margin-bottom: 30px;
    }

    .hero .left-side {
        width: 100%;
    }

    .hero .left-side {
        width: 100%;
        margin-top: 250px;
        margin-bottom: 50px;
    }

    .hero .title-container {
        margin-left: 0;
        text-align: center;
    }
    .hero__title br {
        display: none;
    }
    .hero .divider {
        width: 90%;
        margin: 15px auto;
    }
    .hero .form-group {
        flex-direction: row;
        margin-bottom: 0;
    }


}

@media (max-width: 576px) {
    .hero {
        text-align: center;
        scroll-padding-bottom: 6.25rem
    }
    .hero .italic {
        font-size: 1.5rem
    }
    .hero .form {
        margin-left: 20px;
        margin-right: 20px
    }

    .hero .left-side {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .hero {
        justify-content: space-evenly;
    }
    .hero__title {
        font-size: 40px;
        line-height: 55px;
    }

    .hero .title-container {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
    }
}

@media (max-width: 420px) {
    .hero .form-group {
        flex-direction: column;
        margin-bottom: 0;
    }
    .hero__title {
        font-size: 36px;
        line-height: 45px;
    }
    .hero {
        height: 1530px;
    }
}

@media (max-width: 325px) {

    .hero {
        height: 1025px;
    }
    .hero .left-side {
        margin-top: 40px;
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .hero__title {
        font-size: 30px;
        line-height: 36px;
    }
    .hero .divider {
        width: 90%;
        margin: 10px auto;
    }
    .hero .subtitle {
        font-size: 17px;
    }
}


h1.products__title,
h2.experience__title,
h2.find-us__title {
    font-size: 38px;
    font-weight: 300;
    color: #000;
    margin-top: 20px;
    margin-bottom: 45px;
}

.products__intro,
.brands__intro,
.experience__intro {
    font-size: 18px;
    color: #000;
    margin-top: 25px;
    margin-bottom: 45px;
    line-height: 24px;
}

@media (max-width: 767px) {
    h1.products__title,
    h2.experience__title {
        font-size: 30px;
        font-weight: 400;
        margin-top: 0;
        margin-bottom: 25px;
    }
}

p.disclaimer {
    font-size: 12px;
    color: #000;
}

.experience,
.find-us {
    text-align: center;
    padding-top: 70px;
    padding-bottom: 90px;
}

.experience__info img {
   width: 80px;
   height: 80px;
    align-self: center;
}

.experience__icon {
    height: 70px;
    width: 70px;
    margin: 1.125rem auto;
    display: flex;
    justify-content: center
}

.experience__icon span {
    text-align: center;
    font-size: 1.875rem;
    align-self: center
}

.experience__item {
    margin: 0 20px;
    width: 17%;
}


.experience__item-title {
    font-size: 18px;
    color: #000;
    margin-bottom: 20px;
    height: 40px;
    font-weight: 600;
}

.experience__desc {
    font-size: 18px;
    color: #000;
    line-height: 22px;
}

@media (max-width: 991px) {
    .experience__icons-section { flex-wrap: wrap !important; }

    .experience__icons-section .experience__item {
        margin: 0 5% 30px 5%;
        width: 40%;
    }
    .experience__item-title { height: auto; }
}
@media (max-width: 580px) {
    .experience__icons-section .experience__item {
        margin: 0 auto 30px auto;
        width: 300px;
    }
}
@media (max-width: 380px) {
    .experience__icons-section .experience__item { width: 90%; }
}

.testimonials {
    position: relative;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    padding-top: 100px;
    padding-bottom: 100px;
    display: flex;
    align-items: center;
    height: 570px;
}

.testimonials .testimonial-quotes {
    margin-bottom: 25px;
}

.testimonials .testimonial {
    text-align: center;
    display: none;
}

.testimonials .testimonial.active {
    display: flex;
}

.testimonials .testimonial__slide {
    width: 60%;
    margin: 0 auto
}

.testimonials .testimonial__divider {
    width: 200px;
    height: 0.5px;
    background: rgba(255, 255, 255, 0.3);
    margin-bottom: 25px;
    margin-top: 100px;
}

.testimonials .testimonial__desc {
    font-size: 20px;
    font-weight: 200;
    line-height: 25px;
}

.testimonials .testimonial__name {
    font-size: 18px;
    color: white;
    font-weight: 300;
    margin-bottom: 0;
}

.testimonials .testimonial__position {
    font-size: 13px;
    font-style: italic;
    font-weight: 200;
    margin-bottom: 20px;
}

.testimonials .testimonial__background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(../images/ppc/AW-testimonials-bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    z-index: -1;
    background-position: center;
}

.indicator {
    position: relative;
    margin-top: 20px;
}

.carousel-indicators li.indicator__item {
    width: 10px !important;
    height: 10px !important;
    border-radius: 100%;
    background-color: transparent;
    margin-right: 20px;
    border: 2px solid #C4C4C4;
}

.carousel-indicators li.indicator__item.active {
    background-color: #A6A6A6 !important
}

.carousel-indicators li.indicator__item:last-child {
    margin-right: 0
}

.carousel-indicators li.indicator__item:focus {
    outline: 0px !important;
    background-color: #A6A6A6 !important
}

@media (max-width: 767px) {
    .testimonials .testimonial__slide {
        width: 90%;
        margin: 0 auto
    }

    .testimonials .testimonial__divider {
        width: 70%;
        margin-top: 70px;
    }
}

@media (max-width: 380px) {
    .testimonials {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}

/* Find us */

.find-us__location-title {
    font-size: 20px;
    color: #000;
    margin-bottom: 0;
    font-weight: 600;
}

.find-us__subtitle {
    font-size: 14px;
    color: #000;
    font-weight: 500;
}

.find-us .hor-divider {
    background: #F37543;
    height: 1px;
    width: 100%;
    margin-bottom: 10px;
}

.find-us__item {
    text-align: left;
    color: #333;
}

.find-us__item a {
    color: #000;
}

.find-us__item a:hover {
    color: #F37543;
}

.find-us__item .table td {
    padding: 8px 10px 8px 0;
}

.find-us__item .table td:first-child {
    width: 115px
}

.find-us__item .table td,
.find-us__item .table th { border-top: none; }

.find-us .row {
    justify-content: center;
}

@font-face {
    font-family: 'icomoon';
    src: url(../images/ppc/icons/aw-icons.eot);
    src: url(../images/ppc/icons/aw-icons.eot#iefix) format("embedded-opentype"), url(../images/ppc/icons/aw-icons.ttf) format("truetype"), url(../images/ppc/icons/aw-icons.woff) format("woff"), url(../images/ppc/icons/aw-icons.svg#icomoon) format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: block
}

[class^="icon-"],
[class*=" icon-"] {
    font-family: 'icomoon' !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-building-testing-ico:before { content: "\e900" }

.icon-business-ico:before { content: "\e901" }

.icon-location-ico:before { content: "\e902" }

.icon-mail-ico:before { content: "\e903" }

.icon-monitoring-ico:before { content: "\e904" }

.icon-phone-ico:before { content: "\e905" }

.icon-system-design-ico:before { content: "\e906" }

.icon-visual-design-ico:before { content: "\e907" }

.icon-phone:before { content: "\e942" }

.icon-google:before { content: "\ea88" }

.icon-facebook:before { content: "\ea90" }

.icon-twitter:before { content: "\ea96" }

.innerpage {
    background-color: rgba(45, 51, 69, 0.6);
    position: relative
}

.innerpage--white { background-color: #fff }

.innerpage .container { min-height: 100vh }

.innerpage__bg {
    background-image: url(../images/ppc/AW-Home-Hero.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1
}

.innerpage__desc {
    color: white;
    text-align: center
}

.innerpage__desc h1 {
    font-size: 3.125rem;
    font-weight: 700
}

.innerpage__desc p {
    align-self: center;
    font-size: 1.5rem
}

.innerpage .terms {
    margin-top: 9.375rem;
    margin-bottom: 9.375rem
}

.innerpage .terms h1 {
    color: #2d3345;
    font-size: 3.125rem;
    font-weight: 700
}


@-webkit-keyframes bounce {
    from,
    20%,
    53%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translate3d(0, 0, 0)
    }
    40%,
    43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0, -30px, 0)
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        transform: translate3d(0, -4px, 0)
    }
}

@keyframes bounce {
    from,
    20%,
    53%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        transform: translate3d(0, 0, 0)
    }
    40%,
    43% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0, -30px, 0)
    }
    70% {
        -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
        transform: translate3d(0, -15px, 0)
    }
    90% {
        transform: translate3d(0, -4px, 0)
    }
}

.bounce {
    -webkit-animation-name: bounce;
    animation-name: bounce;
    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
}

@-webkit-keyframes pulse {
    from {
        transform: scale3d(1, 1, 1)
    }
    50% {
        transform: scale3d(1.05, 1.05, 1.05)
    }
    to {
        transform: scale3d(1, 1, 1)
    }
}

@keyframes pulse {
    from {
        transform: scale3d(1, 1, 1)
    }
    50% {
        transform: scale3d(1.05, 1.05, 1.05)
    }
    to {
        transform: scale3d(1, 1, 1)
    }
}

.pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse
}

@-webkit-keyframes rubberBand {
    from {
        transform: scale3d(1, 1, 1)
    }
    30% {
        transform: scale3d(1.25, 0.75, 1)
    }
    40% {
        transform: scale3d(0.75, 1.25, 1)
    }
    50% {
        transform: scale3d(1.15, 0.85, 1)
    }
    65% {
        transform: scale3d(0.95, 1.05, 1)
    }
    75% {
        transform: scale3d(1.05, 0.95, 1)
    }
    to {
        transform: scale3d(1, 1, 1)
    }
}

@keyframes rubberBand {
    from {
        transform: scale3d(1, 1, 1)
    }
    30% {
        transform: scale3d(1.25, 0.75, 1)
    }
    40% {
        transform: scale3d(0.75, 1.25, 1)
    }
    50% {
        transform: scale3d(1.15, 0.85, 1)
    }
    65% {
        transform: scale3d(0.95, 1.05, 1)
    }
    75% {
        transform: scale3d(1.05, 0.95, 1)
    }
    to {
        transform: scale3d(1, 1, 1)
    }
}

.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand
}

@-webkit-keyframes shake {
    from,
    to {
        transform: translate3d(0, 0, 0)
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate3d(-10px, 0, 0)
    }
    20%,
    40%,
    60%,
    80% {
        transform: translate3d(10px, 0, 0)
    }
}

@keyframes shake {
    from,
    to {
        transform: translate3d(0, 0, 0)
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate3d(-10px, 0, 0)
    }
    20%,
    40%,
    60%,
    80% {
        transform: translate3d(10px, 0, 0)
    }
}

.shake {
    -webkit-animation-name: shake;
    animation-name: shake
}

@-webkit-keyframes headShake {
    0% {
        transform: translateX(0)
    }
    6.5% {
        transform: translateX(-6px) rotateY(-9deg)
    }
    18.5% {
        transform: translateX(5px) rotateY(7deg)
    }
    31.5% {
        transform: translateX(-3px) rotateY(-5deg)
    }
    43.5% {
        transform: translateX(2px) rotateY(3deg)
    }
    50% {
        transform: translateX(0)
    }
}

@keyframes headShake {
    0% {
        transform: translateX(0)
    }
    6.5% {
        transform: translateX(-6px) rotateY(-9deg)
    }
    18.5% {
        transform: translateX(5px) rotateY(7deg)
    }
    31.5% {
        transform: translateX(-3px) rotateY(-5deg)
    }
    43.5% {
        transform: translateX(2px) rotateY(3deg)
    }
    50% {
        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% {
        transform: rotate3d(0, 0, 1, 15deg)
    }
    40% {
        transform: rotate3d(0, 0, 1, -10deg)
    }
    60% {
        transform: rotate3d(0, 0, 1, 5deg)
    }
    80% {
        transform: rotate3d(0, 0, 1, -5deg)
    }
    to {
        transform: rotate3d(0, 0, 1, 0deg)
    }
}

@keyframes swing {
    20% {
        transform: rotate3d(0, 0, 1, 15deg)
    }
    40% {
        transform: rotate3d(0, 0, 1, -10deg)
    }
    60% {
        transform: rotate3d(0, 0, 1, 5deg)
    }
    80% {
        transform: rotate3d(0, 0, 1, -5deg)
    }
    to {
        transform: rotate3d(0, 0, 1, 0deg)
    }
}

.swing {
    transform-origin: top center;
    -webkit-animation-name: swing;
    animation-name: swing
}

@-webkit-keyframes tada {
    from {
        transform: scale3d(1, 1, 1)
    }
    10%,
    20% {
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)
    }
    30%,
    50%,
    70%,
    90% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
    }
    40%,
    60%,
    80% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
    }
    to {
        transform: scale3d(1, 1, 1)
    }
}

@keyframes tada {
    from {
        transform: scale3d(1, 1, 1)
    }
    10%,
    20% {
        transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg)
    }
    30%,
    50%,
    70%,
    90% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
    }
    40%,
    60%,
    80% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
    }
    to {
        transform: scale3d(1, 1, 1)
    }
}

.tada {
    -webkit-animation-name: tada;
    animation-name: tada
}

@-webkit-keyframes wobble {
    from {
        transform: translate3d(0, 0, 0)
    }
    15% {
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
    }
    30% {
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
    }
    45% {
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
    }
    60% {
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
    }
    75% {
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes wobble {
    from {
        transform: translate3d(0, 0, 0)
    }
    15% {
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
    }
    30% {
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
    }
    45% {
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
    }
    60% {
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
    }
    75% {
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

.wobble {
    -webkit-animation-name: wobble;
    animation-name: wobble
}

@-webkit-keyframes jello {
    from,
    11.1%,
    to {
        transform: translate3d(0, 0, 0)
    }
    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }
    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg)
    }
    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }
    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }
    66.6% {
        transform: skewX(-0.78125deg) skewY(-0.78125deg)
    }
    77.7% {
        transform: skewX(0.39063deg) skewY(0.39063deg)
    }
    88.8% {
        transform: skewX(-0.19531deg) skewY(-0.19531deg)
    }
}

@keyframes jello {
    from,
    11.1%,
    to {
        transform: translate3d(0, 0, 0)
    }
    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }
    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg)
    }
    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }
    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }
    66.6% {
        transform: skewX(-0.78125deg) skewY(-0.78125deg)
    }
    77.7% {
        transform: skewX(0.39063deg) skewY(0.39063deg)
    }
    88.8% {
        transform: skewX(-0.19531deg) skewY(-0.19531deg)
    }
}

.jello {
    -webkit-animation-name: jello;
    animation-name: jello;
    transform-origin: center
}

@-webkit-keyframes heartBeat {
    0% {
        transform: scale(1)
    }
    14% {
        transform: scale(1.3)
    }
    28% {
        transform: scale(1)
    }
    42% {
        transform: scale(1.3)
    }
    70% {
        transform: scale(1)
    }
}

@keyframes heartBeat {
    0% {
        transform: scale(1)
    }
    14% {
        transform: scale(1.3)
    }
    28% {
        transform: scale(1)
    }
    42% {
        transform: scale(1.3)
    }
    70% {
        transform: scale(1)
    }
}

.heartBeat {
    -webkit-animation-name: heartBeat;
    animation-name: heartBeat;
    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out
}

@-webkit-keyframes bounceIn {
    from,
    20%,
    40%,
    60%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    0% {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3)
    }
    20% {
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        transform: scale3d(0.9, 0.9, 0.9)
    }
    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        transform: scale3d(0.97, 0.97, 0.97)
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1)
    }
}

@keyframes bounceIn {
    from,
    20%,
    40%,
    60%,
    80%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    0% {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3)
    }
    20% {
        transform: scale3d(1.1, 1.1, 1.1)
    }
    40% {
        transform: scale3d(0.9, 0.9, 0.9)
    }
    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03)
    }
    80% {
        transform: scale3d(0.97, 0.97, 0.97)
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1)
    }
}

.bounceIn {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn
}

@-webkit-keyframes bounceInDown {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    0% {
        opacity: 0;
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        opacity: 1;
        transform: translate3d(0, 25px, 0)
    }
    75% {
        transform: translate3d(0, -10px, 0)
    }
    90% {
        transform: translate3d(0, 5px, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes bounceInDown {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    0% {
        opacity: 0;
        transform: translate3d(0, -3000px, 0)
    }
    60% {
        opacity: 1;
        transform: translate3d(0, 25px, 0)
    }
    75% {
        transform: translate3d(0, -10px, 0)
    }
    90% {
        transform: translate3d(0, 5px, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

.bounceInDown {
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown
}

@-webkit-keyframes bounceInLeft {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    0% {
        opacity: 0;
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        opacity: 1;
        transform: translate3d(25px, 0, 0)
    }
    75% {
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        transform: translate3d(5px, 0, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes bounceInLeft {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    0% {
        opacity: 0;
        transform: translate3d(-3000px, 0, 0)
    }
    60% {
        opacity: 1;
        transform: translate3d(25px, 0, 0)
    }
    75% {
        transform: translate3d(-10px, 0, 0)
    }
    90% {
        transform: translate3d(5px, 0, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft
}

@-webkit-keyframes bounceInRight {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    from {
        opacity: 0;
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        opacity: 1;
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        transform: translate3d(10px, 0, 0)
    }
    90% {
        transform: translate3d(-5px, 0, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes bounceInRight {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    from {
        opacity: 0;
        transform: translate3d(3000px, 0, 0)
    }
    60% {
        opacity: 1;
        transform: translate3d(-25px, 0, 0)
    }
    75% {
        transform: translate3d(10px, 0, 0)
    }
    90% {
        transform: translate3d(-5px, 0, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

.bounceInRight {
    -webkit-animation-name: bounceInRight;
    animation-name: bounceInRight
}

@-webkit-keyframes bounceInUp {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    from {
        opacity: 0;
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }
    75% {
        transform: translate3d(0, 10px, 0)
    }
    90% {
        transform: translate3d(0, -5px, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes bounceInUp {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
    }
    from {
        opacity: 0;
        transform: translate3d(0, 3000px, 0)
    }
    60% {
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }
    75% {
        transform: translate3d(0, 10px, 0)
    }
    90% {
        transform: translate3d(0, -5px, 0)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

.bounceInUp {
    -webkit-animation-name: bounceInUp;
    animation-name: bounceInUp
}

@-webkit-keyframes bounceOut {
    20% {
        transform: scale3d(0.9, 0.9, 0.9)
    }
    50%,
    55% {
        opacity: 1;
        transform: scale3d(1.1, 1.1, 1.1)
    }
    to {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3)
    }
}

@keyframes bounceOut {
    20% {
        transform: scale3d(0.9, 0.9, 0.9)
    }
    50%,
    55% {
        opacity: 1;
        transform: scale3d(1.1, 1.1, 1.1)
    }
    to {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3)
    }
}

.bounceOut {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: bounceOut;
    animation-name: bounceOut
}

@-webkit-keyframes bounceOutDown {
    20% {
        transform: translate3d(0, 10px, 0)
    }
    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }
    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

@keyframes bounceOutDown {
    20% {
        transform: translate3d(0, 10px, 0)
    }
    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }
    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.bounceOutDown {
    -webkit-animation-name: bounceOutDown;
    animation-name: bounceOutDown
}

@-webkit-keyframes bounceOutLeft {
    20% {
        opacity: 1;
        transform: translate3d(20px, 0, 0)
    }
    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        transform: translate3d(20px, 0, 0)
    }
    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.bounceOutLeft {
    -webkit-animation-name: bounceOutLeft;
    animation-name: bounceOutLeft
}

@-webkit-keyframes bounceOutRight {
    20% {
        opacity: 1;
        transform: translate3d(-20px, 0, 0)
    }
    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

@keyframes bounceOutRight {
    20% {
        opacity: 1;
        transform: translate3d(-20px, 0, 0)
    }
    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.bounceOutRight {
    -webkit-animation-name: bounceOutRight;
    animation-name: bounceOutRight
}

@-webkit-keyframes bounceOutUp {
    20% {
        transform: translate3d(0, -10px, 0)
    }
    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, 20px, 0)
    }
    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

@keyframes bounceOutUp {
    20% {
        transform: translate3d(0, -10px, 0)
    }
    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, 20px, 0)
    }
    to {
        opacity: 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;
        transform: translate3d(0, -100%, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown
}

@-webkit-keyframes fadeInDownBig {
    from {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInDownBig {
    from {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.fadeInDownBig {
    -webkit-animation-name: fadeInDownBig;
    animation-name: fadeInDownBig
}

@-webkit-keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft
}

@-webkit-keyframes fadeInLeftBig {
    from {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInLeftBig {
    from {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.fadeInLeftBig {
    -webkit-animation-name: fadeInLeftBig;
    animation-name: fadeInLeftBig
}

@-webkit-keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight
}

@-webkit-keyframes fadeInRightBig {
    from {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInRightBig {
    from {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.fadeInRightBig {
    -webkit-animation-name: fadeInRightBig;
    animation-name: fadeInRightBig
}

@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp
}

@-webkit-keyframes fadeInUpBig {
    from {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes fadeInUpBig {
    from {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.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;
        transform: translate3d(0, 100%, 0)
    }
}

@keyframes fadeOutDown {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
}

.fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    animation-name: fadeOutDown
}

@-webkit-keyframes fadeOutDownBig {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

@keyframes fadeOutDownBig {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.fadeOutDownBig {
    -webkit-animation-name: fadeOutDownBig;
    animation-name: fadeOutDownBig
}

@-webkit-keyframes fadeOutLeft {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
}

@keyframes fadeOutLeft {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft
}

@-webkit-keyframes fadeOutLeftBig {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

@keyframes fadeOutLeftBig {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.fadeOutLeftBig {
    -webkit-animation-name: fadeOutLeftBig;
    animation-name: fadeOutLeftBig
}

@-webkit-keyframes fadeOutRight {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
}

@keyframes fadeOutRight {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
}

.fadeOutRight {
    -webkit-animation-name: fadeOutRight;
    animation-name: fadeOutRight
}

@-webkit-keyframes fadeOutRightBig {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

@keyframes fadeOutRightBig {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.fadeOutRightBig {
    -webkit-animation-name: fadeOutRightBig;
    animation-name: fadeOutRightBig
}

@-webkit-keyframes fadeOutUp {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
}

@keyframes fadeOutUp {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
}

.fadeOutUp {
    -webkit-animation-name: fadeOutUp;
    animation-name: fadeOutUp
}

@-webkit-keyframes fadeOutUpBig {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

@keyframes fadeOutUpBig {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

.fadeOutUpBig {
    -webkit-animation-name: fadeOutUpBig;
    animation-name: fadeOutUpBig
}

@-webkit-keyframes flip {
    from {
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    40% {
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    50% {
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    80% {
        transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    to {
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

@keyframes flip {
    from {
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    40% {
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    50% {
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    80% {
        transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    to {
        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
        -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 {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    to {
        transform: perspective(400px)
    }
}

@keyframes flipInX {
    from {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    to {
        transform: perspective(400px)
    }
}

.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX
}

@-webkit-keyframes flipInY {
    from {
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1
    }
    80% {
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg)
    }
    to {
        transform: perspective(400px)
    }
}

@keyframes flipInY {
    from {
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }
    40% {
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    60% {
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1
    }
    80% {
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg)
    }
    to {
        transform: perspective(400px)
    }
}

.flipInY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInY;
    animation-name: flipInY
}

@-webkit-keyframes flipOutX {
    from {
        transform: perspective(400px)
    }
    30% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1
    }
    to {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
}

@keyframes flipOutX {
    from {
        transform: perspective(400px)
    }
    30% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1
    }
    to {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
}

.flipOutX {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: flipOutX;
    animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}

@-webkit-keyframes flipOutY {
    from {
        transform: perspective(400px)
    }
    30% {
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1
    }
    to {
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0
    }
}

@keyframes flipOutY {
    from {
        transform: perspective(400px)
    }
    30% {
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1
    }
    to {
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0
    }
}

.flipOutY {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipOutY;
    animation-name: flipOutY
}

@-webkit-keyframes lightSpeedIn {
    from {
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
    60% {
        transform: skewX(20deg);
        opacity: 1
    }
    80% {
        transform: skewX(-5deg)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

@keyframes lightSpeedIn {
    from {
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }
    60% {
        transform: skewX(20deg);
        opacity: 1
    }
    80% {
        transform: skewX(-5deg)
    }
    to {
        transform: translate3d(0, 0, 0)
    }
}

.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 {
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}

@keyframes lightSpeedOut {
    from {
        opacity: 1
    }
    to {
        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 {
        transform-origin: center;
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0
    }
    to {
        transform-origin: center;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes rotateIn {
    from {
        transform-origin: center;
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0
    }
    to {
        transform-origin: center;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.rotateIn {
    -webkit-animation-name: rotateIn;
    animation-name: rotateIn
}

@-webkit-keyframes rotateInDownLeft {
    from {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
    to {
        transform-origin: left bottom;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes rotateInDownLeft {
    from {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
    to {
        transform-origin: left bottom;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.rotateInDownLeft {
    -webkit-animation-name: rotateInDownLeft;
    animation-name: rotateInDownLeft
}

@-webkit-keyframes rotateInDownRight {
    from {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
    to {
        transform-origin: right bottom;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes rotateInDownRight {
    from {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
    to {
        transform-origin: right bottom;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.rotateInDownRight {
    -webkit-animation-name: rotateInDownRight;
    animation-name: rotateInDownRight
}

@-webkit-keyframes rotateInUpLeft {
    from {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
    to {
        transform-origin: left bottom;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes rotateInUpLeft {
    from {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
    to {
        transform-origin: left bottom;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.rotateInUpLeft {
    -webkit-animation-name: rotateInUpLeft;
    animation-name: rotateInUpLeft
}

@-webkit-keyframes rotateInUpRight {
    from {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0
    }
    to {
        transform-origin: right bottom;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes rotateInUpRight {
    from {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0
    }
    to {
        transform-origin: right bottom;
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.rotateInUpRight {
    -webkit-animation-name: rotateInUpRight;
    animation-name: rotateInUpRight
}

@-webkit-keyframes rotateOut {
    from {
        transform-origin: center;
        opacity: 1
    }
    to {
        transform-origin: center;
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0
    }
}

@keyframes rotateOut {
    from {
        transform-origin: center;
        opacity: 1
    }
    to {
        transform-origin: center;
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0
    }
}

.rotateOut {
    -webkit-animation-name: rotateOut;
    animation-name: rotateOut
}

@-webkit-keyframes rotateOutDownLeft {
    from {
        transform-origin: left bottom;
        opacity: 1
    }
    to {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownLeft {
    from {
        transform-origin: left bottom;
        opacity: 1
    }
    to {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
}

.rotateOutDownLeft {
    -webkit-animation-name: rotateOutDownLeft;
    animation-name: rotateOutDownLeft
}

@-webkit-keyframes rotateOutDownRight {
    from {
        transform-origin: right bottom;
        opacity: 1
    }
    to {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownRight {
    from {
        transform-origin: right bottom;
        opacity: 1
    }
    to {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}

.rotateOutDownRight {
    -webkit-animation-name: rotateOutDownRight;
    animation-name: rotateOutDownRight
}

@-webkit-keyframes rotateOutUpLeft {
    from {
        transform-origin: left bottom;
        opacity: 1
    }
    to {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}

@keyframes rotateOutUpLeft {
    from {
        transform-origin: left bottom;
        opacity: 1
    }
    to {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}

.rotateOutUpLeft {
    -webkit-animation-name: rotateOutUpLeft;
    animation-name: rotateOutUpLeft
}

@-webkit-keyframes rotateOutUpRight {
    from {
        transform-origin: right bottom;
        opacity: 1
    }
    to {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0
    }
}

@keyframes rotateOutUpRight {
    from {
        transform-origin: right bottom;
        opacity: 1
    }
    to {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0
    }
}

.rotateOutUpRight {
    -webkit-animation-name: rotateOutUpRight;
    animation-name: rotateOutUpRight
}

@-webkit-keyframes hinge {
    0% {
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    20%,
    60% {
        transform: rotate3d(0, 0, 1, 80deg);
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    40%,
    80% {
        transform: rotate3d(0, 0, 1, 60deg);
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }
    to {
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

@keyframes hinge {
    0% {
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    20%,
    60% {
        transform: rotate3d(0, 0, 1, 80deg);
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }
    40%,
    80% {
        transform: rotate3d(0, 0, 1, 60deg);
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }
    to {
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

.hinge {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-name: hinge;
    animation-name: hinge
}

@-webkit-keyframes jackInTheBox {
    from {
        opacity: 0;
        transform: scale(0.1) rotate(30deg);
        transform-origin: center bottom
    }
    50% {
        transform: rotate(-10deg)
    }
    70% {
        transform: rotate(3deg)
    }
    to {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes jackInTheBox {
    from {
        opacity: 0;
        transform: scale(0.1) rotate(30deg);
        transform-origin: center bottom
    }
    50% {
        transform: rotate(-10deg)
    }
    70% {
        transform: rotate(3deg)
    }
    to {
        opacity: 1;
        transform: scale(1)
    }
}

.jackInTheBox {
    -webkit-animation-name: jackInTheBox;
    animation-name: jackInTheBox
}

@-webkit-keyframes rollIn {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

@keyframes rollIn {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}

.rollIn {
    -webkit-animation-name: rollIn;
    animation-name: rollIn
}

@-webkit-keyframes rollOut {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)
    }
}

@keyframes rollOut {
    from {
        opacity: 1
    }
    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)
    }
}

.rollOut {
    -webkit-animation-name: rollOut;
    animation-name: rollOut
}

@-webkit-keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3)
    }
    50% {
        opacity: 1
    }
}

@keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3)
    }
    50% {
        opacity: 1
    }
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}

@-webkit-keyframes zoomInDown {
    from { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    60% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

@keyframes zoomInDown {
    from { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    60% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown
}

@-webkit-keyframes zoomInLeft {
    from { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    60% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

@keyframes zoomInLeft {
    from { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    60% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

.zoomInLeft {
    -webkit-animation-name: zoomInLeft;
    animation-name: zoomInLeft
}

@-webkit-keyframes zoomInRight {
    from {
        opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19)
    }
    60% {
        opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1)
    }
}

@keyframes zoomInRight {
    from { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    60% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

.zoomInRight {
    -webkit-animation-name: zoomInRight;
    animation-name: zoomInRight
}

@-webkit-keyframes zoomInUp {
    from { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    60% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

@keyframes zoomInUp {
    from { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    60% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

.zoomInUp {
    -webkit-animation-name: zoomInUp;
    animation-name: zoomInUp
}

@-webkit-keyframes zoomOut {
    from { opacity: 1 }
    50% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3) }
    to { opacity: 0 }
}

@keyframes zoomOut {
    from { opacity: 1 }
    50% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3) }
    to { opacity: 0 }
}

.zoomOut {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut
}

@-webkit-keyframes zoomOutDown {
    40% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    to { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

@keyframes zoomOutDown {
    40% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    to { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

.zoomOutDown {
    -webkit-animation-name: zoomOutDown;
    animation-name: zoomOutDown
}

@-webkit-keyframes zoomOutLeft {
    40% { opacity: 1; transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0) }
    to { opacity: 0;
        transform: scale(0.1) translate3d(-2000px, 0, 0);
        transform-origin: left center }
}

@keyframes zoomOutLeft {
    40% { opacity: 1; transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0) }
    to { opacity: 0;
        transform: scale(0.1) translate3d(-2000px, 0, 0);
        transform-origin: left center }
}

.zoomOutLeft {
    -webkit-animation-name: zoomOutLeft;
    animation-name: zoomOutLeft
}

@-webkit-keyframes zoomOutRight {
    40% { opacity: 1; transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0) }
    to { opacity: 0;
        transform: scale(0.1) translate3d(2000px, 0, 0);
        transform-origin: right center }
}

@keyframes zoomOutRight {
    40% { opacity: 1; transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0) }
    to { opacity: 0;
        transform: scale(0.1) translate3d(2000px, 0, 0);
        transform-origin: right center }
}

.zoomOutRight {
    -webkit-animation-name: zoomOutRight;
    animation-name: zoomOutRight
}

@-webkit-keyframes zoomOutUp {
    40% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    to { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

@keyframes zoomOutUp {
    40% { opacity: 1;
        transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19) }
    to { opacity: 0;
        transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
        animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1) }
}

.zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp
}

@-webkit-keyframes slideInDown {
    from { transform: translate3d(0, -100%, 0); visibility: visible }
    to { transform: translate3d(0, 0, 0) } }

@keyframes slideInDown {
    from { transform: translate3d(0, -100%, 0); visibility: visible }
    to { transform: translate3d(0, 0, 0) } }

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown
}

@-webkit-keyframes slideInLeft {
    from { transform: translate3d(-100%, 0, 0); visibility: visible }
    to { transform: translate3d(0, 0, 0) } }

@keyframes slideInLeft {
    from { transform: translate3d(-100%, 0, 0); visibility: visible }
    to { transform: translate3d(0, 0, 0) } }

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
}

@-webkit-keyframes slideInRight {
    from { transform: translate3d(100%, 0, 0); visibility: visible }
    to { transform: translate3d(0, 0, 0) }
}

@keyframes slideInRight {
    from { transform: translate3d(100%, 0, 0); visibility: visible }
    to { transform: translate3d(0, 0, 0) }
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight
}

@-webkit-keyframes slideInUp {
    from { transform: translate3d(0, 100%, 0); visibility: visible }
    to { transform: translate3d(0, 0, 0) }
}

@keyframes slideInUp {
    from { transform: translate3d(0, 100%, 0); visibility: visible }
    to { transform: translate3d(0, 0, 0) }
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp
}

@-webkit-keyframes slideOutDown {
    from { transform: translate3d(0, 0, 0) }
    to { visibility: hidden; transform: translate3d(0, 100%, 0) }
}

@keyframes slideOutDown {
    from { transform: translate3d(0, 0, 0) }
    to { visibility: hidden; transform: translate3d(0, 100%, 0) }
}

.slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown
}

@-webkit-keyframes slideOutLeft {
    from { transform: translate3d(0, 0, 0) }
    to { visibility: hidden; transform: translate3d(-100%, 0, 0) }
}

@keyframes slideOutLeft {
    from { transform: translate3d(0, 0, 0) }
    to { visibility: hidden; transform: translate3d(-100%, 0, 0) }
}

.slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft
}

@-webkit-keyframes slideOutRight {
    from { transform: translate3d(0, 0, 0) }
    to { visibility: hidden; transform: translate3d(100%, 0, 0) }
}

@keyframes slideOutRight {
    from { transform: translate3d(0, 0, 0) }
    to { visibility: hidden; transform: translate3d(100%, 0, 0) }
}

.slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight
}

@-webkit-keyframes slideOutUp {
    from { transform: translate3d(0, 0, 0) }
    to { visibility: hidden; transform: translate3d(0, -100%, 0) }
}

@keyframes slideOutUp {
    from { transform: translate3d(0, 0, 0) }
    to { visibility: hidden; transform: translate3d(0, -100%, 0) }
}

.slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp
}

.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.delay-1s {
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.animated.delay-2s {
    -webkit-animation-delay: 2s;
    animation-delay: 2s
}

.animated.delay-3s {
    -webkit-animation-delay: 3s;
    animation-delay: 3s
}

.animated.delay-4s {
    -webkit-animation-delay: 4s;
    animation-delay: 4s
}

.animated.delay-5s {
    -webkit-animation-delay: 5s;
    animation-delay: 5s
}

.animated.fast {
    -webkit-animation-duration: 800ms;
    animation-duration: 800ms
}

.animated.faster {
    -webkit-animation-duration: 500ms;
    animation-duration: 500ms
}

.animated.slow {
    -webkit-animation-duration: 2s;
    animation-duration: 2s
}

.animated.slower {
    -webkit-animation-duration: 3s;
    animation-duration: 3s
}

@media (print),
(prefers-reduced-motion: reduce) {
    .animated {
        -webkit-animation-duration: 1ms !important;
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
        -webkit-animation-iteration-count: 1 !important;
        animation-iteration-count: 1 !important
    }
}


/* Nav Redesing */

.image-top.nav{
    max-height: 55px;
    object-fit: contain;
    }

.image-top{
    width: 130px;
    height: auto;
    object-fit: contain;
    }

nav.navbar {
    margin-bottom: 2%;
    background: #fff;
    border: none;
    font-family: "futura-pt", Helvetica, Arial, sans-serif;
}

.black:hover,
link.dark-gray:hover,
.icon.icon-color:hover,
a.nav-link:hover{
    color: F26924 !important;
}

a:hover {
    color: white;
}

/* Nav */

.nav-link {
    color: #262829;
    padding: 0rem 2rem !important;
}

.dynamic-ct-global-num.nav-link.font-weight-bold.orange {
    color: #F26924;
}


.nav-link:hover,
.dynamic-ct-global-num.nav-link.font-weight-bold.orange:hover {
    color: black !important;
}


/* Font Weight */
.fw400 {
    font-weight: 400;
}


.nav-link {
    font-size: 16px;
}

@media (max-width: 991px) {

    nav.navbar,
    header.top-bar .top-bar-content {
         display: block !important;
        margin: 3% 1%;
    }

    .nav-link {
        display: inline-block;
        padding: 0rem !important;
    }
}

footer div.col-md-3 {
    font-size: 21px;
    color: white;
}

/* Footer Redesing */


.footer {
    padding-top: 1.875rem;
    padding-bottom: 1.875rem;
    background-color: #000
    }
    .footer__title {
    font-size: 26px;
    font-weight: 700;
    line-height: 26px;
    }
    .footer__subtitle {
    font-size: 22px;
    font-weight: 500;
    }

    .footer-inner {
    padding-top: 9.375rem;
    padding-bottom: 9.375rem
    }

    .footer__nav {
    padding: 0px;
    margin-bottom: 0;
    }

    .footer p,
    .footer__nav__item {
    list-style-type: none;
    margin-bottom: 0;
    font-size: 17px;
    font-weight: 400;
    }

    .footer p {
    margin-bottom: 0;
    }

    .footer__nav__link {
    text-decoration: none;
    color: white
    }

    .footer__nav__link:hover {
    color: white
    }

    .footer__logo {
    width: 140px
    }

    .logo{
      width: 220px;
    }

    .footer label {
    margin-bottom: 1.125rem
    }

    .footer .input__group {
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-radius: 3px
    }

    .footer .input__group button {
    color: white
    }

    .footer .input__email {
    background: none;
    border: none;
    height: 50px
    }

    .footer .input__btn {
    position: relative;
    background-color: rgba(255, 255, 255, 0.1);
    margin-top: 6px;
    margin-right: 6px;
    height: 38px;
    font-size: 1.875rem;
    border-radius: 3px;
    border-top-left-radius: 3px !important;
    border-bottom-left-radius: 3px !important;
    z-index: 0
    }

    .footer .input__btn:hover {
    background-color: #fff;
    color: #2d3345
    }

    .footer__address a {
    color: #fff;
    }

    .footer__address a:hover {
    color: #fff;
    }

    .footer .social {
    padding-top: 0px;
    padding-bottom: 0px
    }

    .footer .social__item {
    background-color: transparent;
    align-content: center;
    border-radius: 3px;
    display: inline-flex;
    list-style: none;
    text-align: center;
    text-decoration: none;
    justify-content: center;
    height: 30px;
    width: 30px;
    transition: all 0.25s ease-out;
    margin-right: 15px;
    }

    .footer .social__item.facebook-icon {
    background-image: url(../images/facebook-icon.png);
    }

    .footer .social__item.twitter-icon {
    background-image: url(../images/twitter-icon.png);
    }

    .footer .social__item.instagram-icon {
    background-image: url(../images/instagram-icon.png);
    }

    .footer .social__item.youtube-icon {
    background-image: url(../images/youtube-icon.png);
    }

    .footer .social__item.houzz-icon {
    background-image: url(../images/houzz-icon.png);
    }

    .footer .social__item.pinterest-icon {
    background-image: url(../images/pinterest-icon.png);
    }

    .footer .social__item.google-my-business-icon {
    background-image: url(../images/google-my-business-icon.png);
    }

    .footer .social__item:hover {
    background-color: #F16128;
    text-decoration: none;
    }
    @media (max-width: 767px) {

      .footer {
      text-align: center;
      }

      .footer .store-section,
      .footer .footer_nav {
      border-bottom: 2px solid #2d2d2d;
      padding: 20px;
      }
      .footer .social-section {
      align-items: center;
      padding-top: 20px;
      }}

.btn.disabled, .btn:disabled {
    opacity: .50;
    background: #949292 !important;
    color: black;
    border: 1px solid #949292;
    cursor: not-allowed !important;
}

.btn-primary,.button-primary {
    background: #F36C2D !important;
    color: white !important;
    &:hover {
        background: white !important;
        color: #F36C2D !important;
    }
}

#first_name,
#last_name,
#mobile {
    border: 2px solid black; /* Black border */
    color: black; /* Black text */
}

#first_name::placeholder,
#last_name::placeholder,
#mobile::placeholder {
    color: black; /* Black placeholder */
    opacity: 1; /* Ensure full visibility */
}
