@media only screen and (max-width: 767px) {
    body {
        padding-left: 15px;
        padding-right: 15px;
    }

    .dnb-logo {
        display: none;
    }

    .dnb-logo-small {
        height: 36px;
        width: 36px;
        margin: 10px 20px 10px 0;
    }

    /*Font types*/
    h1 {
        font-size: 17px;
        line-height: 20px;
        letter-spacing: 2px;
        margin-top: 15px;
        margin-bottom: 30px;
    }

    h2 {
        font-size: 17px;
        letter-spacing: 0.5px;
        line-height: 24px;
        font-weight: 600;
        margin-top: 0;
        margin-bottom: 8px;
    }

    .grey-box-text {
        font-size: 15px;
        letter-spacing: 0.5px;
        line-height: 21px;
        font-weight: 300;
        margin: 0;
        padding: 0;
    }

    .button-text-inside {
        font-size: 17px;
        font-weight: 600;
        letter-spacing: 1px;
        line-height: 20px;
    }

    .form-input-label {
        font-size: 16px;
        line-height: 14px;
        letter-spacing: 2px;
        margin: 30px 0 5px 0;
        font-weight: bold;
    }

    /* text input placeholder margin to make space for icon*/
    input::-webkit-input-placeholder {
        margin-right: 40px;
    }

    /* header and logo*/
    .dnb-navbar {
        margin: 0;
        padding: 0;
    }

    .dnb-logo {
        margin: 15px 60px 25px 0;
        width: 159px;
        height: 101px;
    }

    /*grey container*/
    .password-container-grey {
        padding: 25px 25px 50px 25px;
        background-color: var(--box-grey);
        margin-top: 30px;
    }

    /* form components*/
    .error-text-invalid-mail {
        font-size: 15px;
        font-weight: 300;
        line-height: 18px;
        letter-spacing: 0.5px;
        margin: 8px 0 0 0;
    }

    input::placeholder {
        font-size: 16px;
        line-height: 26px;
    }

    .email-input {
        font-size: 16px;
        font-weight: lighter;
        line-height: 1.63;
    }

    .submit-button {
        width: 100%;
    }

    .submit-input-button {
        font-size: 15px;
        line-height: 17px;
    }

    /*no grey container*/
    .section-no-container {
        max-width: 800px;
        margin-top: 30px;
    }

    .info-flex .tooltip {
        max-width: 700px;
        padding: 16px 18px 16px 18px;
        font-weight: 300;
        font-size: 16px;
        line-height: 21px !important;
        /* Position the tooltip */
        margin-top: -108px;
        margin-left: -600px;
        margin-right: 64px;
    }
}

@media only screen and (max-width: 660px) {
    .info-flex .tooltip {
        margin-top: -112px;
        margin-left: -500px;
        margin-right: 64px;
    }
}

@media only screen and (max-width: 560px) {
    .info-flex .tooltip {
        margin-top: -154px;
        margin-left: -400px;
        margin-right: 72px;
    }
}

@media only screen and (max-width: 460px) {
    .info-flex .tooltip {
        margin-top: -198px;
        margin-left: -300px;
        margin-right: 76px;
    }

}

@media only screen and (max-width: 380px) {
    .info-flex .tooltip {
        margin-top: -208px;
        margin-left: -260px;
        margin-right: 76px;
    }
}