@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(https://fonts.gstatic.com/s/opensans/v16/mem5YaGs126MiZpBA-UN_r8OUuhp.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v16/mem8YaGs126MiZpBA-UFVZ0b.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local('Open Sans Bold'), local('OpenSans-Bold'), url(https://fonts.gstatic.com/s/opensans/v16/mem5YaGs126MiZpBA-UN7rgOUuhp.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
body.checkout2steps { padding:15px; margin: 0; background:#EFEFEF; font-family: Arial; font-size: 14px; }
.checkout2steps a { color:#5A8FE5; }
.checkout2steps img { max-width:100%; }
.checkout2steps .clear { clear:both; }
.checkout2steps .left { float:left; }
.checkout2steps .right { float:right; }
body.checkout2steps div { position:relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.checkout2steps .container { width:100%; max-width:920px; margin:0 auto; background:#FDFDFD; box-shadow: 0 0 5px rgba(0,0,0,0.3); border: none; border-radius: 5px; }
.checkout2steps .banner img { width: 100%; display: block; }
.checkout2steps .main { width: 70%; float:left; }
.checkout2steps .details { display: table; width: 100%; padding: 10px 20px; min-height: 102px; font-family:'Open Sans'; color:#555; border-bottom: 1px solid #CCC; }
.checkout2steps .details img { display:inline-block;background:#FFF; vertical-align:middle; width: 80px; border: 1px solid #CCC; border-radius: 5px; box-shadow: 0 0 3px rgba(0,0,0,0.15); padding-bottom: 4px; }
.checkout2steps .details .info { display: table-cell; vertical-align: middle; }
.checkout2steps .details h1 { font-size: 18px; margin:0; }
.checkout2steps .details p { margin:2px 0; }
.checkout2steps .details p.isdigital { font-style: italic; font-size: 13px; }
.checkout2steps .sidebar { width: 30%; float:right; }
.checkout2steps .address, .checkout2steps .step2 { display:none; }
.checkout2steps .step1, .checkout2steps .step2 { width: 100%; max-width: 450px; margin: 25px auto; }
.checkout2steps .step2 { width: 90%; }
.checkout2steps .sload { display: none; }
.checkout2steps .form-group input, .checkout2steps .form-group select, .checkout2steps .frete .shipping { padding: 10px 25px 10px 45px; width: 100%; margin: 0 auto 15px; border: 2px solid #E5E5E5; border-radius:3px; background:#FFF; font-size: 17px; font-family: 'Open Sans'; color:#333; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height: 50px; } 
.checkout2steps .form-group select { -webkit-appearance: none; background-color: white; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAJCAYAAAA/33wPAAAAvklEQVQoFY2QMQqEMBBFv7ERa/EMXkGw11K8QbDXzuN4BHv7QO6ifUgj7v4UAdlVM8Uwf+b9YZJISnlqrfEUZVlinucnBGKaJgghbiHOyLyFKIoCbdvecpyReYvo/Ma2bajrGtbaC58kCdZ1RZ7nl/4/4d5EsO/7nzl7IUtodBexMMagaRrs+06JLMvcNWmaOv2W/C/TMAyD58dxROgSmvxFFMdxoOs6lliWBXEcuzokXRbRoJRyvqqqQvye+QDMDz1D6yuj9wAAAABJRU5ErkJggg==); background-position : right center; background-repeat: no-repeat; padding-right: 1.5em; }
.checkout2steps .form-group input::placeholder { color:#AAA; }
.checkout2steps .form-group label { position: absolute; top: 5px; left: 47px; color: #AAA; color: #999; font-size: 12px; display: none; }
.checkout2steps .form-group.filled label { display: block; }
.checkout2steps .form-group.filled input { border-color: #a5d49d; padding:16px 25px 4px 45px; clear: both; }
.checkout2steps .form-group.filled select { border-color: #a5d49d; }
.checkout2steps .form-group.third { width: 63%; display:inline-block; }
.checkout2steps .form-group.third.right { width: 33%; float: right; }
.checkout2steps .form-group.half, .checkout2steps .form-group.half-ico { width:48%; display:inline-block; }
.checkout2steps .form-group.half.right, .checkout2steps .form-group.half-ico.right { float: right; }
.checkout2steps .address .form-group input { padding: 10px 15px!important; }
.checkout2steps .address .form-group.filled input, .checkout2steps .form-group.filled select { padding:16px 25px 4px 15px!important; }
.checkout2steps .address .form-group.filled label, .checkout2steps .form-group.no-ico label { left:17px; }
.checkout2steps .form-group select, .checkout2steps .form-group.filled select { padding: 15px 26px 3px 15px!important }

.checkout2steps .form-group .fas, .checkout2steps .form-group .far { font-size:1.4em; position: absolute; color: #DDD; top: 15px; left: 14px; }

.checkout2steps .form-group .fa-check { left: auto; font-size: 13px; top:18px; right:14px; color: #09d261; display:none; pointer-events: none; }
.checkout2steps .form-group select+.fa-check { right:25px; }

.checkout2steps .form-group.valid .fa-check { display: block; }
.checkout2steps .form-group .fab { font-size:1.4em; position: absolute; color: #CCC; top: 15px; left: 14px; } 
.checkout2steps .frete { clear:both; margin-bottom: 15px; }
.checkout2steps .frete p { font-family: 'Open Sans'; font-size: 16px; color:#333; margin:0 0 5px 0; padding: 0 5px; }
.checkout2steps .frete .shipping { padding: 10px; cursor: pointer; font-size: 15px; margin-bottom: 5px; }
.checkout2steps .frete .shipping.active { border-color: #a5d49d; font-weight: 700; }
.checkout2steps .frete .shipping .eta { font-weight: normal!important; font-family:Arial; font-size: 12px; }
.checkout2steps .frete .shipping .price { float: right; }
.checkout2steps .nextbtn { width: 100%; max-width: 250px; margin: 0 auto; background-color: #3CA521; padding: 10px; color:#FFF; font-weight: 700; font-family: 'Open Sans'; font-size: 18px; border: none; border-radius: 4px; cursor:pointer; }
.checkout2steps .nextbtn i { margin-right: 10px; }
.checkout2steps .nextbtn:hover { background-color: #57C03C; }
.checkout2steps .step2 .goback { position:relative; display: block; font-size: 12px; color:#5A8FE5; text-decoration:underline; cursor: pointer; float: right; z-index:2; right: 15px; margin:0; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.checkout2steps .step2 h2 { position: relative; width: 110px; display:inline-block; top:0; z-index:0; padding: 15px; font-size: 14px; color:#333; border: 2px solid #E5E5E5; border-radius: 4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin:0; cursor: pointer; font-weight: 300; text-align:center; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.checkout2steps .step2 h2 i { display:block; font-size: 25px; margin-bottom: 8px; } 
.checkout2steps .step2 h2.active { border-color:#a5d49d; font-weight: 700; }
.checkout2steps .step2 h2+h2 { margin-left:5px; }
.checkout2steps .paytab { display:none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 10px 15px; z-index: 1; margin-top: -2px; }
.checkout2steps .paytab.active  { display:block; }

html[data-useragent*='MSIE'] .checkout2steps .cccontainer, html[data-useragent*='rv:11.0'] .checkout2steps .cccontainer { display:none; }

.checkout2steps .cartao .ccpreview { margin: 10px 0 20px; }
.checkout2steps .cartao select { margin-bottom: 3px; }
.checkout2steps .cartao .juros { position:absolute; width: 100%; font-size: 12px; font-style: italic; margin: 0; text-align: right; display:none; } 
.checkout2steps .cartao .nextbtn { margin-top: 30px; }

.checkout2steps .boleto .barcode { margin: 25px 0 10px; }
.checkout2steps .boleto p { position: relative; margin: 5px 0; }
.checkout2steps .boleto .form-group { margin-top: 12px; }
.checkout2steps .boleto .nextbtn { margin-top: 5px; }
.checkout2steps .step2 .seguro { font-size: 12px; text-align: center; color: #57C03C; margin:5px; }
.checkout2steps .step2 .selos { text-align: center; margin-top:10px; }
.checkout2steps .footer { font-size: 12px; text-align:center; padding: 15px 20px; color:#666; }
.checkout2steps .selos { text-align: center; }
.checkout2steps .selos img { display: inline-block; margin: 0 4px; }
.checkout2steps .jp-card .jp-card-front, .checkout2steps .jp-card .jp-card-back { background: #999!important; }

.checkout2steps #wait { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8); text-align:center; z-index:999; }
.checkout2steps #wait p { color:#FFF; position: relative; float: left; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size:18px; font-weight: bold; padding: 0px 50px; }

.checkout2steps .shd1, .checkout2steps .shd2 { padding: 0 15px; display:none; }
.checkout2steps .shd1 p, .checkout2steps .shd2 p { background:#FF0; text-align: center; border:2px dashed #F00; padding: 5px 0; margin-bottom:0; }

@media (max-width: 720px) {
.checkout2steps .main, .checkout2steps .sidebar { width: 100%; float: none; }
.checkout2steps .sidebar { margin-top: 45px; text-align: center; }
.checkout2steps .details { padding: 10px; }
.checkout2steps .sidebar.nobar { display: none; } 
}

@media (max-width: 520px) {
.checkout2steps .step1, .checkout2steps .step2 { padding:0 25px; }
.checkout2steps .details, .checkout2steps .details .info { display:block; }
.checkout2steps .details img { float: left; margin-right: 12px; }
.checkout2steps .details h1 { font-size: 16px; margin-top:7px; }
.checkout2steps .details p.isdigital { clear: both; padding-top: 5px; text-align:center; }
.checkout2steps .step2 .goback { right: 3px; }
}

@media (max-width: 470px) {
body.checkout2steps { padding:0; }
.checkout2steps .container { border: none; }
.checkout2steps .sidebar img { width:100%; }
.checkout2steps .step2 { padding:0; width:95%; }
.checkout2steps .step2 h2 span { display:none; }
}

@media (max-width: 440px) {
.checkout2steps .form-group.input-telefone, .checkout2steps .form-group.input-cep { width: 100%; float: none!important; }
}

@media (max-width: 359px) {
.checkout2steps .details p.isdigital { font-size:11px; }
.checkout2steps .form-group input::placeholder { font-size: 14px; }
}

.fa,.fab,.fal,.far,.fas{
    -moz-osx-font-smoothing:grayscale;
    -webkit-font-smoothing:antialiased;
    display:inline-block;
    font-style:normal;
    font-variant:normal;
    text-rendering:auto;
    line-height:1;
    pointer-events: none;
}
.fa-calendar-alt:before{content:"\f073"}
.fa-check:before{content:"\f00c"}
.fa-check-circle:before{content:"\f058"}
.fa-user-check:before{content:"\f4fc"}
.fa-check-square:before{content:"\f2f7"}
.fa-user:before{content:"\f007"}
.fa-envelope:before{content:"\f0e0"}
.fa-whatsapp:before{content:"\f232"}
.fa-map-marked-alt:before{content:"\f5a0"}
.fa-lock:before{content:"\f023"}
.fa-barcode:before{content:"\f02a"}
.fa-credit-card:before{content:"\f09d"}
.fa-id-card:before{content:"\f2c2"}
.fa-info-circle:before{content:"\f05a"}
@font-face{
    font-family:"Font Awesome 5 Brands";
    font-style:normal;
    font-weight:normal;
    font-display: swap;
    src:url(webfonts/fa-brands-400.eot);
    src:url(webfonts/fa-brands-400.eot?#iefix) format("embedded-opentype"),url(webfonts/fa-brands-400.woff2) format("woff2"),url(webfonts/fa-brands-400.woff) format("woff"),url(webfonts/fa-brands-400.ttf) format("truetype"),url(webfonts/fa-brands-400.svg#fontawesome) format("svg")
}
.fab{
    font-family:"Font Awesome 5 Brands"
}
@font-face{
    font-family:"Font Awesome 5 Free";
    font-style:normal;
    font-weight:400;
    font-display: swap;
    src:url(webfonts/fa-regular-400.eot);
    src:url(webfonts/fa-regular-400.eot?#iefix) format("embedded-opentype"),url(webfonts/fa-regular-400.woff2) format("woff2"),url(webfonts/fa-regular-400.woff) format("woff"),url(webfonts/fa-regular-400.ttf) format("truetype"),url(webfonts/fa-regular-400.svg#fontawesome) format("svg")
}
.far{
    font-weight:400
}
@font-face{
    font-family:"Font Awesome 5 Free";
    font-style:normal;
    font-weight:900;
    font-display: swap;
    src:url(webfonts/fa-solid-900.eot);
    src:url(webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"),url(webfonts/fa-solid-900.woff2) format("woff2"),url(webfonts/fa-solid-900.woff) format("woff"),url(webfonts/fa-solid-900.ttf) format("truetype"),url(webfonts/fa-solid-900.svg#fontawesome) format("svg")
}
.fa,.far,.fas{
    font-family:"Font Awesome 5 Free"
}
.fa,.fas{
    font-weight:900
}

.ccpreview .form-container .field-container:first-of-type {
    grid-area: name;
}

.ccpreview .form-container .field-container:nth-of-type(2) {
    grid-area: number;
}

.ccpreview .form-container .field-container:nth-of-type(3) {
    grid-area: expiration;
}

.ccpreview .form-container .field-container:nth-of-type(4) {
    grid-area: security;
}

.ccpreview .field-container input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.ccpreview .field-container {
    position: relative;
}

.ccpreview .form-container {
    display: grid;
    grid-column-gap: 10px;
    grid-template-columns: auto auto;
    grid-template-rows: 90px 90px 90px;
    grid-template-areas: "name name""number number""expiration security";
    max-width: 400px;
    padding: 20px;
    color: #707070;
}

.ccpreview label {
    padding-bottom: 5px;
    font-size: 13px;
}

.ccpreview input {
    margin-top: 3px;
    padding: 15px;
    font-size: 16px;
    width: 100%;
    border-radius: 3px;
    border: 1px solid #dcdcdc;
}

.ccpreview .ccicon {
    height: 28px;
    position: absolute;
    right: 3px;
    top: calc(50% - 21px);
    width: 60px;
}

/* CREDIT CARD IMAGE STYLING */
.ccpreview .preload * {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
}

.ccpreview .cccontainer {
    width: 100%;
    max-width: 300px;
    max-height: 190px;
    height: 54vw;
    margin: 3px auto 15px;
}

.ccpreview #ccsingle {
    position: absolute;
    right: 15px;
    top: 20px;
}

.ccpreview #ccsingle svg {
    width: 100px;
    max-height: 60px;
}

.ccpreview .creditcard svg#cardfront,
.ccpreview .creditcard svg#cardback {
    width: 100%;
    -webkit-box-shadow: 1px 2px 3px 0px #00000080;
    box-shadow: 1px 2px 3px 0px #00000080;
    border-radius: 22px;
}

.ccpreview #generatecard{
    cursor: pointer;
    float: right;
    font-size: 12px;
    color: #fff;
    padding: 2px 4px;
    background-color: #909090;
    border-radius: 4px;
    cursor: pointer;
    float:right;
}

/* CHANGEABLE CARD ELEMENTS */
.ccpreview .creditcard .lightcolor,
.ccpreview .creditcard .darkcolor {
    -webkit-transition: fill .5s;
    transition: fill .5s;
}

.ccpreview .creditcard .lgrey {
    fill: #999;
}

.ccpreview .creditcard .lgreydark {
    fill: #555;
}

.ccpreview .creditcard .grey {
    fill: #006a7b;
}

.ccpreview .creditcard .greydark {
    fill: #00404a;
}

/* FRONT OF CARD */
.ccpreview .ccpreview #svgname {
    text-transform: uppercase;
}

.ccpreview #cardfront .st2 {
    fill: #FFFFFF;
}

.ccpreview #cardfront .st3 {
    font-family: 'Source Code Pro', monospace;
    font-weight: 600;
}

.ccpreview #cardfront .st4 {
    font-size: 54.7817px;
}

.ccpreview #cardfront .st5 {
    font-family: 'Source Code Pro', monospace;
    font-weight: 400;
}

.ccpreview #cardfront .st6 {
    font-size: 33.1112px;
}

.ccpreview #cardfront .st7 {
    opacity: 0.6;
    fill: #FFFFFF;
}

.ccpreview #cardfront .st8 {
    font-size: 24px;
}

.ccpreview #cardfront .st9 {
    font-size: 36.5498px;
}

.ccpreview #cardfront .st10 {
    font-family: 'Source Code Pro', monospace;
    font-weight: 300;
}

.ccpreview #cardfront .st11 {
    font-size: 16.1716px;
}

.ccpreview #cardfront .st12 {
    fill: #4C4C4C;
}

/* BACK OF CARD */
.ccpreview #cardback .st0 {
    fill: none;
    stroke: #0F0F0F;
    stroke-miterlimit: 10;
}

.ccpreview #cardback .st2 {
    fill: #111111;
}

.ccpreview #cardback .st3 {
    fill: #F2F2F2;
}

.ccpreview #cardback .st4 {
    fill: #D8D2DB;
}

.ccpreview #cardback .st5 {
    fill: #C4C4C4;
}

.ccpreview #cardback .st6 {
    font-family: 'Source Code Pro', monospace;
    font-weight: 400;
}

.ccpreview #cardback .st7 {
    font-size: 27px;
}

.ccpreview #cardback .st8 {
    opacity: 0.6;
}

.ccpreview #cardback .st9 {
    fill: #FFFFFF;
}

.ccpreview #cardback .st10 {
    font-size: 24px;
}

.ccpreview #cardback .st11 {
    fill: #EAEAEA;
}

.ccpreview #cardback .st12 {
    font-family: 'Rock Salt', cursive;
}

.ccpreview #cardback .st13 {
    font-size: 37.769px;
}

/* FLIP ANIMATION */
.ccpreview .cccontainer {
    perspective: 1000px;
}

.ccpreview .creditcard {
    width: 100%;
    max-width: 400px;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    transition: -webkit-transform 0.6s;
    -webkit-transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
    transition: transform 0.6s, -webkit-transform 0.6s;
-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
    cursor: arrow;
}

.ccpreview .creditcard .front,
.ccpreview .creditcard .back {
    position: absolute;
    width: 100%;
    max-width: 400px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
    color: #47525d;
}

.ccpreview .creditcard .back {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.ccpreview .creditcard.flipped {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.lobibox-notify-wrapper.top {
    left: 0;
    margin-right: 0;
    top: 0;
    z-index: 5000;
    position: fixed!important;
}

.lobibox-notify {
    min-height: 36px;
    border-color: #296ba0;
    background-color: #2E79B4;
    color: #FFF;
    position: relative;
    font-size: 14px;
    margin: 0;
    border-radius: 0;
    border: 1px solid transparent;
    -webkit-box-shadow: 2px 2px 5px #aaa;
    box-shadow: 2px 2px 5px #aaa;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s;
    font-family: 'Open Sans', Arial, Helvetica, sans-serif;
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}
.animated-fast {
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    animation-fill-mode: both;
}
.animated, .animated-fast {
    -webkit-animation-fill-mode: both;
}

.lobibox-notify .lobibox-notify-icon-wrapper {
    left: 12px;
    width: 32px;
    position: absolute;
    height: 100%;
}

.lobibox-notify .verified { font-size: 12px; color:#64de47; font-weight:bold; display:block; }

.lobibox-notify .lobibox-notify-icon {
    display: table;
    width: 100%;
    height: 100%;
}

.lobibox-notify .lobibox-notify-icon>div {
    display: table-cell;
    vertical-align: middle;
}

.lobibox-notify .lobibox-notify-icon>div .icon-el {
    font-size: 25px;
    text-align: center;
}

.lobibox-notify .lobibox-notify-body {
    margin: 15px 30px 20px 56px;
}

.lobibox-notify .lobibox-notify-msg {
    line-height: 16px;
}

.lobibox-notify .lobibox-close {
    position: absolute;
    text-align: center;
    border-radius: 50%;
    right: 10px;
    top: 10px;
    font-size: 20px;
    line-height: 19px;
    width: 19px;
    height: 19px;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s;
}

.lobibox-notify .lobibox-delay-indicator {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
}

.lobibox-notify .lobibox-delay-indicator>div {
    position: relative;
    height: 100%;
    width: 0;
    background-color: #e8e8e8;
}

.lobibox-notify:hover {
    cursor: pointer;
    -webkit-box-shadow: 3px 3px 10px #aaa;
    box-shadow: 3px 3px 10px #aaa;
}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

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

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

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

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

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

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

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

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

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