*, *:after, *:before {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    outline: 0;
    text-decoration: none;
    font-family: "Montserrat", sans-serif;
    text-rendering: optimizeLegibility;
    font-size: auto;
    font-weight: 400;
    outline: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

ul, ol {
    list-style: none;
}

article, aside, details, figcaption, figure, footer, header, menu, nav, section {
    display: block;
    outline: none;
}

body {
    background: #dfdfdf;
    color: #fff;
    outline: none;
    overflow-y: auto;
    overflow-x: hidden !important;
}

.flex--font--1 {
    font-family: 'Righteous', cursive;
}

.flex--font--2 {
    font-family: 'Poiret One', cursive;
}

.flex--container {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

.flex--content {
    width: 90%;
    max-width: 1140px;
    margin: 0 auto;
}

.flex--content--max {
    width: 100%;
    max-width: 1370px;
    margin: 0 auto;
}

.flex--relative {
    position: relative;
}

.flex--tolltip {
    display: none;
    position: absolute;
    width: auto;
    left: -10px;
    top: -60px;
    border-radius: 4px;
    background: #bd4a4a;
    color: #fff;
    padding: 10px 15px;
}

.flex--tolltip i {
    color: #fff;
    font-size: 16px;
}

.flex--tolltip span {
    width: 14px;
    height: 14px;
    position: absolute;
    background: #bd4a4a;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    left: 20px;
    bottom: -4px;
}

.content.min {
    width: 90%;
    max-width: 1100px;
    margin: 0 auto;
}

.content-max {
    width: 90%;
    margin: 0 5%;
}

.box {
    width: auto;
    float: left;
}

.box-line {
    float: left;
    width: 100%;
}

.box-small {
    width: 22.75%;
    margin-right: 3%;
}

.box-medium {
    width: 30%;
    margin-right: 5%;
}

.box-large {
    width: 46.5%;
    margin-right: 7%;
}

.box-full {
    width: 100%;
    margin: 0;
}

.box-1152 {
    width: 75%;
}

.box-forthree {
    width: 66%;
}

.box-forthreesmall {
    width: 30%;
}

.last {
    margin-right: 0;
}

.clear {
    clear: both;
}

.ds-none {
    display: none;
}

.flex--darker {
    background: #000;
}

.flex--middle {
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.flex-fixed {
    position: relative;
}

.flex--grad--1 {
    background: linear-gradient(45deg, rgba(105,89,175,1) 0%,rgba(159,89,199,1) 100%);
}

.flex--transition {
    transition: 0.7s;
    -moz-transition: 0.7s;
    -webkit-transition: 0.7s;
}

.flex--transition {
    transition: 0.3s;
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
}

.flex--hover--1 {
    position: relative;
    color: #237546;
    font-weight: 700;
    text-shadow: none;
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}

.flex--hover--1::before, .flex--hover--1::after {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: #0052ce;
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    -moz-transition: opacity 0.3s, -moz-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    transform: translateY(-10px);
}

.flex--hover--1::before {
    top: 0;
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    transform: translateY(-10px);
}

.flex--hover--1::after {
    bottom: 2px;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    transform: translateY(10px);
}

.flex--hover--1:hover {
    color: #0052ce !important;
}

.flex--menu--hover a:hover::before, .flex--hover--1:hover::after {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    transform: translateY(0px);
}

.flex--confirm {
    width: 100%;
    height: 100%;
    position: fixed;
    display: none;
    z-index: 100000;
    background: rgba(0,0,0,0.5);
    display: none;
}

.flex--cls {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 100001;
    display: block;
}

.box--confirm {
    transform: translateX(-50%) translateY(-50%);
    width: 50%;
    max-width: 560px;
    min-width: 310px;
    height: auto;
    padding: 4em;
    transition: 0.2s;
    z-index: 100002;
    background: #fff;
    text-align: center;
    position: relative;
    position: fixed;
    top: 50%;
    left: 50%;
    overflow: hidden;
    opacity: 1;
    transform: translate3d(-400px, -125px, 0) scale3d(1.4, 0, 1) translateX(-50%) translateY(-50%);
}

.flex--top {
    color: #c94e50;
    font-weight: bold;
    font-size: 1.4em;
}

.flex--desc {
    padding-top: 0.1em;
    font-weight: 400;
    font-size: 1.3em;
    margin: 0;
    color: #c94e50;
}

.flex--buttons {
    padding-top: 0.8em;
}

.flex--ok {
    display: inline-block;
    margin-right: 5px;
    font-size: 15px;
    padding: 1em 2em;
    outline: none;
    font-weight: 600;
    border: none;
    color: #fff;
    background: #c94e50;
    display: inline-block;
    border: 1px solid #c94e50;
}

.flex--fechar {
    display: inline-block;
    margin-right: 5px;
    font-size: 15px;
    padding: 1em 2em;
    outline: none;
    font-weight: 600;
    border: none;
    color: #fff;
    background: #c94e50;
    display: inline-block;
    border: 1px solid #c94e50;
}

.box--confirm.anim {
    transition: 0.2s;
    transform: translate3d(0, 0, 0) scale3d(1, 1, 1) translateX(-50%) translateY(-50%);
    opacity: 1;
}

@media only screen and (max-width : 770px) {
    .box--confirm {
        padding: 3em 2.5em;
    }

    .flex--top {
        font-size: 1em;
    }

    .flex--desc {
        font-size: 0.9em;
    }

    .flex--ok, .flex--fechar {
        font-size: 12px;
        padding: 0.7em 1.5em;
    }
}

/*TOPO MENU*/
.flex--menu {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;
    padding-bottom: 40px;
    background: linear-gradient(to bottom, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.8) 15%,rgba(0,0,0,0) 100%);
}

.flex--menu .flex--content {
    padding: 30px 0;
}

.flex--menu .flex--logo {
    background-image: url(../img/logo.png);
    height: 50px;
    width: 144px;
    background-size: auto 100%;
    background-position: left center;
    float: left;
}

.flex--menu .flex--rigth {
    float: right;
}

.flex--menu .flex--rigth a {
    float: left;
    padding: 14px 15px;
    color: #fff;
    font-size: 17px;
}

.flex--menu .flex--rigth .flex--btn--1 {
    margin-left: 15px;
}

.flex--menu.flex--fixed {
    position: fixed;
    background: rgba(0,0,0,0.9);
    padding-bottom: 0;
    border-bottom: 3px solid #0052ce ;
}

.flex--menu.flex--fixed .flex--content {
    padding: 15px 0;
}

.flex--menu.flex--fixed .flex--logo {
    height: 40px;
    width: 115px;
}

.flex--menu.flex--fixed .flex--hover--1::before, .flex--menu.flex--fixed .flex--hover--1::after {
    background: #0052ce;
}

.flex--menu.flex--fixed .flex--hover--1:hover {
    color: #0052ce !important;
}

.flex--idioma {
    float: right;
    padding-top: 20px;
    padding-left: 25px;
    position: relative;
    cursor: pointer;
}

.flex--idioma .flex--current {
    position: relative;
}

.flex--idioma .flex--current svg {
    width: 50px;
    height: 25px;
    display: block;
    margin-left: 5px;
    margin-top: -5px;
    float: left;
}

.flex--idioma i {
    float: left;
    color: #ccc;
    font-size: 12px;
}

.flex--languages {
    display: none;
    position: absolute;
    top: 70px;
    background: #000;
    right: 0;
    padding: 15px;
    width: 260px;
}

.flex--languages .aste {
    border-left: 3px solid #000;
    width: 17px;
    height: 17px;
    background: #000;
    position: absolute;
    top: -10px;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    right: 15px;
}

.flex--languages a {
    display: block;
    position: relative;
    z-index: 2;
    height: 45px;
    margin-bottom: 0px;
    padding: 5px 10px;
    font-size: 17px;
    padding-top: 13px;
    color: #d1d1d1;
    font-weight: 700;
}

.flex--languages a:last-child {
    margin-bottom: 0;
}

.flex--languages a i {
    float: left;
    width: 37.5px;
    height: 25px;
    margin-right: 10px;
    margin-top: -3px;
}

.flex--languages a i svg {
    width: 37.5px;
    height: 25px;
}

.flex--languages a:hover {
    color: #fff;
    background: #0052ce ;
}

.flex--menu.flex--fixed .flex--languages .aste {
    border-left: 3px solid #0052ce ;
    border-top: 3px solid #0052ce ;
}

/*header*/
.flex--topo {
    position: relative;
    z-index: 1;
}

.flex--content-height {
    position: relative;
    overflow: hidden;
    height: 700px;
    background: #000;
}

.flex--content-height video {
    z-index: 1;
    position: relative;
    height: 140%;
    width: 140%;
    margin-left: -20%;
    margin-top: -10%;
}

.flex--content-height .imager {
    background-image: url(../img/header-min.jpg);
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    opacity: 0.92;
}

.flex--header-title {
    position: absolute;
    z-index: 3;
    top: 0;
    width: 100%;
    font-weight: 800;
    padding-top: 250px;
}

.flex--header-title .top1 {
    text-align: center;
    font-size: 71px;
    line-height: 82px;
    height: 84px;
    padding-bottom: 12px;
    color: #fff;
    display: block;
    letter-spacing: 5px;
    text-shadow: 5px 5px 10px #323232;
}

.flex--header-title .top1 b {
    color: #b757e6;
}

.flex--header-title .top2 {
    text-align: center;
    height: 60px;
    font-size: 49px;
    line-height: 61px;
    color: #fff;
    display: block;
    margin-bottom: 40px;
    text-shadow: 3px 3px 5px #202020;
    text-transform: uppercase;
}

.flex--btn--1 {
    display: block;
    text-align: center;
    padding: 12px 30px !important;
    font-weight: 700;
    border-radius: 30px;
    border: 3px solid #0052ce !important;
    margin-top: -3px;
}

.flex--btn--1:hover {
    background: #0052ce ;
    border-color: #0052ce !important;
}

.flex--inpage {
    position: relative;
    z-index: 2;
}

.flex--box--large {
    float: left;
    width: 50%;
}

.flex--h1 {
    position: relative;
    padding-bottom: 30px;
    font-size: 60px;
    font-weight: 700;
    text-align: center;
    color: #fff;
}

.flex--h1 i {
    font-size: 50px;
    font-weight: 700;
}

.flex--h1 span {
    position: absolute;
    height: 5px;
    width: 120px;
    background: #0052ce;
    left: 50%;
    margin-left: -60px;
    bottom: 20px;
}

.flex--h1--2 {
    font-size: 25px;
    text-align: center;
    color: #fff;
    width: 90%;
    max-width: 850px;
    margin-left: auto;
    margin-right: auto;
}

.flex--color--dark {
    color: #1a1a1a;
}

.flex--h2 {
    font-size: 22px;
    text-align: center;
    color: #fff;
}

.flex--info--login {
    background: #0052ce;
    height: 580px;
    padding: 80px 60px;
}

.flex--info--login p {
    font-size: 22px;
    color: #FFFFFF;
    line-height: 27px;
    text-align: justify;
    margin-top: 30px;
}

.flex--form--login {
    background: #fff;
    height: 660px;
    padding: 80px 60px;
}

.flex--form--login form {
    padding: 40px 0px;
}

.flex--form--login form input, .flex--form--login form select {
    display: block;
    width: 100%;
    border-bottom: 2px solid #ccc;
    margin-bottom: 25px;
    font-size: 24px;
    color: #000;
    height: 50px;
    text-align: left;
    line-height: 50px;
    background: none;
}

.flex--form--login form input[type="password"] {
    margin-bottom: 40px;
}

.flex--form--login.flex--2 {
    height: 980px;
}

.flex--info--login.flex--2 {
    height: 900px;
}

.flex--login--title {
    font-weight: 700;
    font-size: 55px;
    color: #FFFFFF;
    line-height: 55px;
}

.flex--form--title {
    font-weight: 700;
    font-size: 4;
    color: #000;
    line-height: 55px;
}

.flex--links {
    padding-top: 20px;
}

.flex--links p {
    padding-top: 15px;
    color: #1a1a1a;
    font-size: 20px;
}

.flex--links p a {
    font-size: 20px;
    font-weight: 700;
    color: #666666;
}

.flex--links p a:hover {
    color: #0052ce;
    text-decoration: underline;
}

.margin--1 {
    margin-top: -100px;
    background: #fff;
}

.margin--2 {
    margin-top: -50px;
}

.margin--4 {
    margin-top: -130px;
    background: #fff;
}

.margin--3 {
    margin-top: -50px;
}

.margin--4 .flex--form--title {
    max-width: 450px;
    width: 100%;
}

.flex--terms {
    position: relative;
    z-index: 2;
}

.flex--terms .flex--h1--2 {
    margin-bottom: 60px;
}

.flex--terms .flex--page--text {
    background: #fff;
    margin-top: -150px;
    padding: 60px 80px;
}

.flex--terms .flex--page--text p {
    text-align: left;
    color: #535353;
    margin-top: 18px;
    font-size: 20px;
    line-height: 25px;
}

.flex--terms .flex--page--text b {
    font-weight: 700;
    display: block;
    color: #535353;
    margin-top: 18px;
    font-size: 20px;
    line-height: 25px;
}

.flex--grad--hover {
    display: block;
    position: relative;
    width: 100%;
}

.flex--grad--hover img {
    display: block;
    width: 100%;
}

.flex--grad--hover .gradd {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, rgba(0,82,206,0) 0%,rgba(0,82,206,0) 62%,rgba(0,82,206,0) 100%);
}

.flex--min {
    font-size: 16px;
    margin-bottom: 10px;
}

.flex--about, .flex--about--2 {
    padding: 40px;
}

.flex--white {
    background: #fff;
}

.flex--about h2, .flex--about--2 h2 {
    font-size: 42px;
    line-height: 45px;
    color: #666666;
    font-weight: 700;
}

.flex--about p, .flex--about--2 p {
    color: #666666;
    font-size: 17px;
    padding: 15px 0;
    color: #666666;
    font-weight: 700;
}

.white {
    color: #fff !important;
    font-weight: 700;
}

.margin--2 .flex--about {
    background: #000;
}

.margin--2 .flex--about--2 {
    background: #808080;
}

.flex--what {
    padding-top: 5px;
    width: 100%;
    max-width: 1150px;
    margin: 0 auto;
}

.flex--what .flex--boxed {
    width: 33.33%;
    float: left;
    padding: 20px;
}

.flex--what .flex--boxed * {
    transition: 0.3s;
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
}

.flex--what .flex--boxed div {
    margin: 0 auto;
    max-width: 320px;
    width: 100%;
    padding: 70px 20px;
}

.flex--what .flex--boxed div i {
    display: block;
    width: 70px;
    height: 70px;
    margin: 0 auto;
}

.flex--what .flex--boxed div svg {
    display: block;
    width: 70px;
    height: 70px;
}

.flex--what .flex--boxed div svg path {
    fill: #0052ce;
}

.flex--what .flex--boxed div h1 {
    text-transform: uppercase;
    text-align: center;
    padding: 15px 0;
    font-size: 24px;
    color: #0052ce;
    font-weight: 700;
}

.flex--what .flex--boxed div h2 {
    text-align: center;
    font-size: 18px;
    color: #666666;
}

.flex--what .flex--boxed div:hover {
    background: #0052ce;
}

.flex--what .flex--boxed div:hover path {
    fill: #fff;
}

.flex--what .flex--boxed div:hover h1 {
    color: #fff;
}

.flex--what .flex--boxed div:hover h2 {
    color: #fff;
}

.flex--about-page {
    padding: 88px 0 75px 0;
    padding-top: 130px;
    margin-top: -60px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    background-image: url(../img/header-about.jpg);
    height: 600px;
}

.flex--about-left {
    position: relative;
    padding-right: 50%;
}

.flex--minner {
    text-align: left;
    color: #fff;
    font-weight: 700;
    font-size: 35px;
    padding-bottom: 20px;
}

.flex--sobre {
    padding-top: 15px;
    font-size: 18px;
}

.flex--box--clean {
    background: #fff;
    width: 100%;
    padding: 60px 0;
    min-height: 600px;
}

.flex--platform {
    min-height: 800px;
    padding-top: 200px;
    background-image: url(../img/header-plat.jpg);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 120% auto;
    background-repeat: no-repeat;
}

.flex--platform--h1 {
    color: #fff;
}

.flex--platform--icons {
    padding-top: 180px;
}

.flex--platform--icons aside {
    box-shadow: inset 0px 0px 24px 0px rgba(0,0,0,0.46);
    -moz-box-shadow: inset 0px 0px 24px 0px rgba(0,0,0,0.46);
    float: left;
    width: 33.33%;
    position: relative;
}

.flex--platform--icons aside .shad {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.flex--platform--icons aside.one .shad {
    background: rgba(0,82,206,0.15);
}

.flex--platform--icons aside.tre .shad {
    box-shadow: inset 0px 0px 24px 0px rgba(0,0,0,0.46);
    -moz-box-shadow: inset 0px 0px 24px 0px rgba(0,0,0,0.46);
    background: rgba(0,0,0,0.7);
}

.flex--platform--icons aside.for .shad {
    box-shadow: inset 0px 0px 24px 0px rgba(0,0,0,0.46);
    -moz-box-shadow: inset 0px 0px 24px 0px rgba(0,0,0,0.46);
    background: rgba(0,82,206,0.2);
}

.flex--platform--icons aside.tre:hover .shad {
    background: rgba(0,82,206,0.5);
}

.flex--platform--icons aside.one:hover .shad {
    background: rgba(0,82,206,0.5);
}

.flex--platform--icons aside.two .shad {
    background: rgba(0,0,0,0.1);
}

.flex--platform--icons aside.two:hover .shad {
    background: rgba(0,82,206,0.5);
}

.flex--platform--icons aside.for:hover .shad {
    background: rgba(0,82,206,0.7);
}

.flex--platform--icons aside img {
    display: block;
    width: 100%;
}

.flex--platform--icons aside div {
    float: left;
    padding: 0 50px 0 68px;
    z-index: 1;
    position: absolute;
    z-index: 5;
    left: 0;
    bottom: 93px;
    width: 100%;
    height: auto;
}

.flex--platform--icons aside div h1 {
    font-weight: 700;
    font-size: 41px;
    color: #FFFFFF;
    line-height: 45px;
    text-align: left;
    text-transform: uppercase;
}

.flex--platform--icons aside div h2 {
    margin: 5px 0 0 0;
    padding: 0;
    font-size: 17px;
    color: #FFFFFF;
    line-height: 22px;
    text-align: left;
}

.flex--enter {
    background-image: url(../img/bg_box_cad.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    padding: 150px 0 180px 0;
    z-index: 0;
}

.flex--enter h1 {
    width: 360px;
    padding: 0;
    font-weight: 700;
    font-size: 67px;
    color: #FFFFFF;
    line-height: 57px;
    margin-bottom: 30px;
}

.flex--enter h2 {
    padding: 0 0 0 5px;
    font-size: 26px;
    color: #FFFFFF;
    line-height: 29px;
    margin-bottom: 30px;
    line-height: 34px;
}

.flex--enter .flex--button {
    width: 250px;
}

.flex--button:disabled, .flex--button:disabled:hover {
    background: #adadad;
    color: #878787;
    cursor: none;
}

.flex--button:disabled::before {
    display: none;
}

.flex--contatc {
    padding-top: 0;
}

.flex--aa {
    float: left;
    position: relative;
    width: 50%;
    background-image: url(../img/bg_box_contact.jpg);
    height: 1000px;
    margin-top: -60px;
    background-repeat: no-repeat;
    background-size: auto 100%;
}

.flex--aa div {
    padding-left: 10%;
    position: absolute;
    color: #fff;
    z-index: 2;
}

.flex--aa div h1 {
    width: 130px;
    text-shadow: 5px 5px 10px #323232;
    font-size: 55px;
    line-height: 58px;
    padding-bottom: 20px;
    color: #fff;
    font-weight: 700;
}

.flex--aa div p {
    text-shadow: 5px 5px 10px #323232;
    font-size: 30px;
    color: #FFFFFF;
    line-height: 33px;
    max-width: 630px;
    width: 90%;
}

.llii {
    float: left;
    width: 50%;
}

.llii.first {
    padding-right: 10px;
}

.llii.last {
    padding-left: 10px;
}

@media only screen and (max-width: 910px) {
    .llii {
        width: 100%;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

.flex--listers {
    margin: 30px auto;
    width: 100%;
    max-width: 1150px;
}

.liner {
    padding: 10px;
    float: left;
    width: 50%;
}

.flex--listers li {
    display: block;
    margin-top: 20px;
}

.flex--listers li:first-child {
    border-top: none;
}

.flex--listers a {
    background: #fff;
    display: block;
    transition: 0.3s;
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
}

.flex--listers a .top {
    padding: 15px 20px;
    font-size: 25px;
    color: #333;
    transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
}

.flex--listers a .top i {
    float: left;
    width: 11px;
    height: 11px;
    position: relative;
    transform: rotate(135deg);
    margin-top: 9px;
    margin-right: 10px;
    transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
}

.flex--listers a .top i span {
    position: absolute;
    width: 100%;
    height: 100%;
    border-left: 4px solid #0052ce;
    border-top: 4px solid #0052ce;
}

.flex--listers a .top2 {
    display: none;
    padding: 20px;
    padding-top: 10px;
    color: #fff;
    font-size: 18px;
    line-height: 25px;
}

.flex--listers a.active {
    background: #0052ce;
    color: #fff;
}

.flex--listers a.active .top {
    color: #fff;
}

.flex--listers a.active .top i {
    transform: rotate(-45deg);
}

.flex--listers a.active .top i span {
    border-color: #fff;
}

.flex--ab {
    float: left;
    width: 50%;
    position: relative;
    height: 940px;
}

.flex--ab form {
    background: #fff;
    padding: 60px 50px;
    width: 90%;
    max-width: 630px;
    position: absolute;
    top: 50%;
}

.flex--ab form input, .flex--ab form textarea {
    display: block;
    width: 100%;
    border-bottom: 2px solid #ccc;
    margin-bottom: 15px;
    font-size: 24px;
    color: #000;
    height: 50px;
    text-align: left;
    line-height: 50px;
    background: none;
}

.flex--ab form textarea {
    resize: none;
    height: auto;
    line-height: 33px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    margin-top: 5px;
    padding-top: 7px;
}

.flex--ab form input:focus, .flex--ab form textarea:focus {
    border-color: #0052ce;
    color: #0052ce;
}

.flex--form--login form input:focus, .flex--form--login form select:focus {
    border-color: #0052ce;
    color: #0052ce;
}

.flex--button {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    padding: 0 20px;
    margin: 0;
    width: 205px;
    max-width: 90%;
    height: 53px;
    background-color: #000000;
    border-radius: 4px;
    font-weight: 500;
    font-size: 26px;
    text-align: left;
    color: #FFFFFF;
    line-height: 50px;
    text-decoration: none;
    position: relative;
    border: none;
}

.flex--button:before {
    content: "";
    position: absolute;
    top: 12px;
    right: 15px;
    width: 7px;
    height: 25px;
    background-color: #0052ce;
    border-radius: 0 0 5px 5px;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.flex--button:hover {
    cursor: pointer;
    background: #0052ce;
    color: #fff;
}

.flex--button:hover:before {
    background: #fff;
}

.flex--footer {
    background: #000;
    padding-top: 80px;
    position: relative;
}

.flex--fotter-base {
    margin: 0 -50px;
    padding-bottom: 60px;
    display: block;
    position: relative;
}

.flex--box--middle {
    overflow: hidden;
    float: left;
    width: 33.33%;
    padding: 0 40px;
}

.flex--box--middle.center {
    width: 28%;
}

.flex--box--middle.last {
    width: 37.5%;
}

.flex--box--middle p {
    padding-bottom: 10px;
    color: #c4c4c4;
}

.flex--box--middle p a {
    display: inline-block;
    font-size: 17px;
    font-weight: 700;
    white-space: nowrap;
    padding-bottom: 4px;
    color: #c4c4c4;
}

.flex--box--middle p a:hover {
    color: #0052ce;
    text-decoration: underline;
}

.flex--box--middle p .bot {
    display: inline-block;
    font-size: 11px;
    border-radius: 30px;
    padding: 12px 30px;
    background: #333;
    border: #575757 2px solid;
    color: #fff;
}

.flex--box--middle p .bot:hover {
    text-decoration: none;
    background: #0052ce;
    border-color: #0052ce;
    color: #fff;
}

.flex--box--logo {
    width: 100%;
    display: block;
    height: 40px;
    background-image: url(../img/logo.png);
    background-position: left center;
    background-repeat: no-repeat;
    font-size: 0em;
    background-size: auto 100%;
}

.flex--box--padding {
    padding-top: 25px;
}

.flex--box--mail {
    padding-bottom: 10px;
}

.flex--box--mail form {
    padding: 20px 0;
    position: relative;
    padding-right: 100px;
}

.flex--box--mail form input[type="email"] {
    padding: 12px 20px;
    padding-left: 49px;
    width: 100%;
    background-color: #333;
    color: #ccc;
    display: block;
    height: 43px;
    background-image: url(../img/icon-mail.png);
    font-size: 15px;
    padding-top: 14px;
    background-position: left center;
    background-repeat: no-repeat;
    background-size: auto 27px;
}

.flex--box--mail form input[type="email"]::placeholder {
    color: #757575;
}

.flex--box--mail form button {
    position: absolute;
    top: 20px;
    right: 0;
    height: 43px;
    width: auto;
    text-align: center;
    background: #0052ce;
    color: #fff;
    font-weight: 700;
    padding-left: 20px;
    padding-right: 20px;
}

.flex--network {
    padding-top: 10px;
}

.flex--network a {
    border: #575757 2px solid;
    display: inline-block;
    width: 54px;
    height: 54px;
    background: #333;
    padding: 10px;
    margin-right: 10px;
    border-radius: 50%;
}

.flex--network a:hover {
    background: #0052ce;
    border-color: #0052ce;
}

.flex--network a svg {
    width: 30px;
    height: 30px;
}

.flex--network a.ig svg {
    transform: scale(0.8);
}

.flex--network a.fb svg {
    transform: scale(0.8);
}

.flex--network a svg path {
    fill: #fff;
}

.flex--fotter--title {
    font-size: 22px;
    color: #0052ce;
    font-weight: 700;
    padding-bottom: 20px;
    padding-top: 25px;
}

.flex--fotter--title2 {
    font-size: 22px;
    color: #0052ce;
    font-weight: 700;
    padding-bottom: 20px;
    padding-top: 10px;
}

.flex--copyrigth {
    color: #777;
    background: #0e0e0e;
    font-size: 14px;
    text-align: center;
    padding: 20px 0;
}

.flex--login--left {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 50%;
    z-index: 1150;
    background: #FFF;
}

.flex--login--right {
    position: fixed;
    top: 0;
    right: 0;
    height: 100%;
    width: 50%;
    z-index: 1150;
    background: linear-gradient(45deg, rgba(0,82,206,1) 0%,rgba(166,89,203,1) 100%);
}

.flex--preloader {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 1150;
    background: linear-gradient(45deg, #0052ce 0%,#002b6b 100%);
}

.flex--preloader .rel {
    position: fixed;
    top: 50%;
    width: 100%;
    left: 0%;
}

.flex--preloader .div {
    width: 95%;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    background: #002c6e;
    height: 3px;
    overflow: hidden;
}

.flex--preloader .log {
    display: block;
    background-image: url(../img/logo.png);
    margin: 0 auto;
    width: 43px;
    height: 50px;
    margin-bottom: 17px;
    background-size: auto 100%;
}

.flex--preloader .div rect {
    height: 1px;
    fill: #fff;
}

input.tada {
    background: #fff0f0 !important;
    color: #FF0004 !important;
    border-color: #FF0004 !important;
}

.termos {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
    padding: 40px 30px;
    border: 1px solid #ccc;
    border-radius: 15px;
    padding-right: 280px;
    background-image: url(../img/privacy.svg);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 260px auto;
}

.termos h1 {
    font-size: 25px;
    padding-bottom: 25px;
}

.termos .tPg {
    width: 100%;
    height: 420px;
    overflow-y: auto;
    padding-right: 20px;
}

.termos h1 {
    color: #666666;
}

.termos b {
    font-weight: bold;
    font-size: 18px;
    display: block;
}

.termos p {
    margin-bottom: 5px;
    font-size: 15px;
}

.termos .webzen-logo {
    background-image: url(../img/logo2.png);
    background-repeat: no-repeat;
    height: 32px;
    margin-bottom: 20px;
    background-size: auto 100%;
}

.termos .btns {
    padding-top: 25px;
    width: 100%;
}

.termos .btns .btn {
    float: right;
    font-size: 16px;
    cursor: pointer;
}

.termos .btns .cnc {
    text-decoration: underline;
    background: none;
    padding: 16px 20px !important;
    color: #820B0D;
    border-radius: 35px;
    border: 3px solid transparent;
    float: left;
    font-size: 16px;
}

.termos .btns .cnc:hover {
    border-color: #820B0D;
    text-decoration: none;
}

.validate-email {
    padding-top: 20px;
}

.validate-email .img {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    display: block;
}

.validate-email h1 {
    padding-top: 30px;
    font-size: 35px;
    padding-top: 40px;
    font-weight: 700;
    text-align: center;
    color: #0052ce;
}

.validate-email p {
    text-align: center !important;
}

.validate-email .h2 {
    text-align: center !important;
    font-size: 20px;
    color: #666666;
}

.validate-email .h3 {
    text-align: center !important;
    font-size: 31px;
    padding: 20px 0;
    font-weight: 700;
    color: #666;
}

.validate-email .h4 {
    text-align: center !important;
}

.moderate {
    padding-top: 20px;
}

.moderate .img {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    display: block;
}

.moderate .h2 {
    padding-top: 30px;
    font-size: 25px;
    padding-top: 40px;
    font-weight: 700;
    text-align: center;
    color: #0052ce;
}

.moderate .h2 b {
    display: block;
    text-align: center;
    font-weight: 700;
    padding-top: 40px;
    padding-bottom: 20px;
    font-size: 35px;
    color: #666666;
}

.flex--trigger {
    transform: scale(1.2);
    cursor: pointer;
    position: relative;
    display: none;
    margin: 0 auto;
    cursor: pointer;
    width: 25px;
    height: 20px;
    float: left;
    margin-top: 8px;
    margin-right: 20px;
}

.flex--trigger .item {
    position: absolute;
    right: 0;
    left: 0;
    height: 4px;
    background: #fff;
    border-radius: 2px;
    -webkit-transition: -webkit-transform .25s cubic-bezier(.86, 0, .07, 1);
    transition: transform .25s cubic-bezier(.86, 0, .07, 1);
}

.flex--trigger .item-1 {
    top: 0;
}

.flex--trigger .item-2 {
    opacity: 1;
    top: 50%;
    margin-top: -2px;
    transition: opacity .25s cubic-bezier(.86, 0, .07, 1);
}

.flex--trigger .item-3 {
    bottom: 0;
}

.flex--trigger.active>.item-1 {
    -webkit-transform: translate3d(0, 8px, 0) rotate3d(0, 0, 1, 45deg);
    -ms-transform: translate(0, 8px) rotate(45deg);
    transform: translate3d(0, 8px, 0) rotate3d(0, 0, 1, 45deg);
}

.flex--trigger.active>.item-2 {
    opacity: 0;
}

.flex--trigger.active>.item-3 {
    -webkit-transform: translate3d(0, -8px, 0) rotate3d(0, 0, 1, -45deg);
    -ms-transform: translate(0, -8px) rotate(-45deg);
    transform: translate3d(0, -8px, 0) rotate3d(0, 0, 1, -45deg);
}

.out-menu {
    position: absolute;
    z-index: 10;
    width: 24px;
    height: 24px;
    right: 25px;
    top: 25px;
    height: 25px;
    display: none;
}

.out-menu path {
    path: #fff;
}

@media only screen and (max-width : 1460px) {
    .flex--platform {
        background-size: 155% auto;
    }
}

@media only screen and (max-width : 1430px) {
    .flex--fotter-base {
        margin-left: 0;
        margin-right: 0;
    }

    .flex--content {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media only screen and (max-width : 1360px) {
    .flex--menu .flex--content {
        padding-left: 20px;
        padding-right: 20px;
    }

    .flex--enter .flex--content {
        padding-left: 70px;
        padding-right: 70px;
    }

    .flex--about-page .flex--content {
        padding-left: 40px;
    }
}

@media only screen and (max-width : 1264px) {
    .flex--box--middle {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media only screen and (max-width : 1203px) {
    .flex--about h2, .flex--about--2 h2 {
        font-size: 40px;
        line-height: 40px;
    }
}

@media only screen and (max-width : 1290px) {
    .flex--platform--icons aside div {
        padding: 0 30px 0 30px;
        bottom: 50px;
    }

    .flex--platform--icons aside div h1 {
        font-size: 38px;
    }
}

@media only screen and (max-width : 1215px) {
    .flex--listers {
        max-width: 1000px;
        width: 100%;
    }
}

@media only screen and (max-width : 1165px) {
    .flex--what .flex--boxed div {
        padding-left: 0;
        padding-right: 0;
    }

    .flex--menu .flex--rigth a {
        font-size: 17px;
    }

    .flex--what .flex--boxed div h1 {
        font-size: 21px;
    }
}

@media only screen and (max-width : 1033px) {
    .flex--aa {
        background-position: center center;
    }

    .flex--about h2, .flex--about--2 h2 {
        line-height: 30px;
        font-size: 30px;
    }

    .flex--about-left {
        padding-right: 40%;
    }

    .flex--sobre {
        font-size: 18px;
    }

    .flex--menu .flex--rigth a {
        padding: 14px 10px;
    }

    .flex--menu .flex--rigth .flex--btn--1 {
        margin-left: 5px;
    }

    .flex--idioma {
        padding-left: 15px;
    }
}

@media only screen and (max-width : 980px) {
    .flex--platform {
        padding-top: 150px;
    }
}

@media only screen and (max-width : 965px) {
    .flex--platform--icons aside div h1 {
        font-size: 28px;
        line-height: 35px;
    }

    .flex--ab form {
        width: 100%;
        max-width: 100%;
    }
}

.links-mobile {
    display: none;
    padding-top: 60px;
    display: none;
    text-align: center;
}

.links-mobile a {
    color: #fff;
    display: inline-block;
    margin: 0 5px;
}

@media only screen and (max-width : 1066px) {
    .flex--trigger {
        display: block;
    }

    .flex--rigth {
        left: -100%;
        position: fixed;
        float: none !important;
        height: 100%;
        top: 0;
        background: linear-gradient(45deg, rgb(9 22 57 / 95%) 0%,rgb(89 124 203 / 95%) 100%);
        z-index: 100;
        width: 100%;
        transition: 0.3s;
        -moz-transition: 0.3s;
        -webkit-transition: 0.3s;
    }

    .flex--rigth.open {
        left: 0;
    }

    .flex--menu .flex--rigth a {
        display: block;
        font-size: 20px;
        float: none;
        width: 100%;
        text-transform: uppercase;
        text-align: center;
        border: none !important;
        padding: 14px 10px !important;
    }

    .flex--hover--1::before, .flex--hover--1::after {
        display: none !important
    }

    .flex--menu .flex--rigth a:hover, .flex--menu.flex--fixed .flex--hover--1:hover {
        color: #fff !important;
        background: none !important;
    }

    .out-menu {
        display: block;
        cursor: pointer;
    }

    .nDiv {
        position: absolute;
        top: 50%;
        width: 100%;
        left: 0;
        padding: 0 30px;
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .links-mobile {
        display: block;
    }
}

@media only screen and (max-width : 950px) {
    .flex--box--middle {
        width: 50%;
    }

    .flex--box--middle.center {
        width: 50%;
    }

    .flex--box--middle.last {
        width: 100%;
    }

    .flex--header-title .top1 {
        font-size: 65px;
    }

    .flex--header-title .top2 {
        font-size: 40px;
    }

    .flex--what .flex--boxed {
        float: none;
        width: 100%;
    }

    .flex--what .flex--boxed div {
        padding: 5px;
    }
}

@media only screen and (max-width : 910px) {
    .icons-redes li {
        float: left;
        width: 50%;
        margin-bottom: 50px;
    }

    .header-sociais .desc2 {
        padding-top: 20px;
    }

    .flex--enter h1 {
        line-height: 57px;
        font-size: 57px;
        width: 300px;
    }
}

@media only screen and (max-width : 900px) {
    .flex--platform {
        padding-top: 80px;
        background-size: 260% auto;
    }

    .flex--platform--icons aside {
        width: 100%;
        height: 250px;
        overflow: hidden;
    }

    .flex--platform--icons {
        padding-top: 110px;
    }

    .flex--platform--icons aside div {
        bottom: auto;
        text-align: center;
        float: none;
        top: 50%;
        transform: translateY(-50%);
    }

    .flex--platform--icons aside div h1 {
        text-align: center;
        font-size: 42px;
    }

    .flex--platform--icons aside div h2 {
        text-align: center;
    }
}

@media only screen and (max-width : 855px) {
    .flex--box--large {
        width: 100%;
    }

    .flex--box--large.margin--2 {
        margin-top: 0;
    }

    .flex--about h2, .flex--about--2 h2 {
        font-size: 40px;
        line-height: 40px;
    }
}

@media only screen and (max-width : 784px) {
    .flex--platform--icons aside {
        height: 200px;
    }
}

@media only screen and (max-width : 730px) {
    .flex--content-height {
        height: 700px;
    }

    .links-mobile {
        display: block;
    }

    .flex--about-page {
        background-position: left center;
        height: auto;
    }

    .flex--about-left {
        padding-right: 0%;
    }

    .flex--header-title {
        padding-top: 200px;
    }

    .flex--content-height {
        height: 610px;
    }

    .flex--h1 {
        padding-bottom: 45px;
        font-size: 50px;
        line-height: 50px;
    }

    .flex--h1 i {
        font-size: 50px;
        line-height: 50px;
    }

    .flex--form--title {
        font-size: 50px;
        line-height: 50px;
    }

    .flex--terms .flex--page--text {
        padding: 60px 30px;
    }

    .flex--terms .flex--h1 {
        padding-bottom: 45px;
        font-size: 40px;
        line-height: 40px;
    }

    .flex--terms .flex--h1 i {
        font-size: 40px;
        line-height: 40px;
    }

    .flex--terms .flex--h1--2 {
        font-size: 25px;
        margin-bottom: 40px;
    }

    .flex--aa {
        width: 100%;
        height: 600px;
        background-size: 100% auto;
    }

    .flex--aa div h1 {
        line-height: 57px;
        font-size: 57px;
    }

    .flex--aa div p {
        font-size: 26px;
        line-height: 34px;
    }

    .flex--ab {
        float: left;
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
        height: 500px;
        margin-bottom: 100px;
        margin-top: -15%;
    }

    .flex--terms .flex--page--text p, .flex--terms .flex--page--text b {
        font-size: 18px;
    }

    .flex--menu .flex--logo {
        width: 160px;
        height: 40px;
    }

    .flex--menu .flex--content {
        padding: 20px 15px;
        padding-right: 10px;
    }

    .flex--menu.flex--fixed .flex--content {
        padding: 20px 15px;
        padding-right: 10px;
    }

    .flex--idioma {
        padding-left: 0;
        padding-top: 10px;
    }

    .flex--languages {
        top: 62px;
    }

    .flex--login--title {
        font-size: 42px;
    }

    .margin--4 .flex--form--title {
        font-size: 42px;
        line-height: 43px;
    }

    .flex--enter h1 {
        font-size: 42px;
        line-height: 43px;
    }

    .flex--menu .flex--logo {
        width: 135px;
        height: 35px;
    }

    .flex--header-title {
        padding-top: 170px;
    }

    .flex--idioma i {
        padding-top: 2px;
        font-size: 10px;
    }

    .flex--ab form {
        padding: 50px 30px;
    }
}

@media only screen and (max-width : 697px) {
    .flex--platform {
        background-size: auto;
    }

    .flex--platform--icons aside div h1 {
        font-size: 32px;
        line-height: 35px;
    }

    .flex--platform--icons aside div {
        padding-left: 50px;
        padding-right: 50px;
    }
}

@media only screen and (max-width : 660px) {
    .flex--header-title .top1 {
        font-size: 50px;
        line-height: 50px;
        height: auto;
    }

    .flex--header-title .top2 {
        font-size: 38px;
        line-height: 41px;
    }
}

@media only screen and (max-width : 650px) {
    .flex--enter .flex--content {
        padding-left: 40px;
        padding-right: 40px;
    }

    .flex--enter h2 {
        font-size: 23px;
    }

    .flex--box--middle {
        width: 100%;
    }

    .flex--box--middle.center {
        width: 100%;
    }

    .flex--box--middle.last {
        width: 100%;
    }

    .flex--listers a .top {
        font-size: 23px;
    }

    .flex--h1--2 {
        font-size: 23px;
    }
}

@media only screen and (max-width : 550px) {
    .icons-redes li {
        float: left;
        width: 100%;
    }

    .flex--inpage .flex--content {
        padding-left: 0;
        padding-right: 0;
    }

    .flex--form--login {
        padding: 60px 30px;
    }

    .flex--form--login, .flex--info--login {
        padding: 60px 30px;
        height: auto !important;
    }

    .margin--4 {
        margin-top: 0;
    }
}

@media only screen and (max-width : 498px) {
    .flex--aa {
        background-size: auto 100%;
    }
}

@media only screen and (max-width : 470px) {
    .flex--h1--2 {
        font-size: 20px;
    }

    .flex--h1 {
        font-size: 42px;
        line-height: 42px;
    }

    .flex--h1 i {
        font-size: 42px;
        line-height: 42px;
    }

    .form-rigth .box {
        width: 100%;
        margin-right: 0;
    }

    .flex--box--middle .box-large {
        width: 100%;
        margin-right: 0 !important;
    }

    .flex--box--middle p .bot {
        font-size: 13px;
        padding: 12px 23px;
    }
}

.dialog, .dialog__overlay {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.dialog {
    position: fixed;
    z-index: 1000;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    pointer-events: none;
}

.dialog__overlay {
    position: absolute;
    z-index: 1;
    background: rgba(42, 37, 69, 0.9);
    opacity: 0;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
    -webkit-backface-visibility: hidden;
}

.dialog--open .dialog__overlay {
    opacity: 1;
    pointer-events: auto;
}

.dialog__content {
    width: 50%;
    max-width: 560px;
    min-width: 290px;
    background: #fff;
    padding: 4em;
    text-align: center;
    position: relative;
    z-index: 5;
    opacity: 0;
}

.dialog--open .dialog__content {
    pointer-events: auto;
}

/* Content */
.dialog h2 {
    margin: 0;
    font-weight: 400;
    font-size: 2em;
    padding: 0 0 1em;
    margin: 0;
}

.dialog__overlay {
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.dialog.dialog--open .dialog__content, .dialog.dialog--close .dialog__content {
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

.dialog.dialog--open .dialog__content {
    -webkit-animation-name: anim-open;
    animation-name: anim-open;
}

.dialog.dialog--close .dialog__content {
    -webkit-animation-name: anim-close;
    animation-name: anim-close;
}

.dialog.dialog--open h2, .dialog.dialog--open button {
    -webkit-animation: anim-elem 0.3s both;
    animation: anim-elem 0.3s both;
}

.dialog.dialog--open h2 {
    color: #c94e50;
    -webkit-animation-delay: 0.05s;
    animation-delay: 0.05s;
}

.dialog.dialog--open button {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
}

button.action {
    padding: 1em 2em;
    outline: none;
    font-weight: 700;
    border: none;
    color: #fff;
    background: #c94e50;
}

.dialog__content.ok h2 {
    color: #4e6cc9;
}

.dialog__content.ok button.action {
    background: #4e6cc9;
}

@-webkit-keyframes anim-open {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 50px, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
    }
}

@keyframes anim-open {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 50px, 0);
        transform: translate3d(0, 50px, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes anim-close {
    0% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, 50px, 0);
    }
}

@keyframes anim-close {
    0% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translate3d(0, 50px, 0);
        transform: translate3d(0, 50px, 0);
    }
}

/* Inner elements animations */
@-webkit-keyframes anim-elem {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 25px, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
    }
}

@keyframes anim-elem {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 25px, 0);
        transform: translate3d(0, 25px, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.tabs {
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    position: relative;
    background: white;
    padding: 50px;
    padding-bottom: 80px;
}

.tabs input[name="tab-control"] {
    display: none;
}

.tabs .content section h2, .tabs ul li label {
    font-family: "Montserrat";
    font-weight: bold;
    font-size: 18px;
    color: #0052ce;
}

.tabs ul {
    list-style-type: none;
    padding-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-bottom: 10px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.tabs ul li {
    box-sizing: border-box;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 33%;
    padding: 0 10px;
    text-align: center;
}

.tabs ul li label {
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    color: #929daf;
    padding: 5px auto;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    white-space: nowrap;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.tabs ul li label br {
    display: none;
}

.tabs ul li label svg {
    fill: #929daf;
    height: 1.2em;
    vertical-align: bottom;
    margin-right: 0.2em;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.tabs ul li label:hover, .tabs ul li label:focus, .tabs ul li label:active {
    outline: 0;
    color: #bec5cf;
}

.tabs ul li label:hover svg, .tabs ul li label:focus svg, .tabs ul li label:active svg {
    fill: #bec5cf;
}

.tabs .slider {
    position: relative;
    width: 33%;
    -webkit-transition: all 0.33s cubic-bezier(0.38, 0.8, 0.32, 1.07);
    transition: all 0.33s cubic-bezier(0.38, 0.8, 0.32, 1.07);
}

.tabs .slider .indicator {
    position: relative;
    width: 50px;
    max-width: 100%;
    margin: 0 auto;
    height: 4px;
    background: #0052ce;
    border-radius: 1px;
}

.tabs .content {
    margin-top: 30px;
}

.tabs .content section {
    display: none;
    -webkit-animation-name: content;
    animation-name: content;
    -webkit-animation-direction: normal;
    animation-direction: normal;
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    line-height: 1.4;
}

.tabs .content section h2 {
    color: #0052ce;
    display: none;
}

.tabs .content section h2::after {
    content: "";
    position: relative;
    display: block;
    width: 30px;
    height: 3px;
    background: #0052ce;
    margin-top: 5px;
    left: 1px;
}

.tabs input[name="tab-control"]:nth-of-type(1):checked ~ ul > li:nth-child(1) > label {
    cursor: default;
    color: #0052ce;
}

.tabs input[name="tab-control"]:nth-of-type(1):checked ~ ul > li:nth-child(1) > label svg {
    fill: #0052ce;
}

@media (max-width: 600px) {
    .tabs input[name="tab-control"]:nth-of-type(1):checked ~ ul > li:nth-child(1) > label {
        background: rgba(0, 0, 0, 0.08);
    }
}

.tabs input[name="tab-control"]:nth-of-type(1):checked ~ .slider {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
}

.tabs input[name="tab-control"]:nth-of-type(1):checked ~ .content > section:nth-child(1) {
    display: block;
}

.tabs input[name="tab-control"]:nth-of-type(2):checked ~ ul > li:nth-child(2) > label {
    cursor: default;
    color: #0052ce;
}

.tabs input[name="tab-control"]:nth-of-type(2):checked ~ ul > li:nth-child(2) > label svg {
    fill: #0052ce;
}

@media (max-width: 600px) {
    .tabs input[name="tab-control"]:nth-of-type(2):checked ~ ul > li:nth-child(2) > label {
        background: rgba(0, 0, 0, 0.08);
    }
}

.tabs input[name="tab-control"]:nth-of-type(2):checked ~ .slider {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}

.tabs input[name="tab-control"]:nth-of-type(2):checked ~ .content > section:nth-child(2) {
    display: block;
}

.tabs input[name="tab-control"]:nth-of-type(3):checked ~ ul > li:nth-child(3) > label {
    cursor: default;
    color: #0052ce;
}

.tabs input[name="tab-control"]:nth-of-type(3):checked ~ ul > li:nth-child(3) > label svg {
    fill: #0052ce;
}

@media (max-width: 600px) {
    .tabs input[name="tab-control"]:nth-of-type(3):checked ~ ul > li:nth-child(3) > label {
        background: rgba(0, 0, 0, 0.08);
    }
}

.tabs input[name="tab-control"]:nth-of-type(3):checked ~ .slider {
    -webkit-transform: translateX(200%);
    transform: translateX(200%);
}

.tabs input[name="tab-control"]:nth-of-type(3):checked ~ .content > section:nth-child(3) {
    display: block;
}

.tabs input[name="tab-control"]:nth-of-type(4):checked ~ ul > li:nth-child(4) > label {
    cursor: default;
    color: #0052ce;
}

.tabs input[name="tab-control"]:nth-of-type(4):checked ~ ul > li:nth-child(4) > label svg {
    fill: #0052ce;
}

@media (max-width: 600px) {
    .tabs input[name="tab-control"]:nth-of-type(4):checked ~ ul > li:nth-child(4) > label {
        background: rgba(0, 0, 0, 0.08);
    }
}

.tabs input[name="tab-control"]:nth-of-type(4):checked ~ .slider {
    -webkit-transform: translateX(300%);
    transform: translateX(300%);
}

.tabs input[name="tab-control"]:nth-of-type(4):checked ~ .content > section:nth-child(4) {
    display: block;
}

@-webkit-keyframes content {
    from {
        opacity: 0;
        -webkit-transform: translateY(5%);
        transform: translateY(5%);
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@keyframes content {
    from {
        opacity: 0;
        -webkit-transform: translateY(5%);
        transform: translateY(5%);
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@media (max-width: 1000px) {
    .tabs ul li label {
        white-space: initial;
    }

    .tabs ul li label br {
        display: initial;
    }

    .tabs ul li label svg {
        height: 1.5em;
    }
}

@media (max-width: 600px) {
    .tabs ul li label {
        padding: 5px;
        border-radius: 5px;
    }

    .tabs ul li label span {
        display: none;
    }

    .tabs .slider {
        display: none;
    }

    .tabs .content {
        margin-top: 20px;
    }

    .tabs .content section h2 {
        display: block;
    }
}

@-webkit-keyframes bounce {
    0%,20%,53%,80%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1);
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    40%,43% {
        -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        -webkit-transform: translate3d(0,-30px,0);
        transform: translate3d(0,-30px,0)
    }

    70% {
        -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        -webkit-transform: translate3d(0,-15px,0);
        transform: translate3d(0,-15px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-4px,0);
        transform: translate3d(0,-4px,0)
    }
}

@keyframes bounce {
    0%,20%,53%,80%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1);
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    40%,43% {
        -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        -webkit-transform: translate3d(0,-30px,0);
        transform: translate3d(0,-30px,0)
    }

    70% {
        -webkit-animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        animation-timing-function: cubic-bezier(.755,.05,.855,.06);
        -webkit-transform: translate3d(0,-15px,0);
        transform: translate3d(0,-15px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-4px,0);
        transform: translate3d(0,-4px,0)
    }
}

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

@-webkit-keyframes flash {
    0%,50%,to {
        opacity: 1
    }

    25%,75% {
        opacity: 0
    }
}

@keyframes flash {
    0%,50%,to {
        opacity: 1
    }

    25%,75% {
        opacity: 0
    }
}

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

@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    50% {
        -webkit-transform: scale3d(1.05,1.05,1.05);
        transform: scale3d(1.05,1.05,1.05)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    50% {
        -webkit-transform: scale3d(1.05,1.05,1.05);
        transform: scale3d(1.05,1.05,1.05)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

@-webkit-keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    30% {
        -webkit-transform: scale3d(1.25,.75,1);
        transform: scale3d(1.25,.75,1)
    }

    40% {
        -webkit-transform: scale3d(.75,1.25,1);
        transform: scale3d(.75,1.25,1)
    }

    50% {
        -webkit-transform: scale3d(1.15,.85,1);
        transform: scale3d(1.15,.85,1)
    }

    65% {
        -webkit-transform: scale3d(.95,1.05,1);
        transform: scale3d(.95,1.05,1)
    }

    75% {
        -webkit-transform: scale3d(1.05,.95,1);
        transform: scale3d(1.05,.95,1)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes rubberBand {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    30% {
        -webkit-transform: scale3d(1.25,.75,1);
        transform: scale3d(1.25,.75,1)
    }

    40% {
        -webkit-transform: scale3d(.75,1.25,1);
        transform: scale3d(.75,1.25,1)
    }

    50% {
        -webkit-transform: scale3d(1.15,.85,1);
        transform: scale3d(1.15,.85,1)
    }

    65% {
        -webkit-transform: scale3d(.95,1.05,1);
        transform: scale3d(.95,1.05,1)
    }

    75% {
        -webkit-transform: scale3d(1.05,.95,1);
        transform: scale3d(1.05,.95,1)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

@-webkit-keyframes shake {
    0%,to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    10%,30%,50%,70%,90% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    20%,40%,60%,80% {
        -webkit-transform: translate3d(10px,0,0);
        transform: translate3d(10px,0,0)
    }
}

@keyframes shake {
    0%,to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    10%,30%,50%,70%,90% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    20%,40%,60%,80% {
        -webkit-transform: translate3d(10px,0,0);
        transform: translate3d(10px,0,0)
    }
}

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

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

    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }

    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }

    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }

    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }

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

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

    6.5% {
        -webkit-transform: translateX(-6px) rotateY(-9deg);
        transform: translateX(-6px) rotateY(-9deg)
    }

    18.5% {
        -webkit-transform: translateX(5px) rotateY(7deg);
        transform: translateX(5px) rotateY(7deg)
    }

    31.5% {
        -webkit-transform: translateX(-3px) rotateY(-5deg);
        transform: translateX(-3px) rotateY(-5deg)
    }

    43.5% {
        -webkit-transform: translateX(2px) rotateY(3deg);
        transform: translateX(2px) rotateY(3deg)
    }

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

.headShake {
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-name: headShake;
    animation-name: headShake
}

@-webkit-keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }

    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }

    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }

    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes swing {
    20% {
        -webkit-transform: rotate(15deg);
        transform: rotate(15deg)
    }

    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    60% {
        -webkit-transform: rotate(5deg);
        transform: rotate(5deg)
    }

    80% {
        -webkit-transform: rotate(-5deg);
        transform: rotate(-5deg)
    }

    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

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

@-webkit-keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    10%,20% {
        -webkit-transform: scale3d(.9,.9,.9) rotate(-3deg);
        transform: scale3d(.9,.9,.9) rotate(-3deg)
    }

    30%,50%,70%,90% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate(3deg);
        transform: scale3d(1.1,1.1,1.1) rotate(3deg)
    }

    40%,60%,80% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate(-3deg);
        transform: scale3d(1.1,1.1,1.1) rotate(-3deg)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    10%,20% {
        -webkit-transform: scale3d(.9,.9,.9) rotate(-3deg);
        transform: scale3d(.9,.9,.9) rotate(-3deg)
    }

    30%,50%,70%,90% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate(3deg);
        transform: scale3d(1.1,1.1,1.1) rotate(3deg)
    }

    40%,60%,80% {
        -webkit-transform: scale3d(1.1,1.1,1.1) rotate(-3deg);
        transform: scale3d(1.1,1.1,1.1) rotate(-3deg)
    }

    to {
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

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

    15% {
        -webkit-transform: translate3d(-25%,0,0) rotate(-5deg);
        transform: translate3d(-25%,0,0) rotate(-5deg)
    }

    30% {
        -webkit-transform: translate3d(20%,0,0) rotate(3deg);
        transform: translate3d(20%,0,0) rotate(3deg)
    }

    45% {
        -webkit-transform: translate3d(-15%,0,0) rotate(-3deg);
        transform: translate3d(-15%,0,0) rotate(-3deg)
    }

    60% {
        -webkit-transform: translate3d(10%,0,0) rotate(2deg);
        transform: translate3d(10%,0,0) rotate(2deg)
    }

    75% {
        -webkit-transform: translate3d(-5%,0,0) rotate(-1deg);
        transform: translate3d(-5%,0,0) rotate(-1deg)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    15% {
        -webkit-transform: translate3d(-25%,0,0) rotate(-5deg);
        transform: translate3d(-25%,0,0) rotate(-5deg)
    }

    30% {
        -webkit-transform: translate3d(20%,0,0) rotate(3deg);
        transform: translate3d(20%,0,0) rotate(3deg)
    }

    45% {
        -webkit-transform: translate3d(-15%,0,0) rotate(-3deg);
        transform: translate3d(-15%,0,0) rotate(-3deg)
    }

    60% {
        -webkit-transform: translate3d(10%,0,0) rotate(2deg);
        transform: translate3d(10%,0,0) rotate(2deg)
    }

    75% {
        -webkit-transform: translate3d(-5%,0,0) rotate(-1deg);
        transform: translate3d(-5%,0,0) rotate(-1deg)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

@-webkit-keyframes jello {
    0%,11.1%,to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }

    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg)
    }

    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }

    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }

    66.6% {
        -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }

    77.7% {
        -webkit-transform: skewX(.390625deg) skewY(.390625deg);
        transform: skewX(.390625deg) skewY(.390625deg)
    }

    88.8% {
        -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

@keyframes jello {
    0%,11.1%,to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    22.2% {
        -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }

    33.3% {
        -webkit-transform: skewX(6.25deg) skewY(6.25deg);
        transform: skewX(6.25deg) skewY(6.25deg)
    }

    44.4% {
        -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }

    55.5% {
        -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }

    66.6% {
        -webkit-transform: skewX(-.78125deg) skewY(-.78125deg);
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }

    77.7% {
        -webkit-transform: skewX(.390625deg) skewY(.390625deg);
        transform: skewX(.390625deg) skewY(.390625deg)
    }

    88.8% {
        -webkit-transform: skewX(-.1953125deg) skewY(-.1953125deg);
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

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

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

    14% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

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

    42% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

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

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

    14% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

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

    42% {
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

    70% {
        -webkit-transform: scale(1);
        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 {
    0%,20%,40%,60%,80%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    20% {
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }

    40% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03,1.03,1.03);
        transform: scale3d(1.03,1.03,1.03)
    }

    80% {
        -webkit-transform: scale3d(.97,.97,.97);
        transform: scale3d(.97,.97,.97)
    }

    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

@keyframes bounceIn {
    0%,20%,40%,60%,80%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    20% {
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }

    40% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03,1.03,1.03);
        transform: scale3d(1.03,1.03,1.03)
    }

    80% {
        -webkit-transform: scale3d(.97,.97,.97);
        transform: scale3d(.97,.97,.97)
    }

    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }
}

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

@-webkit-keyframes bounceInDown {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-3000px,0);
        transform: translate3d(0,-3000px,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0,25px,0);
        transform: translate3d(0,25px,0)
    }

    75% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    90% {
        -webkit-transform: translate3d(0,5px,0);
        transform: translate3d(0,5px,0)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInDown {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-3000px,0);
        transform: translate3d(0,-3000px,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0,25px,0);
        transform: translate3d(0,25px,0)
    }

    75% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    90% {
        -webkit-transform: translate3d(0,5px,0);
        transform: translate3d(0,5px,0)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

@-webkit-keyframes bounceInLeft {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px,0,0);
        transform: translate3d(-3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px,0,0);
        transform: translate3d(25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(5px,0,0);
        transform: translate3d(5px,0,0)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInLeft {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px,0,0);
        transform: translate3d(-3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px,0,0);
        transform: translate3d(25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(-10px,0,0);
        transform: translate3d(-10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(5px,0,0);
        transform: translate3d(5px,0,0)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

@-webkit-keyframes bounceInRight {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px,0,0);
        transform: translate3d(3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px,0,0);
        transform: translate3d(-25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(10px,0,0);
        transform: translate3d(10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(-5px,0,0);
        transform: translate3d(-5px,0,0)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInRight {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px,0,0);
        transform: translate3d(3000px,0,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px,0,0);
        transform: translate3d(-25px,0,0)
    }

    75% {
        -webkit-transform: translate3d(10px,0,0);
        transform: translate3d(10px,0,0)
    }

    90% {
        -webkit-transform: translate3d(-5px,0,0);
        transform: translate3d(-5px,0,0)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

@-webkit-keyframes bounceInUp {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,3000px,0);
        transform: translate3d(0,3000px,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }

    75% {
        -webkit-transform: translate3d(0,10px,0);
        transform: translate3d(0,10px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-5px,0);
        transform: translate3d(0,-5px,0)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes bounceInUp {
    0%,60%,75%,90%,to {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1)
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,3000px,0);
        transform: translate3d(0,3000px,0)
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }

    75% {
        -webkit-transform: translate3d(0,10px,0);
        transform: translate3d(0,10px,0)
    }

    90% {
        -webkit-transform: translate3d(0,-5px,0);
        transform: translate3d(0,-5px,0)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

@-webkit-keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }

    50%,55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }
}

@keyframes bounceOut {
    20% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9)
    }

    50%,55% {
        opacity: 1;
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1)
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }
}

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

@-webkit-keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0,10px,0);
        transform: translate3d(0,10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }
}

@keyframes bounceOutDown {
    20% {
        -webkit-transform: translate3d(0,10px,0);
        transform: translate3d(0,10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,-20px,0);
        transform: translate3d(0,-20px,0)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }
}

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

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

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

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

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

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

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

    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }
}

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

    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }
}

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

@-webkit-keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

@keyframes bounceOutUp {
    20% {
        -webkit-transform: translate3d(0,-10px,0);
        transform: translate3d(0,-10px,0)
    }

    40%,45% {
        opacity: 1;
        -webkit-transform: translate3d(0,20px,0);
        transform: translate3d(0,20px,0)
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

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

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

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

@-webkit-keyframes fadeOutDown {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }
}

@keyframes fadeOutDown {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }
}

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

@-webkit-keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }
}

@keyframes fadeOutDownBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,2000px,0);
        transform: translate3d(0,2000px,0)
    }
}

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

@-webkit-keyframes fadeOutLeft {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0)
    }
}

@keyframes fadeOutLeft {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0)
    }
}

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

@-webkit-keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

@keyframes fadeOutLeftBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(-2000px,0,0);
        transform: translate3d(-2000px,0,0)
    }
}

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

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }
}

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

@-webkit-keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }
}

@keyframes fadeOutRightBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(2000px,0,0);
        transform: translate3d(2000px,0,0)
    }
}

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

@-webkit-keyframes fadeOutUp {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,-100%,0);
        transform: translate3d(0,-100%,0)
    }
}

@keyframes fadeOutUp {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,-100%,0);
        transform: translate3d(0,-100%,0)
    }
}

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

@-webkit-keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

@keyframes fadeOutUpBig {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(0,-2000px,0);
        transform: translate3d(0,-2000px,0)
    }
}

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

@-webkit-keyframes flip {
    0% {
        -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    40% {
        -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    50% {
        -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    80% {
        -webkit-transform: perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);
        transform: perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    to {
        -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
}

@keyframes flip {
    0% {
        -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    40% {
        -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }

    50% {
        -webkit-transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        transform: perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    80% {
        -webkit-transform: perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);
        transform: perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    to {
        -webkit-transform: perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);
        transform: perspective(400px) scaleX(1) translateZ(0) rotateY(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 {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        transform: perspective(400px) rotateX(10deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInX {
    0% {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(400px) rotateX(10deg);
        transform: perspective(400px) rotateX(10deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(400px) rotateX(-5deg);
        transform: perspective(400px) rotateX(-5deg)
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

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

@-webkit-keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotateY(-20deg);
        transform: perspective(400px) rotateY(-20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        transform: perspective(400px) rotateY(10deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

@keyframes flipInY {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        -webkit-transform: perspective(400px) rotateY(-20deg);
        transform: perspective(400px) rotateY(-20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }

    60% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        transform: perspective(400px) rotateY(10deg);
        opacity: 1
    }

    80% {
        -webkit-transform: perspective(400px) rotateY(-5deg);
        transform: perspective(400px) rotateY(-5deg)
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }
}

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

@-webkit-keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }

    30% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        opacity: 1
    }

    to {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
}

@keyframes flipOutX {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }

    30% {
        -webkit-transform: perspective(400px) rotateX(-20deg);
        transform: perspective(400px) rotateX(-20deg);
        opacity: 1
    }

    to {
        -webkit-transform: perspective(400px) rotateX(90deg);
        transform: perspective(400px) rotateX(90deg);
        opacity: 0
    }
}

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

@-webkit-keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }

    30% {
        -webkit-transform: perspective(400px) rotateY(-15deg);
        transform: perspective(400px) rotateY(-15deg);
        opacity: 1
    }

    to {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
}

@keyframes flipOutY {
    0% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px)
    }

    30% {
        -webkit-transform: perspective(400px) rotateY(-15deg);
        transform: perspective(400px) rotateY(-15deg);
        opacity: 1
    }

    to {
        -webkit-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        opacity: 0
    }
}

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

@-webkit-keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%,0,0) skewX(-30deg);
        transform: translate3d(100%,0,0) skewX(-30deg);
        opacity: 0
    }

    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1
    }

    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes lightSpeedIn {
    0% {
        -webkit-transform: translate3d(100%,0,0) skewX(-30deg);
        transform: translate3d(100%,0,0) skewX(-30deg);
        opacity: 0
    }

    60% {
        -webkit-transform: skewX(20deg);
        transform: skewX(20deg);
        opacity: 1
    }

    80% {
        -webkit-transform: skewX(-5deg);
        transform: skewX(-5deg)
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.lightSpeedIn {
    -webkit-animation-name: lightSpeedIn;
    animation-name: lightSpeedIn;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
}

@-webkit-keyframes lightSpeedOut {
    0% {
        opacity: 1
    }

    to {
        -webkit-transform: translate3d(100%,0,0) skewX(30deg);
        transform: translate3d(100%,0,0) skewX(30deg);
        opacity: 0
    }
}

@keyframes lightSpeedOut {
    0% {
        opacity: 1
    }

    to {
        -webkit-transform: translate3d(100%,0,0) skewX(30deg);
        transform: translate3d(100%,0,0) skewX(30deg);
        opacity: 0
    }
}

.lightSpeedOut {
    -webkit-animation-name: lightSpeedOut;
    animation-name: lightSpeedOut;
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
}

@-webkit-keyframes rotateIn {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes rotateIn {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate(-200deg);
        transform: rotate(-200deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

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

@-webkit-keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes rotateInDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

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

@-webkit-keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes rotateInDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

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

@-webkit-keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes rotateInUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

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

@-webkit-keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes rotateInUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg);
        opacity: 0
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

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

@-webkit-keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1
    }

    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0
    }
}

@keyframes rotateOut {
    0% {
        -webkit-transform-origin: center;
        transform-origin: center;
        opacity: 1
    }

    to {
        -webkit-transform-origin: center;
        transform-origin: center;
        -webkit-transform: rotate(200deg);
        transform: rotate(200deg);
        opacity: 0
    }
}

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

@-webkit-keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        opacity: 0
    }
}

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

@-webkit-keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

@keyframes rotateOutDownRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

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

@-webkit-keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

@keyframes rotateOutUpLeft {
    0% {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        opacity: 1
    }

    to {
        -webkit-transform-origin: left bottom;
        transform-origin: left bottom;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        opacity: 0
    }
}

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

@-webkit-keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0
    }
}

@keyframes rotateOutUpRight {
    0% {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        opacity: 1
    }

    to {
        -webkit-transform-origin: right bottom;
        transform-origin: right bottom;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        opacity: 0
    }
}

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

@-webkit-keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    20%,60% {
        -webkit-transform: rotate(80deg);
        transform: rotate(80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    40%,80% {
        -webkit-transform: rotate(60deg);
        transform: rotate(60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }

    to {
        -webkit-transform: translate3d(0,700px,0);
        transform: translate3d(0,700px,0);
        opacity: 0
    }
}

@keyframes hinge {
    0% {
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    20%,60% {
        -webkit-transform: rotate(80deg);
        transform: rotate(80deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    40%,80% {
        -webkit-transform: rotate(60deg);
        transform: rotate(60deg);
        -webkit-transform-origin: top left;
        transform-origin: top left;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        opacity: 1
    }

    to {
        -webkit-transform: translate3d(0,700px,0);
        transform: translate3d(0,700px,0);
        opacity: 0
    }
}

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

@-webkit-keyframes jackInTheBox {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1) rotate(30deg);
        transform: scale(.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom
    }

    50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    70% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg)
    }

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

@keyframes jackInTheBox {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1) rotate(30deg);
        transform: scale(.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom
    }

    50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    70% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg)
    }

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

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

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

@-webkit-keyframes rollOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0) rotate(120deg);
        transform: translate3d(100%,0,0) rotate(120deg)
    }
}

@keyframes rollOut {
    0% {
        opacity: 1
    }

    to {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0) rotate(120deg);
        transform: translate3d(100%,0,0) rotate(120deg)
    }
}

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

@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    50% {
        opacity: 1
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    50% {
        opacity: 1
    }
}

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

@-webkit-keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-1000px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

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

@-webkit-keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0);
        transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(10px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(10px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomInLeft {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0);
        transform: scale3d(.1,.1,.1) translate3d(-1000px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(10px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(10px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

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

@-webkit-keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(1000px,0,0);
        transform: scale3d(.1,.1,.1) translate3d(1000px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(-10px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(-10px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomInRight {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(1000px,0,0);
        transform: scale3d(.1,.1,.1) translate3d(1000px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(-10px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(-10px,0,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

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

@-webkit-keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,1000px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomInUp {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,1000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,1000px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

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

@-webkit-keyframes zoomOut {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    to {
        opacity: 0
    }
}

@keyframes zoomOut {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3)
    }

    to {
        opacity: 0
    }
}

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

@-webkit-keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,2000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,2000px,0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomOutDown {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,-60px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,2000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,2000px,0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

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

@-webkit-keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(42px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(42px,0,0)
    }

    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px,0,0);
        transform: scale(.1) translate3d(-2000px,0,0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}

@keyframes zoomOutLeft {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(42px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(42px,0,0)
    }

    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(-2000px,0,0);
        transform: scale(.1) translate3d(-2000px,0,0);
        -webkit-transform-origin: left center;
        transform-origin: left center
    }
}

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

@-webkit-keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(-42px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(-42px,0,0)
    }

    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px,0,0);
        transform: scale(.1) translate3d(2000px,0,0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}

@keyframes zoomOutRight {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(-42px,0,0);
        transform: scale3d(.475,.475,.475) translate3d(-42px,0,0)
    }

    to {
        opacity: 0;
        -webkit-transform: scale(.1) translate3d(2000px,0,0);
        transform: scale(.1) translate3d(2000px,0,0);
        -webkit-transform-origin: right center;
        transform-origin: right center
    }
}

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

@-webkit-keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

@keyframes zoomOutUp {
    40% {
        opacity: 1;
        -webkit-transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        transform: scale3d(.475,.475,.475) translate3d(0,60px,0);
        -webkit-animation-timing-function: cubic-bezier(.55,.055,.675,.19);
        animation-timing-function: cubic-bezier(.55,.055,.675,.19)
    }

    to {
        opacity: 0;
        -webkit-transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0);
        transform: scale3d(.1,.1,.1) translate3d(0,-2000px,0);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
        -webkit-animation-timing-function: cubic-bezier(.175,.885,.32,1);
        animation-timing-function: cubic-bezier(.175,.885,.32,1)
    }
}

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

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

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

@-webkit-keyframes slideOutDown {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

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

@keyframes slideOutDown {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

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

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

@-webkit-keyframes slideOutLeft {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

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

@keyframes slideOutLeft {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

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

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

@-webkit-keyframes slideOutRight {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

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

@keyframes slideOutRight {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

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

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

@-webkit-keyframes slideOutUp {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

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

@keyframes slideOutUp {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(0,-100%,0);
        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: .8s;
    animation-duration: .8s
}

.animated.faster {
    -webkit-animation-duration: .5s;
    animation-duration: .5s
}

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

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

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