body {
    font-family: Poppins, sans-serif
}

.icon-gos {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-gos.png) no-repeat 20px;
    background-size: 50px
}

.icon-quart {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-quart.png?v=3) no-repeat 20px;
    background-size: 50px
}

.icon-brl {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-brl.png) no-repeat 20px;
    background-size: 50px
}

.icon-eur {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-eur.png) no-repeat 20px;
    background-size: 50px
}

.icon-gico {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url('../img/icon-gico2.png?v=2') no-repeat 20px;
    background-size: 50px
}

.icon-cop {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url('../img/icon-cop.png?v=2') no-repeat 20px;
    background-size: 50px
}

.icon-ven {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url('../img/icon-ven.png?v=2') no-repeat 20px;
    background-size: 50px
}

.icon-usd {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-usd.png) no-repeat 20px;
    background-size: 50px
}

.icon-uyu {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-uyu2.png) no-repeat 20px;
    background-size: 50px
}

.icon-mxn {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-mxn.png) no-repeat 20px;
    background-size: 50px
}

.icon-ars {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-ars.png) no-repeat 20px;
    background-size: 50px
}

.icon-usdt {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-usdt.png) no-repeat 20px;
    background-size: 50px
}

.icon-btc {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-btc.png) no-repeat 20px;
    background-size: 50px
}

.icon-eth {
    cursor: pointer;
    text-align: right;
    font-size: 2em;
    background: url(../img/icon-eth.png) no-repeat 20px;
    background-size: 50px
}

.scrollable {
    overflow-y: auto;
    height: 200px;
    position: relative
}

.bandeira {
    transition: transform .2s;
    cursor: pointer
}

.bandeira:hover {
    transform: scale(1.2)
}

.embreve {
    transition-duration: 1.2s
}

.embreve:hover {
    filter: grayscale(100%)
}

.fundo-principal {
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
    position: relative
}

.imagens-fundo .um {
    position: absolute;
    top: 10%;
    right: -10%;
    z-index: 1;
    -webkit-animation: trantani 6s ease-in-out infinite;
    animation: trantani 6s ease-in-out infinite
}

.imagens-fundo .dois {
    position: absolute;
    top: 21%;
    left: -5%;
    z-index: 1;
    -webkit-animation: upornis 6s ease-in-out infinite;
    animation: upornis 6s ease-in-out infinite;
    max-width: 40%
}

.imagens-fundo .tres {
    padding-top: 233px;
    position: absolute;
    left: -5%;
    bottom: 0;
    z-index: 1
}

@media (max-width:1199px) {
    h1 {
        font-size: 49px
    }
}

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

    50% {
        -webkit-transform: scale(2);
        transform: scale(2)
    }

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

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

    50% {
        -webkit-transform: scale(2);
        transform: scale(2)
    }

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

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

    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

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

    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes upornis {
    0% {
        -webkit-transform: translateY(-40px);
        transform: translateY(-40px)
    }

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

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

@keyframes upornis {
    0% {
        -webkit-transform: translateY(-40px);
        transform: translateY(-40px)
    }

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

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

@keyframes jump2 {
    0%, 20%, 50%, 80%, 100% {
      transform: translateY(0);
    }
    40% {
      transform: translateY(-5px);
    }
    60% {
      transform: translateY(-2px);
    }
  }
  

@keyframes jump {
    0%, 20%, 50%, 80%, 100% {
      transform: translateY(0);
    }
    40% {
      transform: translateY(-30px);
    }
    60% {
      transform: translateY(-15px);
    }
  }
  
@-webkit-keyframes trantani {
    0% {
        -webkit-transform: translateX(-30px);
        transform: translateX(-30px)
    }

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

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

@keyframes trantani {
    0% {
        -webkit-transform: translateX(-30px);
        transform: translateX(-30px)
    }

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

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

.efeito3D {
    transform: translate(50%, -50%);
    text-transform: uppercase;
    color: #ffc107;
    text-shadow: 1px 1px 1px #919191, 1px 2px 1px #919191, 1px 3px 1px #919191, 1px 4px 1px #919191, 1px 5px 1px #919191, 1px 6px 1px #919191, 1px 7px 1px #919191, 1px 8px 1px #919191, 1px 9px 1px #919191, 1px 10px 1px #919191, 1px 18px 6px rgba(16, 16, 16, .4), 1px 22px 10px rgba(16, 16, 16, .2), 1px 25px 35px rgba(16, 16, 16, .2), 1px 30px 60px rgba(16, 16, 16, .4)
}

.golden-btn {
    display: inline-block;
    outline: 0;
    font-family: inherit;
    font-size: 1em;
    box-sizing: border-box;
    border: none;
    border-radius: .3em;
    line-height: 2.5em;
    text-transform: uppercase;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16), 0 3px 6px rgba(110, 80, 20, .4), inset 0 -2px 5px 1px rgba(139, 66, 8, 1), inset 0 -1px 1px 3px rgba(250, 227, 133, 1);
    background-image: linear-gradient(160deg, #a54e07, #b47e11, #fef1a2, #bc881b, #a54e07);
    border: 1px solid #a55d07;
    color: #783205;
    text-shadow: 0 2px 2px rgba(250, 227, 133, 1);
    cursor: pointer;
    transition: all .2s ease-in-out;
    background-size: 100% 100%;
    background-position: center
}

.golden-btn:focus,
.golden-btn:hover {
    background-size: 150% 150%;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23), inset 0 -2px 5px 1px #b17d10, inset 0 -1px 1px 3px rgba(250, 227, 133, 1);
    border: 1px solid rgba(165, 93, 7, .6);
    color: rgba(120, 50, 5, .8)
}

.golden-btn:active {
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16), 0 3px 6px rgba(110, 80, 20, .4), inset 0 -2px 5px 1px #b17d10, inset 0 -1px 1px 3px rgba(250, 227, 133, 1)
}

.efeito-btn-comprar {
    transition: transform 0.3s ease-in-out;
}

.efeito-btn-comprar:hover {
    transform: translateY(-3px);
}
