@media screen and (max-width: 698px) {
    .form-container {
        width: 90%;
    }
    #formFristRegister {
        width: 100% !important;
    }

    .carousel img {
        height: 400px;
    }

    .tot-calc {
        flex-direction: column;
    }

    #formPayment {
        width: 95% !important;
    }

    nav .calc-img {
        width: 15rem;
        height: 15rem;
        transform: translateX(-1rem);
    }

    #smNav .navbar-nav,
    #scrollSmNav .navbar-nav {
        flex-direction: row !important;
        width: 65%;
    }

    .navbar .w-75 {
        width: 100% !important;
    }

    nav {
        z-index: 999;
    }

    nav .icon {
        width: 2.8rem;
        height: 2.8rem;
        background-color: rgb(41, 41, 184);
        transition: all 0.8s;
        border: 3px solid rgb(41, 41, 184);
    }

    nav .icon i {
        transition: all 0.8s;
    }

    nav .icon:hover {
        background-color: #fff;
    }

    footer .icon:hover i {
        color: rgb(41, 41, 184) !important;
    }

    header img {
        height: 37vh !important;
    }

    header video {
        height: 50vh !important;
    }

    .head-container {
        transform: translate(-0.5rem, 10rem);
    }

    #carouselExampleFade {
        width: 100%;
    }

    .carousel-control-next {
        right: 0%;
    }

    .carousel-control-prev {
        left: 0%;
    }

    header .btn-success,
    header .btn-warning {
        font-size: 0.75rem !important;
        padding: 4px 4px !important;
        width: 6rem;
    }

    .head-container {
        margin: 0 !important;
    }

    header .h1 {
        font-size: 1.2rem;
        width: 80%;
        margin: 0 !important;
    }

    header .fs-3 {
        font-size: 1rem !important;
        margin: .3rem 0 !important;
    }

    header p {
        font-size: 0.8rem !important;
        width: 50%;
    }

    #toRight {
        opacity: 100 !important;
    }

    #userData {
        font-size: .75rem;
        font-weight: bold;
    }

    #whoWeAre .btn-outline-primary,
    .progress {
        margin: 1rem 0;
    }

}

@media screen and (min-width: 698px) and (max-width: 767px) {

    #tbro3 .col-md-6 {
        width: 80% !important;
    }

}

@media screen and (min-width: 698px) and (max-width: 992px) {
    header {
        height: 60vh;
        background-size: cover;
    }

    header .btn-success,
    header .btn-warning {
        font-size: 1.2rem !important;
        padding: 4px 4px !important;
        width: 6rem;
    }

    .head-container {
        transform: translate(-.2rem, 14rem);
    }

    #footer .row {
        flex-direction: column;
    }

    .w-sm-100 {
        width: 100%;
        text-align: center;
    }

}

@media screen and (max-width: 992px) {
    .introHead {
        width: 70% !important;
    }

    #scrollNav,
    #mainNav {
        display: none;
    }

    nav ul {
        flex-direction: row !important;
    }

    #smNav,
    #dropNav {
        display: block !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
    .btn-md-sm {
        font-size: .9rem !important;
        font-weight: bold;
    }

    nav .nav-link {
        font-size: 0.8rem !important;
    }
}