@charset "UTF-8";

/*!
Animate.css - http://daneden.me/animate
Licensed under the MIT license

Copyright (c) 2013 Daniel Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/




   .dropdown-menu>li>a {
            color: white;
        }
        .open .dropdown-menu {
            display: none;
        }
        .container-fluid {
            max-width: 1920px !important;
        }
        .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
            background-color: transparent;
        }


        .ab_img {
            position: relative;
            padding: 1rem;
            width:100%;
            display: inline-block;
        }
        .carousel-inner .item img{
            width: 100%;
        }

        .container-margin img {
            width: 100%;
        }

      
        .nav-info {
            float: right;
        }
        .navbar-default .navbar-nav>li>a {
            /*color: white;*/
            font-size: 1.5rem;
            font-weight: 500;
            padding: 35px 0px;
            text-align: center;
        }
        .navbar-default .navbar-nav>li>a:hover {
            color: rgb(166, 30, 32);
        }
        .navbar-default {
            background: none;
        }
        .swiper-container-product p {
            text-align: center;
            font-size: 16px;
        }
        .m-center {
            text-align: center;
        }
        .w100 {
            width: 100%;
        }
        .m-padding {
            padding: 0;
        }


        .img-text p {
            padding: 0 2rem;
            cursor: pointer;
        }
        .p-jj {
            letter-spacing: 1px;

        }

        .p-jj hr {
            width: 35%;
            border-top: 2px solid white;
        }
        .p-jj .center-font-p {
            font-size: 16px;
            color: black;
            text-align:center;
        }

        .about-us p {
            font-size: 16px;
            margin-bottom: 3rem;
            text-align: left;
        }
        /*.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {*/
            /*background: black;*/
            /*color: white;*/
        /*}*/

        .language-img-a {
            padding-top: 46px;
        }
        .logo-img-a {
            position: relative;
            /*left: 10px;*/
            height: 100%;
            display: inline-block;
            padding: 0px !important;

        }
        .header {
            padding: 0rem 0px;
        }
        .home {
            padding-left: 7rem;
        }
        .navbar-nav {
            /*border-bottom: 0.1rem solid white;*/
            /*margin-bottom: 30px;*/
        }

        .p-jj .col-md-4 {
            padding: 0;
        }
        .search-img {
            padding-top: 35px;
        }
        .panel-heading {
            color: white;
        }
        .panel-body {
            color: white;
        }

        .scroll-bg {
            /*background: rgba(0, 0, 0, 0.6) !important;*/
            /*backdrop-filter: blur(5px);*/
            /*-webkit-backdrop-filter: blur(5px);*/
            box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 51px 1px;
        }
        .nav-tops {
            text-align: center;
            width: 10%;
        }
        .nav-top-img {
            text-align: center;
            width: 20%;
        }
        .solution p {
            text-align: center;
        }
        .swiper-p p {
            text-align: center;
            font-size: 35px;
            color: white;
        }

        .container-product h3 {
            font-size: 30px;
        }
        .container-product h1 {
            font-size: 45px;
            font-weight: 700;
            letter-spacing:2px;
        }
        .container-product p {
            font-size: 18px;
            letter-spacing:1px;
        }

        .product-app p {
            padding-top: 3rem;
            font-size: 18px;
            letter-spacing: 1px;
        }

        .cpu-application h3 {
            font-size: 28px
        }
        .cpu-application p {
            font-size: 16px
        }


        .header-ul {
            padding-right: 50px;
        }
        .phone_banner_img {
            display: none;
        }
        .cate-xs {
            display: none;
        }
        .app-info-web {
            display: none;
        }
        .row_nav_hover_ul li a:hover {
            color: rgb(166, 30, 32);
            /*background-color: #f5f5f5;*/
        }
        .row_nav_hover_ul span {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
            overflow: hidden;
        }
        .fa-angle-down {
            display: none;
        }

        .nb-icon-inner-wrap {
            display: none !important;
        }

        @media (max-width: 1300px) {
            .navbar-default .navbar-nav>li>a {
                padding: 20px 0px;
                font-size: 1.5rem;
            }
            .logo-img-a {
                top: 0rem;
                padding: 0rem 0rem !important;
            }
            .ab_img {
                padding: 0px;
            }
            .nav-top-img {
                width: 16%;
                /*position: relative;*/
                margin-left: 2%;
                margin-right: 2%;
            }
            h1 {
                font-size: 24px;
            }
            h3 {
                font-size: 18px;
            }
            .row-top-padding {
                padding: 0px !important;
            }
            .title-p {
                padding-bottom: 1rem !important;
            }
        }
        @media (max-width: 1180px) {
            /*.navbar-nav>li>a {*/
                /*padding: 3rem 0rem !important;*/
            /*}*/
            .nav-top-img {
                padding-top: 1rem;
            }
            .navbar-default .navbar-nav>li>a {
                font-size: 1.3rem;
            }
            .logo-img-a {
                padding-top: 1rem;
            }
            .swiper-p p {
                font-size: 28px;
            }
            .f-20 {
                font-size: 16px !important;
            }
            .container-product h3 {
                font-size: 25px;
            }
            .container-product h1 {
                font-size: 35px;
            }
            .container-product p {
                font-size: 16px;
            }
            .h1-title {
                margin-top: 6rem;
                margin-bottom: 2rem;
                letter-spacing: 2px;
                font-size: 28px;
            }
            .has-btn-all {
                margin-bottom: 4rem;
            }
            .product-app p {
                font-size: 16px;
            }
            .product-app {
                margin-bottom: 4rem;
            }
            .cpu-application h3 {
                font-size: 20px
            }
            .cpu-application p {
                font-size: 13px
            }
            .about-us p {
                /*padding-right: 10rem;*/
                /*padding-top: 4rem;*/
                font-size: 14px;
                margin-bottom: 2rem;
            }
            .about-us {
                padding-top: 5rem !important;
            }
            .p-one-last {
                margin-bottom: 5rem !important;
            }
        }
        @media (max-width: 955px) {
            .navbar-default .navbar-nav>li>a {
                padding: 20px 0px;
            }
            .language-img-a {
                padding-top: 27px;
            }
            .logo-img-a {
                top: 1rem;
            }
            .header {
                padding: 1em 0px;
            }
            .home {
                padding-left: 4rem;
            }
            .nav-top-img {
                padding: 0px;
            }
            /*.ab_img {*/
                /*width: 50%;*/
            /*}*/
            .navbar-nav {
                /*margin-bottom: 10px;*/
                border-bottom: none;
            }
            .search-img {
                padding-top: 1.5rem;
            }

            /*.img-text {*/
            /*padding: 1rem .5rem 0 .5rem !important;*/
            /*}*/
            /*.img-text h2{*/
            /*font-size: 18px;*/
            /*}*/
            /*.img-text p{*/
            /*font-size: 13px !important;*/
            /*}*/
            /*.p-jj hr {*/
            /*margin-bottom: 10px;*/
            /*margin-top: 10px;*/
            /*}*/
        }
        @media (max-width: 992px) {
            .cate-xs {
                display: block;
            }
            .cate-md {
                display: none;
            }
            .img-text {
                height: auto !important;
            }
            .img-text p {
                padding-bottom: 4rem;
            }
            .about-us {
                padding-left: 5rem;
                text-align: center;
                padding-top: 2rem !important;
                padding-right: 5rem !important;
            }
            .about-us p {
                font-size: 15px;
            }
            .p-one-last {
                margin-bottom: 2rem !important;
            }
            .zx-container .col-md-6 {
                margin-bottom: 3rem !important;
            }
            .cate-img {
                padding-top: 2rem;
            }
            .row-right-top {
                padding-top: 2rem;
            }
            .app-info {
                display: none;
            }
            .app-info-web {
                display: block;
            }
        }
        @media (max-width: 900px) {
            .navbar-default .navbar-nav>li>a {
                padding: 15px 0px;
                /*margin-left: 20px;*/
            }
            .navbar-header {
                width: 20%;
            }
            .language-img-a {
                padding-top: 27px;
            }
            .logo-img-a {
                top: .6rem;
            }
            .header {
                padding: .8em 0px;
            }
            .home {
                padding-left: 4rem;
            }
            /*.ab_img {*/
                /*width: 58%;*/
            /*}*/
            .navbar-nav {
                /*margin-bottom: 10px;*/
            }
            .swiper-button-prev-product {
                margin-top: 66px !important;
            }
            .swiper-button-next-product {
                margin-top: 66px !important;
            }
            .btn-al {
                width: 35% !important;
            }
            .application {

            }
            .search-img {
                padding-top: 1.3rem;
            }
            .header-ul {
                padding-right: 0px;
            }
        }
        @media (max-width: 767px) {
            .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
                color: white;
            }
            .nb-icon-inner-wrap {
                display: block !important;
            }
            .navbar-default .navbar-nav>li>a:hover {
                color: white;
                background: rgb(166, 30, 32);
            }
            .wuyou-waiter {
                display: none;
            }
            .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
                max-height: 767px;
            }
            .navbar-default .navbar-nav>li>a {
                padding-left: 20px;
                padding-right: 20px;
                border-bottom: 1px solid rgb(230,230,230);
                border-top: 1px solid white;
                text-align: left;
            }
            .navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
                background: rgb(166, 30, 32);
                color: white;
            }
            .navbar-nav .dropdown:first-child {
                border-top: 1px solid rgb(230,230,230);
            }
            .nav-top-img {
                display: none !important;
            }
            /*.navbar-default .navbar-nav .open .dropdown-menu>li>a {*/
                /*color: white;*/
            /*}*/
            .search-img {
                display: none !important;
            }
            .language-img {
                display: none !important;
            }
            .nav-info {
                width: 100% !important;
            }
            .language-la {
                display: block !important;
            }
            .cpu-application {
                display: none;
            }
            .phone-application {
                /*padding-top: 3rem;*/
                /*padding-bottom: 3rem;*/
                padding: 3rem 2rem;
                display: block !important;
                text-align: center;
            }
            .product-app {
                margin-bottom: 3rem !important;
            }
           
            .col-xs-right .col-xs-1{
                display: none;
            }
            .col-xs-right .col-xs-10 {
                width: 94% !important;
                padding-left: .8rem !important;
            }

            .navbar-header {
                width: 100%;
            }
            .ab_img {
                left: -5%;
            }
            .logo-img-a {
                top: .7rem;
            }

            .product-info h3 {
                text-align: center;
                font-size: 18px !important;
            }
            .product-info h1 {
                text-align: center;
                font-size: 22px !important;
                font-weight: 600 !important;
            }
            .product-info p {
                text-align: center;
                font-size: 12px !important;
                letter-spacing: 0px !important;
            }
            .h1-title {
                margin-top: 3rem;
                margin-bottom: 1rem;
                font-size: 20px;
            }

            .product-size p {
                font-size: 10px !important;
            }
            .navbar-toggle {
                border: none;
                margin-right: 0px;
                padding-right: 0px;
            }
            .swiper-p p {
                font-size: 18px;
            }
            .f-20 {
                font-size: 14px !important;
            }
            .img-text h2 {
                font-size: 16px;
            }
            .img-text p {
                font-size: 13px !important;
            }
            .product-app p {
                font-size: 14px;
                padding-top: 2rem;
            }
            /*.swiper-product .product-info {*/

            /*}*/
            .about-us p {
                font-size: 13px;
            }
            .search_icon_phone {
                display: block !important;
            }
            .search-img {
                padding-top: 1.4rem;
            }

            .nav li {
                text-align: center;
            }
            .phone_banner_img {
                display: block;
            }
            .pc_banner_img {
                display: none;
            }
            .is_none {
                display: block !important;
            }
            .row-right-top {
                padding-top: 7rem !important;
            }
            .swiper-container-product .swiper-slide {
                padding: 0rem .5rem !important;
            }
            .swiper-button-next, .swiper-container-rtl .swiper-button-prev {
                display: none;
                right: 2.5rem !important;
            }
            .swiper-button-prev, .swiper-container-rtl .swiper-button-next {
                display: none;
                left: 2.5rem !important;
            }
            .cate-des {
                font-size: 12px;
            }

            .container-app {
                margin-top: 5rem !important;
                margin-bottom: 3rem !important;
            }
            .container-app .row {
                margin-bottom: 0px !important;
            }
            .app-adv p {
                margin-bottom: 2rem !important;
            }
            .app-adv img {
                width: 100% !important;
                left: 0 !important;
            }
            .nav_hover_div {
                display: none !important;
            }
            .nav-tops {
                width: 100%;
                text-align: left;
            }
            .br-none {
                display: none;
            }
            .h1-title {
                margin-top: 3rem !important;
            }
            .news-red {
                padding: 0 2rem 2rem 2rem !important;
                top: -2rem !important;
                width: 90%;
                left: 5%;
            }
            .news-red-one {
                position: static;
            }
            .news-more {
                padding-top: 4rem;
            }
     
            .news div {
                padding: 0px !important;
            }

            h4 {
                font-size: 14px;
            }

            .logo-img-a-phone {
                position: relative;
                left: 10px;
                top: 1.5rem;
                height: 100%;
                display: inline-block !important;
                width: 40%;
            }
            .open .dropdown-menu {
                display: block;
            }
            .navbar-nav .open .dropdown-menu {
                background: rgb(238, 208, 211);
                animation: hideIndex 0.5s;
                -moz-animation: hideIndex  0.5s; /* Firefox */
                -webkit-animation: hideIndex  0.5s; /* Safari and Chrome */
                -o-animation: hideIndex  0.5s; /* Opera */

            }
            .navbar-nav .dropdown-menu {
                animation: hideIndex 0.5s;
                -moz-animation: hideIndex  0.5s; /* Firefox */
                -webkit-animation: hideIndex  0.5s; /* Safari and Chrome */
                -o-animation: hideIndex  0.5s; /* Opera */
            }

            .navbar-nav li:not(.open) .dropdown-menu {
                /*display: none;*/
                animation: hidetip 0.5s;
                -moz-animation: hidetip  0.5s; /* Firefox */
                -webkit-animation: hidetip  0.5s; /* Safari and Chrome */
                -o-animation: hidetip  0.5s; /* Opera */
            }

            .navbar-default .navbar-nav .open .dropdown-menu>li>a {
                color: rgb(166, 30, 32);
            }
            .nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
                border-color:rgb(166, 30, 32);
            }
            .navbar-default .navbar-collapse, .navbar-default .navbar-form {
                border-color: white;
            }
            .nav_hover {
                border: 1px solid rgb(166, 30, 32) !important;
            }
            html {
                overflow-x: hidden;
            }
            .nav_hover_hover {
                display: none !important;
            }
            .fa-angle-down {
                display: inline-block;
                float: right;
                margin-right: 1rem;
            }
        }
        @media (max-width: 489px) {
            .row-right-top {
                padding-top: 2rem !important;
                padding-left: 1rem !important;
                padding-right: 1rem !important;
            }
            .nav-info {
                float: left;
            }
        }
        @media (max-width: 480px) {
            .search_icon {
                display: block !important;
            }
        }
        .search-input-text {
            width: 100%;
            height: 38px;
            border: 1px solid #f60;
            padding: 0 .5rem;
            border-radius: 5px;
            font-size: 14px;
            color: #777;
        }
        .nav li {
            text-align: left;
        }
        .is_none {
            display: none;
        }
        .pagination>li>a, .pagination>li>span {
            color: #5a6167;
        }
        .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
            border: rgb(160, 30, 32);
            background-color: rgb(160, 30, 32);
        }
        .cate-a {
            display: inline-block;
            padding-top: 15px !important;
        }
        .cate_hr {
            margin-top: 15px;
            margin-bottom: 10px;
        }
        .ov_none {
            color: rgb(160, 30, 32);
        }
        a:focus{
            text-decoration: none;
            color: rgb(160, 30, 32);
        }
        .solution-herader {
            padding-top: 1.5rem;
        }
        .three-category {
            display: none;
            margin-top: 0px;
            list-style: none;
        }
        .three-category a {
            color: white;
            display: block;
            white-space: nowrap;
            overflow: scroll;
            width: 90%;
        }
        .three-category p {
            color: white;
        }


  .navbar-nav>li>a {
        padding: 3rem 2.5rem;
        color: rgb(93, 93, 93);
        font-size: 18px;
    }
    .nav_hover {
        background-color: white;
    }
    .row_nav_hover_ul li {
        list-style: none;
    }
    .row_nav_hover_ul li a {
        padding: 0 1rem;
        color: #777;
    }
 

    @keyframes hideIndex{
        0%{ opacity: 0; transform: translateY(50px) }
        100%{opacity: 1; transform: translate(0, 0) }
    }

    @keyframes hidetip {
        0%{ opacity: 1; transform: translate(0, 0) }
        100%{opacity: 0; transform: translateY(50px) }
    }


@-webkit-keyframes wobble {
    0% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }

    15% {
        -webkit-transform: translateX(-25%) rotate(-5deg);
        transform: translateX(-25%) rotate(-5deg);
    }

    30% {
        -webkit-transform: translateX(20%) rotate(3deg);
        transform: translateX(20%) rotate(3deg);
    }

    45% {
        -webkit-transform: translateX(-15%) rotate(-3deg);
        transform: translateX(-15%) rotate(-3deg);
    }

    60% {
        -webkit-transform: translateX(10%) rotate(2deg);
        transform: translateX(10%) rotate(2deg);
    }

    75% {
        -webkit-transform: translateX(-5%) rotate(-1deg);
        transform: translateX(-5%) rotate(-1deg);
    }

    100% {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
    }
}

@keyframes wobble {
    0% {
        -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
        transform: translateX(0%);
    }

    15% {
        -webkit-transform: translateX(-25%) rotate(-5deg);
        -ms-transform: translateX(-25%) rotate(-5deg);
        transform: translateX(-25%) rotate(-5deg);
    }

    30% {
        -webkit-transform: translateX(20%) rotate(3deg);
        -ms-transform: translateX(20%) rotate(3deg);
        transform: translateX(20%) rotate(3deg);
    }

    45% {
        -webkit-transform: translateX(-15%) rotate(-3deg);
        -ms-transform: translateX(-15%) rotate(-3deg);
        transform: translateX(-15%) rotate(-3deg);
    }

    60% {
        -webkit-transform: translateX(10%) rotate(2deg);
        -ms-transform: translateX(10%) rotate(2deg);
        transform: translateX(10%) rotate(2deg);
    }

    75% {
        -webkit-transform: translateX(-5%) rotate(-1deg);
        -ms-transform: translateX(-5%) rotate(-1deg);
        transform: translateX(-5%) rotate(-1deg);
    }

    100% {
        -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
        transform: translateX(0%);
    }
}
@-webkit-keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }

    70% {
        -webkit-transform: scale(.9);
        transform: scale(.9);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.3);
        -ms-transform: scale(.3);
        transform: scale(.3);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
        transform: scale(1.05);
    }

    70% {
        -webkit-transform: scale(.9);
        -ms-transform: scale(.9);
        transform: scale(.9);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

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

@-webkit-keyframes bounceInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        transform: translateY(-2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
    }

    80% {
        -webkit-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes bounceInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-2000px);
        -ms-transform: translateY(-2000px);
        transform: translateY(-2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateY(30px);
        -ms-transform: translateY(30px);
        transform: translateY(30px);
    }

    80% {
        -webkit-transform: translateY(-10px);
        -ms-transform: translateY(-10px);
        transform: translateY(-10px);
    }

    100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

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

@-webkit-keyframes bounceInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
        transform: translateX(-2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(30px);
        transform: translateX(30px);
    }

    80% {
        -webkit-transform: translateX(-10px);
        transform: translateX(-10px);
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes bounceInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
        -ms-transform: translateX(-2000px);
        transform: translateX(-2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(30px);
        -ms-transform: translateX(30px);
        transform: translateX(30px);
    }

    80% {
        -webkit-transform: translateX(-10px);
        -ms-transform: translateX(-10px);
        transform: translateX(-10px);
    }

    100% {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

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

@-webkit-keyframes bounceInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(-30px);
        transform: translateX(-30px);
    }

    80% {
        -webkit-transform: translateX(10px);
        transform: translateX(10px);
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes bounceInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
        -ms-transform: translateX(2000px);
        transform: translateX(2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(-30px);
        -ms-transform: translateX(-30px);
        transform: translateX(-30px);
    }

    80% {
        -webkit-transform: translateX(10px);
        -ms-transform: translateX(10px);
        transform: translateX(10px);
    }

    100% {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

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

@-webkit-keyframes bounceInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(2000px);
        transform: translateY(2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
    }

    80% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes bounceInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(2000px);
        -ms-transform: translateY(2000px);
        transform: translateY(2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        transform: translateY(-30px);
    }

    80% {
        -webkit-transform: translateY(10px);
        -ms-transform: translateY(10px);
        transform: translateY(10px);
    }

    100% {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

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

@-webkit-keyframes bounceOut {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    25% {
        -webkit-transform: scale(.95);
        transform: scale(.95);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3);
    }
}

@keyframes bounceOut {
    0% {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }

    25% {
        -webkit-transform: scale(.95);
        -ms-transform: scale(.95);
        transform: scale(.95);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(.3);
        -ms-transform: scale(.3);
        transform: scale(.3);
    }
}

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