@media only screen and (max-width: 767px) {
                                    .body-bg {
                                        padding-left: calc(var(--nav-width) + 2rem);
                                    }
                                    .header {
                                        height: calc(var(--header-height) + 1rem);
                                        padding: 0 2rem 0 calc(var(--nav-width) + 2rem)
                                    }
                                    .header_img {
                                        width: 40px;
                                        height: 40px
                                    }
                                    .header_img img {
                                        width: 45px
                                    }
                                    .l-navbar {
                                        left: 0;
                                        padding: 1rem 1rem 0 0
                                    }
                                    .show {
                                        width: calc(var(--nav-width) + 156px)
                                    }
                                    .body-pd {
                                        padding-left: calc(var(--nav-width) + 188px)
                                    }
                                    .convert-text-block {
                                        display: block;
                                        margin-left: 0px;
                                        width: 250px;
                                    }
                                    .convert-btn {
                                        width: 125.61px;
                                        height: 43px;
                                    }
                                    .convert-image-text {
                                        font-size: 22px;
                                    }
                                    .dropzone-wrapper {
                                        height: 360.73px;
                                    }
                                    .e-book {
                                        display: grid;
                                        justify-content: center;
                                    }
                                    .menu2 {
                                        top: 36%;
                                        left: 14%;
                                    }
                                    .menu {
                                        top: 23%;
                                        left: 75%;
                                    }
                                    .filter-img-btn {
                                        left: 39%;
                                        top: 32%;
                                    }
                                    .browse-btn {
                                        width: 128px;
                                        height: auto;
                                    }
                                    .selected-img {
                                        padding: 100px 60px 100px 60px;
                                    }
                                }
                                
                                @media only screen and (min-width: 768px) and (max-width: 991px) {
                                    .body-bg {
                                        padding-left: calc(var(--nav-width) + 1rem);
                                    }
                                    .convert-text-block {
                                        display: block;
                                        margin-left: 24%;
                                        width: 350px;
                                    }
                                    .convert-btn {
                                        width: 125.61px;
                                        height: 43px;
                                    }
                                    .convert-image-text {
                                        font-size: 22px;
                                    }
                                    .nav-buttons {
                                        margin-left: 20% !important;
                                    }
                                    .nav-buttons2 {
                                        margin-right: 80px;
                                    }
                                    .dropzone-wrapper {
                                        height: 343.73px;
                                    }
                                    .e-book {
                                        display: grid;
                                        justify-content: center;
                                    }
                                    .login-form h1 {
                                        font-size: 28px;
                                    }
                                    .filter-img-btn {
                                        left: 23.5%;
                                        top: 32%;
                                    }
                                    .img-div h1 {
                                        font-size: 28px;
                                    }
                                    .menu2 {
                                        top: 37% !important;
                                        left: 12% !important;
                                    }
                                    .menu {
                                        top: 25% !important;
                                        left: 39% !important;
                                    }
                                    .signup-form h1 {
                                        font-size: 28px;
                                    }
                                    .selected-img {
                                        padding: 100px 60px 100px 60px;
                                    }
                                }
                                
                                @media only screen and (min-width: 992px) and (max-width: 1199px) {
                                    .body-bg {
                                        padding-left: calc(var(--nav-width) + 1rem);
                                    }
                                    .convert-text-block {
                                        display: block;
                                        margin-left: 30%;
                                        width: 350px;
                                    }
                                    .convert-btn {
                                        width: 125.61px;
                                        height: 43px;
                                    }
                                    .convert-image-text {
                                        font-size: 22px;
                                    }
                                    .nav-buttons {
                                        margin-left: 28% !important;
                                    }
                                    .nav-buttons2 {
                                        margin-right: 20px !important;
                                    }
                                    .add-image-div {
                                        width: 526.37px
                                    }
                                    .menu2 {
                                        top: 84% !important;
                                        left: 9% !important;
                                    }
                                    .filter-img-btn {
                                        left: 23% !important;
                                        top: 65% !important;
                                    }
                                    .menu {
                                        top: 40% !important;
                                        left: 41% !important;
                                    }
                                    .selected-img {
                                        padding: 100px 30px 100px 100px;
                                    }
                                }
                                
                                @media only screen and (min-width: 1200px) and (max-width: 1399px) {
                                    .convert-btn {
                                        width: 151.61px;
                                        height: 52px;
                                    }
                                    .convert-text-block {
                                        width: 1034.19px;
                                        margin-left: 40px;
                                        padding-top: 50px;
                                        display: flex;
                                        justify-content: space-between;
                                    }
                                    .menu {
                                        top: 40% !important;
                                        left: 40% !important;
                                    }
                                    .menu2 {
                                        top: 78% !important;
                                        left: 15% !important;
                                    }
                                    .selected-img {
                                        padding: 100px 30px 100px 100px;
                                    }
                                    .filter-img-btn {
                                        left: 26% !important;
                                        top: 60% !important;
                                    }
                                    .body-bg {
                                        padding-left: calc(var(--nav-width) + 1rem);
                                    }
                                }
                                
                                @media only screen and (min-width: 1400px) and (max-width: 1599px) {
                                    .convert-text-block {
                                        width: 1034.19px;
                                        margin-left: 135px;
                                        padding-top: 50px;
                                        display: flex;
                                        justify-content: space-between;
                                    }
                                    .menu {
                                        position: absolute;
                                        top: 31% !important;
                                        left: 40% !important;
                                    }
                                    .menu2 {
                                        position: absolute;
                                        top: 67% !important;
                                        left: 20% !important;
                                    }
                                    .filter-img-btn {
                                        position: absolute;
                                        top: 55%;
                                        left: 28%;
                                    }
                                }
                                
                                @media only screen and (min-width: 1500px) and (max-width: 5000px) {
                                    .convert-text-block {
                                        width: 1034.19px;
                                        margin-left: 135px;
                                        padding-top: 50px;
                                        display: flex;
                                        justify-content: space-between;
                                    }
                                }
                                
                                @media only screen and (min-width: 1500px) and (max-width: 1699px) {
                                    .menu {
                                        top: 31% !important;
                                        left: 41% !important;
                                    }
                                    .menu2 {
                                        top: 67% !important;
                                        left: 22% !important;
                                    }
                                    .filter-img-btn {
                                        top: 55%;
                                        left: 30.5%;
                                    }
                                }
                                
                                @media only screen and (min-width: 1500px) and (max-width: 1699px) {
                                    .menu {
                                        top: 31% !important;
                                        left: 41% !important;
                                    }
                                    .menu2 {
                                        top: 67% !important;
                                        left: 22% !important;
                                    }
                                    .filter-img-btn {
                                        top: 50%;
                                        left: 30.5%;
                                    }
                                }
                                
                                @media only screen and (min-width: 1700px) and (max-width: 2000px) {
                                    .menu {
                                        top: 31% !important;
                                        left: 39% !important;
                                    }
                                    .menu2 {
                                        top: 67% !important;
                                        left: 22% !important;
                                    }
                                    .filter-img-btn {
                                        top: 50%;
                                        left: 29.5%;
                                    }
                                }