.Nav-Bar {
    background-color:#fff;
    display:flex;
    height:90px;
    justify-content:center;
    position:absolute;
    width:100%
}
.nav-bar-items {
    align-content:center;
    align-items:center;
    display:flex;
    text-align:center;
    max-width:1480px;
    width:90%
}
.nav-bar-items-kits {
    display:flex;
    justify-content:space-around;
    width:25%
}
.nav-text {
    color:#312783;
    cursor:pointer;
    font-family:Spinner;
    font-size:25px;
    padding-left:10%;
    padding-right:10%;
    text-align:center;
    white-space:nowrap;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content
}
.nav-text:before {
    background:#009fe3;
    content:"";
    inset:0;
    position:absolute;
    transform:scaleX(0);
    transform-origin:right;
    transition:transform .2s ease-in-out;
    z-index:-1
}
.nav-text:hover:before {
    transform:scaleX(1.2);
    transform-origin:left
}
.Nav-Logo-Styles {
    height:150px;
    margin-top:5%
}
.nav-logo-styles-solo {
    align-items:center;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    width:30%
}
@keyframes pulse {
    0% {
        transform:scale(.9)
    }
    70% {
        box-shadow:0 0 0 30px #4fffed00;
        transform:scale(1)
    }
    to {
        box-shadow:0 0 0 0 #4fffed00;
        transform:scale(.9)
    }
}
.fill:focus,.fill:hover {
    box-shadow:inset 0 0 0 2em var(--hover)
}
.pulse:focus,.pulse:hover {
    animation:pulse 1s;
    box-shadow:0 0 0 2em #0000
}
@keyframes pulse2 {
    0% {
        box-shadow:0 0 0 0 var(--hover)
    }
}
.close:focus,.close:hover {
    box-shadow:inset -3.5em 0 0 0 var(--hover),inset 3.5em 0 0 0 var(--hover)
}
.raise:focus,.raise:hover {
    box-shadow:0 .5em .5em -.4em var(--hover);
    transform:translateY(-.25em)
}
.up:focus,.up:hover {
    box-shadow:inset 0 -3.25em 0 0 var(--hover)
}
.slide:focus,.slide:hover {
    box-shadow:inset 6.5em 0 0 0 var(--hover)
}
.offset {
    box-shadow:.3em .3em 0 0 var(--color),inset .3em .3em 0 0 var(--color)
}
.offset:focus,.offset:hover {
    box-shadow:0 0 0 0 var(--hover),inset 6em 3.5em 0 0 var(--hover)
}
.slide {
    --color:#008cba;
    --hover:#0001ba
}
button {
    color:var(--color);
    transition:.25s
}
button:focus,button:hover {
    border-color:var(--hover);
    color:#fff
}
button {
    background:none;
    border:2px solid;
    font:inherit;
    line-height:1;
    margin:.5em;
    padding:1em 2em
}
h1 {
    font-weight:400
}
code {
    color:#e4cb58;
    font:inherit
}
body {
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    background:#151616;
    font-family:roboto;
    margin:0
}
code {
    font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace
}
:root {
    --bg:#242526;
    --bg-accent:#484a4d;
    --text-color:#dadce1;
    --nav-size:60px;
    --border:1px solid #474a4d;
    --border-radius:8px;
    --speed:500ms
}
ul {
    list-style:none;
    margin:0;
    padding:0
}
a {
    color:#dadce1;
    color:var(--text-color);
    text-decoration:none
}
.navbar-nav {
    display:flex;
    height:100%;
    justify-content:flex-end;
    max-width:100%
}
.nav-item {
    width:48px;
    width:calc(var(--nav-size)*.8)
}
.icon-button,.nav-item {
    align-items:center;
    display:flex;
    justify-content:center
}
.icon-button {
    --button-size:calc(var(--nav-size)*0.5);
    background-color:#484a4d;
    border-radius:50%;
    height:var(--button-size);
    margin:2px;
    padding:5px;
    transition:filter .3s;
    width:var(--button-size)
}
.icon-button:hover {
    filter:brightness(1.2)
}
.icon-button svg {
    fill:#dadce1;
    fill:var(--text-color);
    height:20px;
    width:20px
}
.landing {
    justify-content:flex;
    width:100%
}
.header-bg {
    background-color:#00a0e6;
    background-repeat:no-repeat;
    background-size:100%;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:10% 5%
}
.header-bg>div>div+div {
    width: 55% !important;
    margin-top: 30px;
}
.header-bg>div>div {
    display: block !important;
    width: 45% !important;
}
.header-personagens,.header-title {
    background-color:#fff
}
button {
    background-color:#e24e0f;
    border:1px solid #e24e0f;
    border-radius:50px;
    cursor:pointer;
    padding:10px 10%
}
.button-comprar-kits-texto {
    color:#fff;
    font-family:fredoka;
    font-size:20px;
    text-align:center;
    white-space:nowrap;
    animation:pulse 1.5s infinite;
    background-color:#ff0478;
    border-radius:50px;
    box-shadow:0 0 0 0 #4fffede6;
    cursor:pointer;
    padding:10px 25px;
    height:auto;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content
}
.kits-titulo {
    margin-top:3%
}
.kits-grupo-personagens {
    justify-content:space-evenly;
    margin-bottom:8%;
    width:100%
}
*,:after,:before {
    box-sizing:border-box;
    margin:0 auto;
    padding:0
}
.cell {
    height:100%;
    width:100%;
    z-index:2
}
.cell:nth-child(15n+1):hover~.content {
    --positionX:0
}
.cell:nth-child(n+1):nth-child(-n+15):hover~.content {
    --positionY:0
}
.cell:nth-child(15n+2):hover~.content {
    --positionX:1
}
.cell:nth-child(n+16):nth-child(-n+30):hover~.content {
    --positionY:1
}
.cell:nth-child(15n+3):hover~.content {
    --positionX:2
}
.cell:nth-child(n+31):nth-child(-n+45):hover~.content {
    --positionY:2
}
.cell:nth-child(15n+4):hover~.content {
    --positionX:3
}
.cell:nth-child(n+46):nth-child(-n+60):hover~.content {
    --positionY:3
}
.cell:nth-child(15n+5):hover~.content {
    --positionX:4
}
.cell:nth-child(n+61):nth-child(-n+75):hover~.content {
    --positionY:4
}
.cell:nth-child(15n+6):hover~.content {
    --positionX:5
}
.cell:nth-child(n+76):nth-child(-n+90):hover~.content {
    --positionY:5
}
.cell:nth-child(15n+7):hover~.content {
    --positionX:6
}
.cell:nth-child(n+91):nth-child(-n+105):hover~.content {
    --positionY:6
}
.cell:nth-child(15n+8):hover~.content {
    --positionX:7
}
.cell:nth-child(n+106):nth-child(-n+120):hover~.content {
    --positionY:7
}
.cell:nth-child(15n+9):hover~.content {
    --positionX:8
}
.cell:nth-child(n+121):nth-child(-n+135):hover~.content {
    --positionY:8
}
.cell:nth-child(15n+10):hover~.content {
    --positionX:9
}
.cell:nth-child(n+136):nth-child(-n+150):hover~.content {
    --positionY:9
}
.cell:nth-child(15n+11):hover~.content {
    --positionX:10
}
.cell:nth-child(n+151):nth-child(-n+165):hover~.content {
    --positionY:10
}
.cell:nth-child(15n+12):hover~.content {
    --positionX:11
}
.cell:nth-child(n+166):nth-child(-n+180):hover~.content {
    --positionY:11
}
.cell:nth-child(15n+13):hover~.content {
    --positionX:12
}
.cell:nth-child(n+181):nth-child(-n+195):hover~.content {
    --positionY:12
}
.cell:nth-child(15n+14):hover~.content {
    --positionX:13
}
.cell:nth-child(n+196):nth-child(-n+210):hover~.content {
    --positionY:13
}
.cell:nth-child(15n+15):hover~.content {
    --positionX:14
}
.cell:nth-child(n+211):nth-child(-n+225):hover~.content {
    --positionY:14
}
.content {
    --positionX:7;
    --positionY:7;
    align-items:center;
    bottom:0;
    display:flex;
    justify-content:center;
    left:0;
    right:0;
    top:0
}
.content,.css {
    position:absolute
}
.css {
    animation:color 3s linear infinite;
    font-family:Fredoka One,cursive;
    left:50%;
    text-shadow:0 0 10px rgba(0,0,0,.667);
    top:50%;
    transition:all .5s
}
.css:first-child {
    animation-delay:0s;
    font-size:100px;
    opacity:.1;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*21px)) translateY(calc(-50% - (var(--positionY) - 7)*21px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(2) {
    animation-delay:-.3s;
    font-size:110px;
    opacity:.2;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*18px)) translateY(calc(-50% - (var(--positionY) - 7)*18px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(3) {
    animation-delay:-.6s;
    font-size:120px;
    opacity:.3;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*15px)) translateY(calc(-50% - (var(--positionY) - 7)*15px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(4) {
    animation-delay:-.9s;
    font-size:130px;
    opacity:.4;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*12px)) translateY(calc(-50% - (var(--positionY) - 7)*12px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(5) {
    animation-delay:-1.2s;
    font-size:140px;
    opacity:.5;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*9px)) translateY(calc(-50% - (var(--positionY) - 7)*9px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(6) {
    animation-delay:-1.5s;
    font-size:150px;
    opacity:.6;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*6px)) translateY(calc(-50% - (var(--positionY) - 7)*6px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(7) {
    animation-delay:-1.8s;
    font-size:160px;
    opacity:.7;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*3px)) translateY(calc(-50% - (var(--positionY) - 7)*3px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(8) {
    animation-delay:-2.1s;
    font-size:170px;
    opacity:.8;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*0px)) translateY(calc(-50% - (var(--positionY) - 7)*0px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(9) {
    animation-delay:-2.4s;
    font-size:180px;
    opacity:.9;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*-3px)) translateY(calc(-50% - (var(--positionY) - 7)*-3px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
.css:nth-child(10) {
    animation-delay:-2.7s;
    font-size:190px;
    opacity:1;
    transform:translateX(calc(-50% - (var(--positionX) - 7)*-6px)) translateY(calc(-50% - (var(--positionY) - 7)*-6px)) rotateX(calc(0deg - (var(--positionY) - 7)*5deg)) rotateY(calc((var(--positionX) - 7)*5deg))
}
@keyframes color {
    0% {
        color:#ef8f8f
    }
    10% {
        color:#efc98f
    }
    20% {
        color:#dcef8f
    }
    30% {
        color:#a3ef8f
    }
    40% {
        color:#8fefb6
    }
    50% {
        color:#8fefef
    }
    60% {
        color:#8fb6ef
    }
    70% {
        color:#a38fef
    }
    80% {
        color:#dc8fef
    }
    90% {
        color:#ef8fc9
    }
    to {
        color:#ef8f8f
    }
}
.video-background {
    object-fit:cover;
    position:fixed;
    z-index:-1
}
.kits-robo-grupo,.video-background {
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    width:100%
}
.kits-robo-grupo {
    align-content:center;
    align-items:center;
    background-color:linear-gradient(90deg,green 0,green 80%,red 0,red);
    background-repeat:no-repeat;
    background-size:100%;
    display:flex;
    flex-direction:column;
    margin-top:-10%;
    padding-bottom:3%;
    padding-top:5%
}
.kits-titulo {
    margin-bottom:10%;
    margin-top:10%;
    width:500px
}
.kits-grupo-personagens {
    align-items:center;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    width:80%
}
.info {
    background-image: url(../img/BackgroundColor_v03.webp);
    background-size: cover;
    background-position: center;
    display:block;
    padding-bottom: 5%;
    margin-bottom: -25px;
    z-index: 1;
    width:100%
}
.info-botao-grupo {
    display:flex;
    justify-content:flex-end;
    width:95%
}
.info-carousel-monica,.info-carousel-milena,.info-carousel-cebolinha,.info-cebolinha,.info-milena,.info-monica {
    display:block;
    width:100%
}
.info-carousel-monica {
    background-color: #ff0478;
    background-image: url(../img/BackgroundoColor.webp);
    padding-top: 5%;
    margin-top: -2%;
    background-size: contain;
    background-position: center;
}
.info-carousel-milena {
    background-color: #ff0478;
    background-image: url(../img/BackgroundoColor.webp);
    padding-top: 5%;
    margin-top: -2%;
    background-size: contain;
    background-position: center;
}
.info-carousel-cebolinha {
    background-color: #ff0478;
    background-image: url(../img/BackgroundoColor.webp);
    padding-top: 5%;
    margin-top: -2%;
    background-size: contain;
    background-position: center;
}
.botao-esonder-sobre {
    background-color:#fff;
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    color:#1d1d1b;
    font-size:40px;
    padding-left:30px;
    padding-top: 8px;
    padding-bottom: 9px;
    padding-right:30px
}
.botao-esonder-sobre,.botao-esonder-sobre:hover {
    font-family:bitcrusher;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content
}
.botao-esonder-sobre:hover {
    background-color:#1d1d1b;
    border:1px solid #1d1d1b;
    box-shadow:-15px 15px 0 #fff;
    color:#fff;
    font-size:52px
}
.botao-mostrar-projetos-monica {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    font-size:40px;
    max-width: 385px;
    width:40%
}
.botao-mostrar-projetos-monica,.botao-mostrar-projetos-monica:hover {
    background-color:#44c4f1;
    color:#1d1d1b;
    font-family:bitcrusher;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content
}
.botao-mostrar-projetos-monica:hover {
    border:1px solid #1d1d1b;
    box-shadow:-10px 10px 0 #1d1d1b;
    font-size:52px;
    width:42%
}
.botao-mostrar-projetos-cebolinha,.botao-mostrar-projetos-cebolinha:hover {
    background-color:#009040
}
.monica-grupo {
    display: flex;
    flex-direction: row;
    padding-top: 5%;
    width: 95%;
}
.monica-grupo-texto {
    padding-left:5%;
    width:80%
}
.monica-grupo-texto,.personagem-sobre {
    display:flex;
    flex-direction:column
}
.monica-grupo-texto div:nth-child(2) {
    margin-bottom: 2% !important;
}
.monica-grupo-texto img {
    max-width: 640px;
}
.monica-texto p {
    font-family: Fredoka;
    margin-bottom: 15px;
    font-size: 1.2em;
    text-align: justify;
    line-height: 1.2;
}
.monica-texto {
    width:100%
}
.monica-coelho {
    display:flex;
    width:100%
}
.monica-botao {
    cursor:pointer;
    display:flex;
    justify-self:flex-end;
    margin-left:auto
}
.monica-grupo-botao {
    align-self:flex-end;
    display:flex
}
.botao-mostrar-projetos {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    font-size: 40px;
    max-width: 385px;
    width: 40%;
}
.botao-mostrar-projetos,.botao-mostrar-projetos:hover {
    background-color:#44c4f1;
    color:#1d1d1b;
    font-family:bitcrusher;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content
}
.botao-mostrar-projetos:hover {
    border:1px solid #1d1d1b;
    box-shadow:-21px 21px 0 #1d1d1b;
    font-size: 40px;
    max-width: 385px;
    width: 40%;
}
.botao-mostrar-projetos-milena {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    font-size: 40px;
    max-width: 385px;
    width: 40%;
}
.botao-mostrar-projetos-milena,.botao-mostrar-projetos-milena:hover {
    background-color:#f1449a;
    color:#1d1d1b;
    font-family:bitcrusher;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content
}
.botao-mostrar-projetos-milena:hover {
    border:1px solid #1d1d1b;
    box-shadow:-21px 21px 0 #1d1d1b;
    font-size: 40px;
    max-width: 385px;
    width: 40%;
}
.botao-mostrar-projetos-cebolinha {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    font-size: 40px;
    max-width: 385px;
    width: 40%;
}
.botao-mostrar-projetos-cebolinha,.botao-mostrar-projetos-cebolinha:hover {
    background-color:#44f19d;
    color:#1d1d1b;
    font-family:bitcrusher;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content
}
.botao-mostrar-projetos-cebolinha:hover {
    border:1px solid #1d1d1b;
    box-shadow:-21px 21px 0 #1d1d1b;
    font-size: 40px;
    max-width: 385px;
    width: 40%;
}
.kits-monica-grupo {
    display:flex;
    justify-content:center;
    position:relative;
    width:40%
}
.kits-monica-item-bg {
    cursor:pointer;
    display:flex;
    position:relative;
    z-index:1
}
.kits-monica-item-bg img {
    max-width: 425px;
}
.kits-monica-item-titulo {
    cursor:pointer;
    display:flex;
    position:absolute;
    z-index:3
}
.kits-monica-item-titulo img {
    max-width: 510px;
}
.kits-monica-item-personagem {
    cursor:pointer;
    display:flex;
    position:absolute;
    z-index:6
}
.kits-milena-grupo {
    display:flex;
    justify-content:center;
    position:relative
}
.kits-milena-item-bg {
    cursor:pointer;
    display:flex;
    position:relative;
    z-index:1
}
.kits-milena-item-bg img {
    max-width: 400px;
}
.kits-milena-item-titulo {
    cursor:pointer;
    display:flex;
    position:absolute;
    z-index:7
}
.kits-milena-item-titulo img {
    max-width: 365px;
}
.kits-milena-item-personagem {
    cursor:pointer;
    display:flex;
    position:absolute;
    z-index:1
}
.kits-cebolinha-grupo {
    display:flex;
    height:40%;
    justify-content:center;
    position:relative;
    width:40%
}
.kits-cebolinha-item-bg {
    cursor:pointer;
    display:flex;
    position:relative;
    z-index:1
}
.kits-cebolinha-item-bg img {
    max-width: 440px;
}
.kits-cebolinha-item-titulo {
    cursor:pointer;
    display:flex;
    position:absolute;
    margin-left: -75px;
    z-index:1
}
.kits-cebolinha-item-titulo img {
    max-width: 395px;
}
.kits-cebolinha-item-personagem {
    cursor:pointer;
    display:flex;
    position:absolute;
    z-index:6
}
.kits-cebolinha-item-personagem img {
    margin-left: 335px;
}
.footer-styles {
    align-items:center;
    background-color:#0bbbef;
    background-repeat:no-repeat;
    background-size:100%;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    width:100%
}
.redes-grupo {
    display:flex;
    flex-direction:row;
    width:100%
}
.redes-grupo-box {
    background-color:#ffcb00;
    border-radius:25px;
    box-shadow:-6px 9px 0 #1d1d1b;
    display:flex;
    flex-direction:column;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    margin-left:5%;
    padding:2% 3%;
    width:60%
}
.redes-icons {
    align-content:center;
    align-items:center;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    margin-top:16px;
    width:100%
}
.redes-icons-solo {
    cursor:pointer;
    width:50%
}
.novidades,.redes-icons-solo {
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content
}
.novidades {
    background-color:#fff;
    border-radius:25px;
    box-shadow:-6px 9px 0 #1d1d1b;
    display:flex;
    flex-direction:column;
    font-family:Trebuchet MS,Lucida Sans Unicode,Lucida Grande,Lucida Sans,Arial,sans-serif;
    font-size:24px;
    margin-right:5%;
    padding:1% 3% 0.3%;
    width:60%
}
.novidades a {
    display: block;
    padding-left: 5%;
    margin-bottom: 5px;
    width: 90%;
    font-size: 0.7em;
}
.MuiInputBase-root.MuiOutlinedInput-root.MuiInputBase-colorPrimary.MuiInputBase-formControl.MuiInputBase-adornedStart {
    width: 100%;
}
input[type=checkbox] {
    transform:scale(2);
    float: left;
    margin-top: 10px;
}
.mais-infos {
    display:flex;
    flex-direction:column;
    padding-bottom:150px;
    margin-top:5%;
    width:45%
}
.logo-monica-footer {
    display:flex;
    margin-left:30px;
    margin-right:30px;
    margin-top:3%
}
.logo-negativo {
    padding-Right:20%;
    display:flex;
    margin-bottom:3%;
    padding-left:20%;
    max-width: 480px;
    padding: 0;
    width:100%
}
.botao-cadastrar {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b
}
.botao-cadastrar,.botao-cadastrar:hover {
    background-color:#3aaa35;
    font-family:spinner;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    width:100%
}
.botao-cadastrar:hover {
    border:1px solid #1d1d1b;
    box-shadow:-21px 21px 0 #1d1d1b
}
button.botao-cadastrar div {
    margin-bottom: 0 !important;
}
.mais-infos-texto {
    color:#fff;
    font-display:flex;
    font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;
    font-size: 18px;
    letter-spacing: 1;
    text-align:center
}
.mini-bloco-grupo {
    background-color:#0bbbef;
    flex-direction:column;
    justify-content:center;
    padding-top: 40px;
    margin-top:-5%
}
.mini-bloco-grupo,.mini-bloco-top {
    align-items:center;
    display:flex;
    width:100%
}
.mini-bloco-top {
    align-content:center;
    flex-direction:row;
    justify-content:space-between
}
.mini-bloco-grupo-personagens {
    display:flex;
    justify-content:space-between;
    width:100%
}
.mini-bloco-titulo {
    height:200px;
    margin-bottom:10%;
    margin-top:30%
}
.mini-bloco-grupo-personagem {
    height:540px
}
.mini-bloco-personagens {
    cursor:pointer;
    display:flex;
    flex-direction:row;
    justify-content:center;
    width:80%
}
.mini-bloco-nuvem {
    display:flex;
    width:100%
}
.mini-bloco-monica {
    display:flex
}
.mini-bloco-monica:before {
    background:#ff3240;
    border-radius:10%;
    content:"";
    height:76%;
    left:0;
    position:absolute;
    top:120px;
    transform:scale(.9);
    transition:.4s;
    width:100%;
    z-index:-1
}
.mini-bloco-monica:hover:before {
    transform:scale(1.2)
}
.mini-bloco-monica:hover {
    color:#ff3240;
    text-shadow:0 0 5px #ff3240
}
.mini-bloco-milena {
    cursor:pointer
}
.mini-bloco-milena:before {
    background:#ffdc52;
    border-radius:10%;
    content:"";
    height:76%;
    left:40px;
    position:absolute;
    top:120px;
    transform:scale(.9);
    transition:.4s;
    width:84%;
    z-index:-1
}
.mini-bloco-milena:hover:before {
    transform:scale(1.2)
}
.mini-bloco-milena:hover {
    color:#ffdc52;
    text-shadow:0 0 5px #ffdc52
}
.mini-bloco-cebolinha {
    cursor:pointer
}
.mini-bloco-cebolinha:before {
    background:#fff;
    border-radius:10%;
    content:"";
    height:70%;
    left:0;
    position:absolute;
    top:155px;
    transform:scale(.9);
    transition:.4s;
    width:100%;
    z-index:-1
}
.mini-bloco-cebolinha:hover:before {
    transform:scale(1.2)
}
.mini-bloco-cebolinha:hover {
    color:#fff;
    text-shadow:0 0 5px #fff
}
.download-button-monica {
    border-radius:100%;
    position:absolute;
    z-index:0;
    button {
        background:#000;
        border:none;
        border-radius:100%;
        box-shadow:0 0 0 -.25rem #000;
        color:#fff;
        cursor:pointer;
        position:absolute
    }
}
.download-button-milena {
    border-radius:100%;
    position:absolute;
    z-index:0;
    button {
        background:#000;
        border:none;
        border-radius:100%;
        box-shadow:0 0 0 -.25rem #000;
        color:#fff;
        cursor:pointer;
        position:absolute
    }
}
.download-button-cebolinha {
    border-radius:100%;
    position:absolute;
    z-index:0;
    button {
        background:#000;
        border:none;
        border-radius:100%;
        box-shadow:0 0 0 -.25rem #000;
        color:#fff;
        cursor:pointer;
        position:absolute
    }
}
.alice-carousel .animated {
    animation-fill-mode:both
}
.alice-carousel .animated-out {
    z-index:1
}
.alice-carousel .fadeOut {
    animation-name:fadeOut
}
@keyframes fadeOut {
    0% {
        opacity:1
    }
    to {
        opacity:0;
        visibility:hidden
    }
}
.alice-carousel {
    direction:ltr;
    margin:auto;
    position:relative;
    width:100%
}
.alice-carousel__wrapper {
    height:auto;
    overflow-x:hidden;
    overflow-y:hidden
}
.alice-carousel__stage,.alice-carousel__wrapper {
    box-sizing:border-box;
    position:relative;
    width:100%
}
.alice-carousel__stage {
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
    height:100%;
    margin:0;
    padding:0;
    transform-style:flat;
    -webkit-transform-style:flat;
    white-space:nowrap
}
.alice-carousel__stage-item {
    box-sizing:border-box;
    display:inline-block;
    height:100%;
    line-height:0;
    margin:0;
    padding:0;
    position:relative;
    vertical-align:top;
    white-space:normal;
    width:100%
}
.alice-carousel__stage-item * {
    line-height:normal
}
.alice-carousel__stage-item.__hidden {
    opacity:0;
    overflow:hidden
}
.alice-carousel__next-btn,.alice-carousel__prev-btn {
    box-sizing:border-box;
    display:inline-block;
    padding:10px 5px;
    width:50%
}
.alice-carousel__next-btn [data-area]:after,.alice-carousel__prev-btn [data-area]:after {
    content:attr(data-area);
    position:relative;
    text-transform:capitalize
}
.alice-carousel__prev-btn {
    text-align:right
}
.alice-carousel__next-btn-item,.alice-carousel__prev-btn-item {
    color:#465798;
    cursor:pointer;
    display:inline-block;
    margin:0;
    padding:5px
}
.alice-carousel__next-btn-item:hover,.alice-carousel__prev-btn-item:hover {
    color:darkred
}
.alice-carousel__next-btn-item.__inactive,.alice-carousel__prev-btn-item.__inactive {
    opacity:.4;
    pointer-events:none
}
.alice-carousel__play-btn {
    display:inline-block;
    left:20px;
    position:absolute;
    top:30px
}
.alice-carousel__play-btn:hover {
    cursor:pointer
}
.alice-carousel__play-btn-wrapper {
    background-color:#fff;
    border-radius:50%;
    height:32px;
    padding:10px;
    position:relative;
    width:32px
}
.alice-carousel__play-btn-item {
    background:#0000;
    border:0;
    cursor:pointer;
    height:32px;
    outline:none;
    position:absolute;
    width:32px
}
.alice-carousel__play-btn-item:after,.alice-carousel__play-btn-item:before {
    border-color:#0000 #0000 #0000 #465798;
    border-style:solid;
    border-width:8px 0 8px 15px;
    content:"";
    display:block;
    height:0;
    pointer-events:none;
    position:absolute;
    transition:all .4s linear;
    width:0
}
.alice-carousel__play-btn-item:before {
    height:14px;
    left:5px
}
.alice-carousel__play-btn-item:after {
    left:18px;
    top:7px
}
.alice-carousel__play-btn-item.__pause:after,.alice-carousel__play-btn-item.__pause:before {
    border-width:0 0 0 10px;
    height:30px
}
.alice-carousel__play-btn-item.__pause:after {
    left:18px;
    top:0
}
.alice-carousel__dots {
    list-style:none;
    margin:30px 3px 5px;
    padding:0;
    text-align:center
}
.alice-carousel__dots>li {
    display:inline-block
}
.alice-carousel__dots-item:not(.__custom) {
    background-color:#e0e4fb;
    border-radius:50%;
    cursor:pointer;
    height:8px;
    width:8px
}
.alice-carousel__dots-item:not(.__custom):not(:last-child) {
    margin-right:20px
}
.alice-carousel__dots-item:not(.__custom).__active,.alice-carousel__dots-item:not(.__custom):hover {
    background-color:#6e7ebc
}
.alice-carousel__slide-info {
    background-color:#e0e4fb99;
    border-radius:5px;
    color:#465798;
    display:inline-block;
    padding:5px 10px;
    position:absolute;
    right:20px;
    top:20px
}
.alice-carousel__slide-info-item {
    line-height:0;
    vertical-align:middle
}
.card {
    box-shadow:0 5px 15px #00000059
}
button {
    background-color:#fff;
    border:#0000;
    border-radius:500px;
    height:50px;
    margin:10px;
    padding:7px;
    width:50px
}
button.bottaoyoutube {
    display: flex;
    max-width: 205px;
    margin-top: 15px;
    width: 15%;
}
button.bottaoyoutube img {
    display: block;
    max-width: 50px;
    position: relative;
}
.card-styles:hover {
    box-shadow:-21px 21px 0 #1d1d1b;
    height:390px;
    width:390px
}
.texto-kit {
    font-size:48px;
    left:40%;
    margin-bottom:5%
}
.alice-carousel__dots-item.__active {
    background:#ffcb00!important;
    height:20px;
    width:20px
}
.alice-carousel__dots-item {
    background:#fff!important;
    height:20px!important;
    width:20px!important
}
.carousel-grupo {
    flex-direction:row;
    justify-content:space-around;
    position:absolute;
    width:100%;
    z-index:1
}
.card,.carousel-grupo {
    align-items:center;
    display:flex
}
.card {
    background-color:#fff;
    border-radius:10px;
    font-size:40px;
    height:100px;
    justify-content:center;
    width:100px
}
.main-wrapper {
    align-items:center;
    display:flex;
    flex-direction:column;
    width:100%
}
.wrapper {
    display:flex;
    margin:20px
}
.card-styles {
    height:360px;
    object-fit:cover;
    width:360px
}
.card-styles:hover {
    height:360px;
    margin-bottom:25%;
    width:360px
}
.card-styles-meio,.card-styles:hover {
    border:3px solid #1d1d1b;
    border-radius:9%;
    cursor:pointer;
    display:flex;
    margin-top:25%;
    object-fit:cover;
    resize:horizontal
}
.card-styles-meio {
    box-shadow:-12px 12px 0 #1d1d1b;
    height:450px;
    margin-bottom:5%;
    width:450px
}
.botao-mostrar-projetos-kits {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    font-size:48px;
    width:25%
}
.botao-mostrar-projetos-kits,.botao-mostrar-projetos-kits:hover {
    background-color:#ffcb00;
    color:#1d1d1b;
    font-family:bitcrusher;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    margin-bottom:3%;
    padding-bottom:1%
}
.botao-mostrar-projetos-kits:hover {
    border:1px solid #1d1d1b;
    box-shadow:-21px 21px 0 #1d1d1b;
    font-size:52px;
    width:27%
}
.botao-ver-menos-kits {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    font-family:bitcrusher;
    font-size:48px;
    width:15%
}
.botao-ver-menos-kits,.botao-ver-menos-kits:hover {
    background-color:#fff;
    color:#1d1d1b;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    margin-bottom:3%;
    padding-bottom:1%
}
.botao-ver-menos-kits:hover {
    border:1px solid #1d1d1b;
    box-shadow:-21px 21px 0 #1d1d1b;
    font-family:Bitcrusher;
    font-size:52px;
    width:17%
}
.texto-kit {
    font-size:32px
}
.texto-kit,.texto-kit-lista {
    background-color:#1d1d1b;
    bottom:-5%;
    color:#1d1d1b;
    display:flex;
    flex-direction:row;
    font-family:Spinner;
    left:0;
    padding-bottom:3%;
    position:absolute;
    right:50%;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content;
    z-index:3
}
.texto-kit-lista {
    font-size:28px
}
.texto-kit-meio {
    background-color:#1d1d1b;
    bottom:-5%;
    color:#1d1d1b;
    display:flex;
    flex-direction:row;
    font-family:Spinner;
    font-size:48px;
    left:0;
    position:absolute;
    right:50%;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content;
    z-index:3
}
.carousel-item {
    align-items:center;
    display:flex;
    font-size:48px;
    justify-content:center;
    position:relative;
    width:200px;
    z-index:0
}
.carousel-item:hover {
    font-size:32px;margin-bottom:-170px;
}
.carousel-item-meio {
    align-items:center;
    display:flex;
    justify-content:center;
    width:200px
}
.botao-conhecer-kit-completo,.botao-ver-menos {
    background-color:#3aaa35;
    font-family:spinner;
    width:100%
}
.botao-ver-menos {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content
}
body {
    --black:#000;
    --ash-black:#222;
    --white:#fafafa;
    --sky:#0cf;
    --green:#2dd;
    --blue:#1300ff;
    --dusk:#60f;
    --purple:#90f;
    --pink:#f06;
    --red:#fe0222;
    --orange:#fd7702;
    --yellow:#fb0;
    --cebolinha:#009040;
    --milena:#f1449a;
    --background:var(--ash-black);
    --accent:#fff
}
#progress .indicator {
    stroke:var(--accent)
}
::-webkit-scrollbar {
    background:var(--background);
    -webkit-border-radius:1ex;
    height:5px;
    width:5px
}
::-webkit-scrollbar-thumb {
    background:var(--accent);
    -webkit-border-radius:1ex
}
::-webkit-scrollbar-corner {
    background:#fff3
}
.refresh {
    align-items:center;
    border:1px dotted var(--accent);
    border-radius:5px;
    cursor:pointer;
    display:flex;
    height:20px;
    justify-content:center;
    padding:5px;
    position:absolute;
    right:10px;
    top:10px;
    width:20px
}
.refresh path {
    fill:var(--accent)
}
.example {
    align-items:center;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    width:100%
}
.box {
    grid-gap:1rem;
    grid-column-gap:10%;
    align-items:flex-start;
    background:var(--accent);
    border-radius:30px;
    color:var(--background);
    column-gap:10%;
    display:grid;
    grid-auto-flow:row;
    grid-template-columns:10rem 10rem 10rem 10rem;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    justify-content:center;
    margin-bottom:10%;
    margin-top:10%;
    padding-bottom:5%;
    width:80%
}
.botao-conhecer-kit-completo {
    border:4px solid #1d1d1b;
    box-shadow:-6px 6px 0 #1d1d1b;
    font-size:48px;
    width:25%
}
.botao-conhecer-kit-completo,.botao-conhecer-kit-completo:hover {
    background-color:#ffcb00;
    color:#1d1d1b;
    font-family:bitcrusher;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    margin-bottom:3%;
    padding-bottom:1%
}
.botao-conhecer-kit-completo:hover {
    border:1px solid #1d1d1b;
    box-shadow:-21px 21px 0 #1d1d1b;
    font-size:52px;
    width:27%
}
.card-styles {
    border:3px solid #1d1d1b;
    border-radius:9%;
    box-shadow:-12px 12px 0 #1d1d1b;
    cursor:pointer;
    display:flex;
    height:200px;
    margin-bottom:25%;
    margin-top:25%;
    resize:horizontal;
    width:200px
}
body,html {
    border:0;
    font-size:100%;
    font:inherit;
    margin:0;
    padding:0;
    vertical-align:initial
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display:block
}
body {
    line-height:1
}
ol,ul {
    list-style:none
}
blockquote,q {
    quotes:none
}
blockquote:after,blockquote:before,q:after,q:before {
    content:"";
    content:none
}
table {
    border-collapse:collapse;
    border-spacing:0
}
.loader-container {
    left:36%;
    max-width:500px;
    position:absolute;
    top:40%
}
.div-animation {
    display:flex;
    height:-webkit-fit-content;
    height:-moz-fit-content;
    height:fit-content;
    justify-content:center;
    width:-webkit-fit-content;
    width:-moz-fit-content;
    width:fit-content
}
/*# sourceMappingURL=main.4255bf71.css.map*/

/***
*** Edição @wesleysilvadesigner ***/
.kits-monica-item-personagem div img {margin-left: -155px;}
.kits-monica-item-titulo div img {margin-left: 0px;}
.App {background: #ffcb00;}

img.Nav-Logo-Styles {height: auto;width: 25%;}
.nav-bar-items-kits {width: 50%;overflow: hidden;}
.header-bg img {max-width: 100%;}
.nav-logo-styles-solo {width: 50%;overflow: hidden;}

.header-bg {
    background-size: cover;
}

.kits-robo-grupo {
    background-size: 100%;
    background-position: top;
    background-repeat: inherit;
}

img.mini-bloco-grupo-personagem {height: auto;width: 80%;margin:auto;}
.mini-bloco-cebolinha:before {
background: #fff;
border-radius: 10%;
content: "";
height: 70%;
left: 0;
position: absolute;
top: 120px;
transform: scale(.9);
transition: .4s;
width: 80%;
z-index: -1;
}
.mini-bloco-milena:before {
background: #ffdc52;
border-radius: 10%;
content: "";
height: 75%;
left: 25px;
position: absolute;
top: 80px;
transform: scale(.9);
transition: .4s;
width: 70%;
z-index: -1;
}
.mini-bloco-monica:before {
background: #ff3240;
border-radius: 10%;
content: "";
height: 70%;
left: 30px;
position: absolute;
top: 100px;
transform: scale(.9);
transition: .4s;
width: 80%;
z-index: -1;
}

img.logo-negativo {
    max-width: 320px;
    padding: 0;
}
.mais-infos {
    display: block;
    text-align: center;
    background-color: #9bbf38;
    width: 100%;
}
a.mais-infos-texto {
    max-width: 535px;
    display: block;
}