@media (max-width: 768px) {

    /* Navigation */
    .nav-desktop{ display: none; }
    .bar-btn{ display: inline-block; }
    .nav-title{ margin: 20px 0 0 40px; }

    /* Main */
    .right-panel{
        width: 100%;
    }
    .left-panel{
        width: 100%;
        margin-top: 30px;
    }
    .header{ margin: 5vh 0 0 0; }
    .header h1{
        margin: 20px 40px 0 40px;
    }
    .header p{
        margin: 25px 40px 0 40px;
    }
    .start-btn{
        margin: 25px auto 0 auto;
        display: block;
    }
    .header img{
        width: 70%;
        min-width: 250px;
    }

    /* Login */
    .login-box { width: 350px; }
    .login-inputs { width: 330px; padding: 12px 8px; }
    .login-btn { width: 349px; padding: 12px 8px; }

    /* Verify */
    .code-inputs { padding: 15px 8px; margin: 15px 0 5px 9px; }

    /* Dashboard */
    .dashboard-page { flex-direction: column; justify-content: start; gap: 10px; margin: 5vh auto 0 auto; }
    
    .dright-menu { width: auto; height: fit-content; }
    .dright-btns { display: inline-block; width: fit-content; padding: 5px 0; margin-left: 5px; }
    .dright-btns i { margin: 0 10px 0 0; }
    .dright-btns p { display: inline-block; padding: 0 8px; }

    .dleft-menu { width: auto; margin: 0; }

    /* Profile Settings */
    .prof-forms { width: 85%; margin: 0 25px 20px 0;}
    .preview { margin: 0 0 10px 0; }
    .pf-inputs { padding: 8px 6px; }
    .pf-button { padding: 7px 16px; }
    .pf-save { padding: 8px 0; }

    /* Link */
    .link-input { width: 90%; }
    .button-section { flex-direction: column; gap: 10px; }
    .link-btns { width: 95%; }

    /* Messages */
    .dleft-menu-pm { width: 100%; }
    .pm { width: 90%; }

    /* Send Message */
    .sendmsg-bg { width: 90%; top: 54%; }
    .banner { height: 25%; }
    .sm-profimg { margin: 50px 25px 0 0; }
    .more-content { height: fit-content; }
    .client-name { margin: 7px 150px 0 0; }
    .client-desc { margin: 15px 20px 0 0; }
    .client-message { width: 85%; min-width: 200px; }

}