/* menu-section */
#menu-section {
    position: fixed;
    width: 100%;
    padding: 4vh 0;
    transition: transform .4s;
    transform: translateY(0);
    z-index: 11;
}

#header-logo-div {
    width: 12vw;
}

#header-logo-div img {
    width: 100%;
    height: auto;
}

#menu-itens {
    width: 500px;
}

.menu-link {
    transition: all .3s;
}

.menu-link:hover {
    transform: scale(1.04);
    font-weight: bolder;
}

#menu-link-button {
    border: .15rem solid #1AD0DB;
    border-radius: 1px;
    padding: .6em 1.2em;
    transition: background .3s, color .3s;
}

#menu-link-button:hover {
    color: white;
    background: #1AD0DB;
}

.scroll-menu {
    padding-top: 2vh !important;
    padding-bottom: 2vh !important;
    background-color: #FEFEFE;
    box-shadow: 1px 0 7px -4px !important;
    transform: translateY(0);
    z-index: 10 !important;
}

.scroll-menu-logo {
    width: 10vw !important;
}

.scroll-menu-links .menu-link {
    color: #1B1B1B !important;
}

.hamburger {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 30px;
    height: 20px;
    transition: all 0.3s ease-in-out;
    position: relative;
    z-index: 110;
    /* Para que o botão esteja acima do menu */
    display: none;
}

.hamburger span {
    display: block;
    height: 3px;
    width: 100%;
    background-color: #FEFEFE;
    border-radius: 3px;
    transition: all 0.3s ease-in-out;
    position: relative;
}

.hamburger.open span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}

.hamburger.open span:nth-child(2) {
    opacity: 0;
}

.hamburger.open span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

.mobile-menu {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    width: 80vw;
    height: 400vw;
    background-color: #0D1B21;
    box-shadow: -1px 0 5px rgba(0, 0, 0, 0.1);
    flex-direction: column;
    padding: 0 14vw;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out;
    z-index: 100;
}

.mobile-menu.active {
    display: flex;
    transform: translateX(0);
}

#header-mobile-logo-div {
    width: 30vw;
    margin-top: 18vw;
    margin-left: 10vw;
    margin-bottom: 5vw;
}

#header-mobile-logo-div img {
    width: 100%;
    height: auto;
}

.mobile-menu a {
    margin-top: 8vw;
}

#menu-mobile-open {
    display: none;
    background: rgba(12, 12, 12, 0.9);
    height: 100vh;
    width: 100%;
    z-index: 99;
    position: fixed;
    top: 0;
    left: 0;
    transition: opacity 0.3s ease-in-out;
}

#menu-mobile-open.active {
    display: block;
    opacity: 1;
}

/* top-banner-section */
#section-dupla {
    position: relative;
    height: fit-content;
}

#top-banner-section {
    background-image: url();
    position: relative;
    overflow: hidden;
    height: 700px;
}

#background-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
    filter: blur(3px);
    object-fit: cover;
}

#background-video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-color: rgb(0, 15, 15, 73%);
}

#top-banner-div-conteudo {
    position: absolute;
    z-index: 1;
    width: 46vw;
    top: 50%;
    transform: translateY(-50%);
}

/* integracao-section */
#integracao-div-conteudo {
    position: absolute;
    transform: translateX(100%);
    border-radius: 7px;
    bottom: -7%;
    right: 15%;
    width: 25vw;
    padding: 2.3vw;
    line-height: 2.3vw;
    z-index: 2;
    background: linear-gradient(to bottom,
            rgba(26, 208, 219, .95),
            rgba(18, 142, 150, .95));
}

/* solucoes-section */
#solucoes-section {
    background-color: #FEFEFE;
}

.solucoes-card {
    padding: 1vw;
    width: 16vw;
    height: 13vw;
    box-shadow: 2px 2px 15px -7px #1AD0DB;
    border-radius: 15px;
    position: relative;
    overflow: hidden;
    cursor: default;
}

.solucao-card {
    height: 8.5vw;
    justify-content: space-between
}

.solucoes-card-hover {
    padding: 1vw;
    background: linear-gradient(to bottom,
            rgb(26, 208, 219),
            rgb(23, 164, 174));
    opacity: 0;
    transform: translateY(-100%);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

#card-hover-0 {
    transform: translateY(100%);
    opacity: 0;
    transition: transform 0.6s ease, opacity 0.6s ease;
}

.solucoes-card-hover .fs-22 {
    margin-bottom: 1vw;
}

.show-hover {
    opacity: 1;
    transform: translateY(0);
}

.solucoes-card-main-hidden {
    opacity: 0;
    transform: translateY(100%);
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.solucoes-card img {
    width: 40%;
    margin-bottom: 20px;
}

/* limitacoes-section */
#limitacoes-section {
    padding-left: 0 !important;
    height: 100%;
    background: linear-gradient(to left,
            rgb(26, 208, 219),
            rgb(18, 142, 150));
}

#limitacoes-section .p-80 {
    padding: 3vw;
    padding-right: 0 !important;
}

#limitacoes-imagem-div {
    border-top-right-radius: 15vw;
    border-bottom-left-radius: 15vw;
    position: relative;
    overflow: hidden;
    width: 45vw;
    height: 35vw;
}

#limitacoes-imagem-div img {
    width: 100%;
    height: 100%;
}

#limitacoes-section h2,
#limitacoes-imagem-div,
#limitacoes-div-conteudo p {
    opacity: 0;
    transform: translateY(20px);
}

/* beneficios-section */
#beneficios-section {
    background-color: #FEFEFE;
    background-image: url('../assets/imagens/background-1.png');
    background-position-y: 11vw;
    background-size: 100vw;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.beneficios-div {
    width: 60%;
    height: 7vw;
    justify-content: center;
    margin-top: 1.1vw;
    transform: scaleX(0);
    transform-origin: left center;
    opacity: 0;
    transition: transform 0.6s ease, opacity 0.6s ease;
}

.beneficios-div h4 {
    margin-bottom: 0.5vw;
}

.beneficios-div-black {
    text-align: right;
    padding-right: 3.5vw;
    border-top-right-radius: 100px;
    border-bottom-right-radius: 100px;
    background: linear-gradient(to left,
            rgb(67, 67, 67),
            rgb(34, 34, 34));
}

.beneficios-div-blue {
    align-self: end;
    padding-left: 3.5vw;
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
    background: linear-gradient(to left,
            rgb(26, 208, 219),
            rgb(24, 163, 171));
    transform-origin: right center;
}

/* call-action-section */
#call-action-section {
    position: relative;
    height: 18vw;
    background-image: url('../assets/imagens/background-2.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    z-index: 0;
}

#call-action-section::after {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    content: "";
    background-color: rgba(10, 61, 67, .85);
    z-index: 0;
}

/* indicadores-section */
#indicadores-section {
    background-color: #FEFEFE;
}

.indicadores-content {
    width: 33vw;
    margin-right: 2vw;
}

#indicadores-content-div-first-after {
    margin-right: 2vw;
}

.indicadores-after {
    position: relative;
}

#indicadores-section .numero-animado {
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.indicadores-after::after {
    position: absolute;
    width: 1px;
    height: 5vw;
    background-color: #1AD0DB;
    content: "";
    top: 50%;
    right: -10%;
    transform: translateY(-50%);
}

/* slider-section */
#slider-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
    background-color: #FEFEFE;
    position: relative;
    text-align: center;
}

.carousel-container {
    overflow: hidden;
}

.carousel-wrapper {
    animation: moveCarousel 2000s linear infinite;
}

.carousel-slide {
    margin: 0 2.4vw;
    height: 3.5vw;
}

@keyframes moveCarousel {
    0% {
        transform: translateX(0);
    }

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

/* xml-section */
#xml-section {
    background-color: #0D1B21;
}

#xml-section .p-80 {
    background-color: #0D1B21;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.xml-content {
    width: 55%;
}

#xml-descricao {
    line-height: 2vw;
}

#xml-card {
    background-color: #FEFEFE;
    width: 21vw;
    height: 26vw;
    min-height: 380px;
    min-width: 265px;
    border-radius: 18px;
    padding: 2.5vw 3vw;
    overflow: hidden;
    opacity: 0;
    transform: translateY(500px);
    transition: transform 0.8s ease, opacity 0.8s ease;
}

#xml-card.show-card {
    opacity: 1;
    transform: translateY(0);
}

#xml-card small {
    position: absolute;
    width: 6vw;
    rotate: 40deg;
    top: 20px;
    right: -5px;
    z-index: 1;
}

#xml-card p {
    position: relative;
    padding-left: 40px;
    margin-bottom: 20px;
}

#xml-card p::before {
    position: absolute;
    content: "";
    width: .18vw;
    height: .9vw;
    rotate: 50deg;
    background-color: #1AD0DB;
    border-radius: 1px;
    left: .5vw;
    top: .3vw;
}

#xml-card p::after {
    position: absolute;
    content: "";
    width: .18vw;
    height: .6vw;
    rotate: -38deg;
    background-color: #1AD0DB;
    border-radius: 1px;
    left: 0;
    top: .5vw;
}

/* form-section */
#form-section {
    background: #FEFEFE;
}

#form-estado {
    color: #757575;
    /* Cor do placeholder */
}

#form-estado:focus {
    color: #000;
    /* Cor dos outros valores após selecionar */
}

#form-estado option {
    color: #000;
    /* Cor normal dos valores */
}

.div-input {
    width: 49%;
}

#form-section input,
#form-section select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    margin-top: 20px;
    padding: 1vw 1.7vw;
    border: #d7d7d7 solid 1px;
    background: white;
    box-shadow: 0 0 7px -6px black;
}

/* footer-section */
#footer-section {
    background-color: #0D1B21;
    height: 17vw;
}

#footer-div-after {
    width: 55%;
}

.footer-after img {
    width: 1.8vw;
}

#footer-img {
    width: 15vw;
}

.footer-after {
    position: relative;
}

.footer-after::after {
    position: absolute;
    content: "";
    height: 4vw;
    width: 1px;
    background-color: #1AD0DB;
    top: 50%;
    left: -75%;
    transform: translateY(-50%);
}

#footer-section a {
    transition: transform .3s
}

#footer-section a:hover {
    transform: scale(1.01);
}

.footer-contatos {
    margin-left: 20px;
}

#loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.9);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 100;
}

.loader img {
    width: 5.72916666666vw !important;
}

/* Botao flutuante */
#botao-flutuante {
    display: flex;
    position: fixed;
    align-items: center;
    padding: 15px 15px;
    bottom: 3vw;
    right: 3vw;
    z-index: 10;
    border-radius: 100px;
    color: white;
    background: #2ed46c;
    box-shadow: 0 1px 7px -4px black;
    justify-content: space-between;
    transition: all .3s;
    cursor: pointer;
}

#botao-flutuante:hover {
    transform: scale(1.03);
    background: #10635A;
}

/* Fim Botao flutuante */

@media screen and (max-width: 1024px) {
    #menu-itens {
        width: 350px;
    }

    #top-banner-div-conteudo {
        width: 59vw;
        line-height: 4vw;
    }

    /* integracao-section */
    #integracao-div-conteudo {
        bottom: -4%;
        width: 34vw;
        padding: 3.3vw;
        line-height: 2.8vw;
    }

    #solucoes-section .m-t-50 {
        margin-top: 2vw !important;
    }

    .solucoes-card {
        padding: 1vw;
        width: 33.5vw;
        height: 24vw;
        margin-top: 2.5vw;
    }

    .solucao-card {
        height: 16vw;
        padding: 2vw 4vw;
    }

    .solucoes-card-hover {
        padding: 2vw 4vw;
    }

    #limitacoes-section {
        padding-right: 5vw !important;
    }

    #limitacoes-imagem-div {
        height: 50vw;
        width: 80vw;
        border-top-right-radius: 13vw;
        border-bottom-left-radius: 13vw;
    }

    #limitacoes-section .p-80 {
        padding: 3vw !important;
        padding-right: 4vw !important;
    }

    #limitacoes-div-conteudo {
        margin-top: 3.5vw !important;
    }

    #limitacoes-div-conteudo p {
        font-size: calc(1.0417vw + 1.0417vw * .5) !important;
    }

    #beneficios-section {
        background-position-y: 13vw;
    }

    .beneficios-div {
        width: 75%;
        height: 9vw;
        margin-top: 1.6vw;
    }

    #beneficios-section .show-card h4 {
        margin-bottom: 0.7vw;
        font-size: calc(1.2500vw + 1.2500vw * .3) !important;
    }

    #beneficios-section .show-card p {
        font-size: calc(0.9375vw + 0.9375vw * .3) !important;
    }

    #call-action-section {
        height: 25vw;
    }

    #call-action-section p {
        width: 32vw;
    }

    .indicadores-content {
        text-align: center;
        margin-bottom: 2vw;
        width: 100vw;
    }

    #indicadores-content-div-first-after {
        margin-right: 8vw;
    }

    .indicadores-after::after {
        right: -25%;
    }

    .carousel-slide {
        height: 6vw;
    }

    .carousel-wrapper {
        animation: moveCarousel 3000s linear infinite;
    }

    #xml-descricao {
        line-height: 2.3vw;
    }

    #xml-section .p-80 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #xml-card {
        min-height: 340px;
        padding: 2.5vw 3vw;
    }

    .xml-content {
        width: 45%;
    }

    #xml-card small {
        position: absolute;
        width: 6vw;
        rotate: 40deg;
        top: 11px;
        right: -5px;
        z-index: 1;
    }

    #xml-card p::before {
        height: 1.1vw;
        left: 1.5vw;
    }

    #xml-card p::after {
        height: 0.9vw;
        left: 0.8vw;
    }

    #form-section input,
    #form-section select {
        margin-top: 15px;
        padding: 1.4vw 1.7vw;
    }

    #footer-section {
        height: 20vw;
    }

    #footer-div-after {
        width: 59%;
    }

    .footer-after::after {
        left: -35%;
    }
}

@media screen and (max-width: 845px) {
    #menu-itens {
        display: none;
    }

    .hamburger {
        display: flex;
    }

    .scroll-mobile-menu span {
        background-color: #0a0a0a;
    }

    .hamburger.open span {
        background-color: #FFFFFF;
    }

    #top-banner-section {
        height: 740px !important;
    }

    #header-logo-div {
        width: 18vw;
    }

    .scroll-menu-logo {
        width: 18vw !important;
    }

    .button-blue {
        font-size: calc(.8333vw + .8333vw * .5) !important;
    }

    #integracao-div-conteudo {
        line-height: 3.3vw;
        width: 30vw;
        bottom: -2%;
    }

    #integracao-div-conteudo h2 {
        font-size: calc(1.5625vw + 1.5625vw * .5) !important;
    }

    #integracao-div-conteudo p {
        font-size: calc(1.2500vw + 1.2500vw * .5) !important;
    }

    #xml-section .p-80 {
        flex-wrap: wrap;
        justify-content: center !important;
    }

    .xml-content {
        text-align: center;
        margin-bottom: 3vw;
        width: 100%;
    }

    #xml-descricao {
        font-size: calc(1.0417vw + 1.0417vw * .5) !important;
    }

    #xml-card {
        padding: 2.5vw 3vw;
        width: 31vw;
        height: 37vw;
        min-height: 242px;
        min-width: 185px;
    }

    #xml-card p::before {
        font-size: calc(.9375vw + .9375vw * .5) !important;
    }

    #xml-card p::before {
        height: 1.3vw;
        left: 1.3vw;
    }

    #xml-card p::after {
        height: 1vw;
        left: .5vw;
    }

    #footer-section {
        height: 22vw;
    }

    #footer-div-after {
        width: 68%;
    }

    .footer-after::after {
        left: -18%;
    }

    .footer-after p,
    .footer-after a {
        font-size: calc(.7812vw + .7812vw * .7) !important;
    }
}

@media screen and (max-width: 600px) {
    #header-logo-div {
        width: 30vw;
    }

    .scroll-menu-logo {
        width: 30vw !important;
    }

    .button-blue {
        font-size: calc(.8333vw + .8333vw * 1) !important;
    }

    #top-banner-section {
        height: 720px !important;
    }

    #top-banner-div-conteudo {
        width: 80vw;
        line-height: 7.5vw;
    }

    #integracao-div-conteudo {
        bottom: -4%;
        right: 10%;
        width: 45vw;
        padding: 3.3vw;
        line-height: 4.5vw;
    }

    #integracao-div-conteudo h2 {
        font-size: calc(1.5625vw + 1.5625vw * .8) !important;
    }

    #integracao-div-conteudo p {
        font-size: calc(1.2500vw + 1.2500vw * .8) !important;
    }

    .solucoes-card {
        padding: 1vw;
        width: 37vw;
        height: 30vw;
        margin-top: 5.5vw;
    }

    .solucao-card {
        height: 16vw;
        padding: 2vw 4vw;
    }

    .solucoes-card-hover {
        padding: 2vw 4vw;
    }

    #limitacoes-section .p-80 {
        padding-top: calc(4.16666666666vw + 4.16666666666vw * 1.2) !important;
        padding-bottom: calc(4.16666666666vw + 4.16666666666vw * 1.2) !important;
        padding-left: calc(4.16666666666vw + 4.16666666666vw * 1.2) !important;
        height: 90vw;
    }

    #limitacoes-imagem-div {
        display: none;
    }

    #limitacoes-div-conteudo {
        margin-top: 5vw !important;
    }

    #limitacoes-div-conteudo p {
        font-size: calc(1.0417vw + 1.0417vw * 1.5) !important;
    }

    #beneficios-section {
        background-position-y: 17vw;
    }

    .beneficios-div {
        height: 15vw;
        width: 90vw;
        margin-top: 5vw;
    }

    .beneficios-div-black {
        padding-right: 7vw;
    }

    .beneficios-div-blue {
        padding-left: 7vw;
    }

    #beneficios-section .show-card h4 {
        font-size: calc(1.2500vw + 1.2500vw * 1.4) !important;
    }

    #beneficios-section .show-card p {
        font-size: calc(0.9375vw + 0.9375vw * 1.4) !important;
    }

    #call-action-section {
        height: 35vw;
    }

    #indicadores-section .p-b-80 {
        padding-bottom: 1vw !important;
    }

    .indicadores-content {
        text-align: center;
        margin-bottom: 2vw;
        width: 100vw;
    }

    #indicadores-content-div-first-div {
        margin-right: 0 !important;
        width: unset;
        flex-direction: column;
        align-items: flex-start;
    }

    #indicadores-content-div-second-div {
        width: 49%;
    }


    #indicadores-content-div-first-div div,
    #indicadores-content-div-second-div div {
        margin-top: 2vw;
        text-align: center;
    }

    #indicadores-total-orcamento {
        min-width: 160px;
    }

    .indicadores-after::after {
        height: 0;
    }

    .carousel-slide {
        height: 8vw;
    }

    .fs-65 {
        font-size: calc(3.073vw + 3.073vw * 1.2) !important;
    }

    .xml-content {
        margin-bottom: 6vw;
    }

    #xml-card {
        padding: 3.5vw 4vw;
        width: 31vw;
        height: 37vw;
        min-height: 320px;
        min-width: 260px;
    }

    #xml-descricao {
        font-size: calc(1.0417vw + 1.0417vw * 1) !important;
        line-height: 3vw;
    }

    #xml-card small {
        width: 10vw;
        rotate: 40deg;
        top: 11px;
        right: -5px;
    }

    #xml-card::after {
        right: -7vw;
        top: -7vw;
    }

    #xml-card p::before {
        top: 0.6vw;
    }

    #xml-card p::after {
        top: 0.8vw;
    }

    #form-section input,
    #form-section select {
        margin-top: 2vw;
        padding: 2vw 2.3vw;
    }

    #footer-section {
        height: fit-content;
    }

    #footer-content {
        flex-direction: column-reverse;
        align-items: center;
    }

    #footer-div-after {
        width: 100%;
    }

    #footer-content p,
    #footer-content a {
        font-size: calc(0.7812vw + 0.7812vw * 1.5) !important;
    }

    .footer-after {
        height: 18vw;
    }

    .footer-after img {
        width: 3vw;
    }

    .footer-after::after {
        display: none;
    }

    #footer-img {
        margin-top: 7vw;
        width: 30vw;
    }
}

@media screen and (max-width: 460px) {
    .mobile-menu {
        padding: 0 6vw;
    }

    #header-mobile-logo-div {
        width: 50vw;
        margin-top: 25vw;
        margin-left: 6vw;
    }

    .button-blue {
        font-size: calc(.8333vw + .8333vw * 2.2) !important;
        padding: 2.5vw 5.5vw;
    }

    #top-banner-div-conteudo {
        line-height: 9.5vw;
    }

    #integracao-div-conteudo h2 {
        font-size: calc(1.5625vw + 1.5625vw * 1.8) !important;
    }

    #integracao-div-conteudo p {
        font-size: calc(1.2500vw + 1.2500vw * 1.8) !important;
    }

    #integracao-div-conteudo {
        width: 67.2vw;
        padding: 4.5vw;
        line-height: 6vw;
    }

    #solucoes-section #mobile-justify-center {
        justify-content: center !important;
    }

    .solucoes-card-hover .fs-22 {
        margin-bottom: 3vw;
        font-size: calc(1.1458vw + 1.1458vw * 3) !important;
    }

    .solucoes-card-hover .fs-20 {
        margin-bottom: 3vw;
        font-size: calc(1.0417vw + 1.0417vw * 2.5) !important
    }

    .solucoes-card {
        padding: 4vw;
        width: 60vw;
        height: 45vw;
    }

    .solucao-card {
        height: 27vw;
    }

    #limitacoes-section h2 {
        line-height: 7.5vw;
    }

    #limitacoes-div-conteudo p {
        font-size: calc(1.0417vw + 1.0417vw * 2) !important;
    }

    #limitacoes-section .p-80 {
        height: 115vw;
    }

    #beneficios-section {
        background-position-y: 28vw;
        background-size: 130vw;
    }

    .beneficios-div {
        height: 22vw;
        width: 90vw;
        margin-top: 5vw;
    }

    .beneficios-div-black {
        padding-right: 12vw;
    }

    .beneficios-div-blue {
        padding-left: 12vw;
    }

    #beneficios-section .show-card h4 {
        margin-bottom: 2vw;
        font-size: calc(1.2500vw + 1.2500vw* 2) !important;
    }

    #beneficios-section .show-card p {
        font-size: calc(0.9375vw + 0.9375vw* 2) !important;
    }

    #call-action-section {
        height: 50vw;
    }

    #call-action-div {
        flex-wrap: wrap;
        width: 100%;
        justify-content: center;
    }

    #call-action-div div {
        width: 100%;
        align-items: center;
    }

    #call-action-section p {
        width: 100%;
        text-align: center;
        margin-top: 2vw;
    }

    .fs-65 {
        font-size: calc(3.073vw + 3.073vw * 2) !important;
    }

    .carousel-slide {
        margin: 0 3vw;
        height: 10vw;
    }

    #xml-descricao {
        font-size: calc(1.0417vw + 1.0417vw * 2) !important;
        line-height: 5vw;
    }

    #xml-card {
        padding: 6.5vw 10vw;
        width: 100%;
        height: 90vw;
        min-height: 290px;
        min-width: 100%;
    }

    #xml-card::after {
        right: -10vw;
        top: -8vw;
    }

    #xml-card::after {
        right: -10vw;
        top: -10vw;
        border-left: 20vw solid transparent;
        border-right: 12vw solid transparent;
        border-bottom: 20vw solid #1AD0DB;
    }

    #xml-card small {
        width: 14vw;
        top: 13px;
    }

    #xml-card h3 {
        font-size: calc(1.4750vw + 1.4750vw* 2.5) !important;
    }

    #xml-card p {
        font-size: calc(0.9375vw + 0.9375vw * 2.5) !important;
    }

    #xml-card p::before {
        top: .8vw;
        height: 3.3vw;
        left: 3.3vw;
        width: .48vw;
    }

    #xml-card p::after {
        top: 1.5vw;
        height: 2vw;
        left: 1.3vw;
        width: .48vw;
    }

    #xml-card a,
    #xml-card button {
        width: 100%;
    }

    #form-section h2 {
        font-size: calc(1.8229vw + 1.8229vw * 1.7) !important;
    }

    .div-input {
        width: 100%;
    }

    #form-section input,
    #form-section select {
        margin-top: 3vw;
        padding: 3vw 3.6vw;
        font-size: calc(0.8333vw + 0.8333vw * 2.3) !important;
    }

    #footer-div-after {
        flex-wrap: wrap;
        justify-content: center;
        height: 65vw;
        flex-direction: column;
        margin-bottom: calc(1.5625vw + 1.5625vw * 1.2) !important;
    }

    .footer-after {
        align-items: center;
        height: 25vw;
        margin-bottom: 30px;
    }

    .footer-after img {
        width: 4.5vw;
    }

    #footer-content p {
        font-size: calc(0.7812vw + 0.7812vw * 2.5) !important;
    }

    #footer-content a {
        font-size: calc(0.7812vw + 0.7812vw * 3) !important;
    }

    #footer-img {
        margin-top: 5vw;
        width: 40vw;
    }
}