@media screen and (min-width: 1200px){
        * {
            font-family: "Poppins";
        }
.working_progress{
	display:none;
}
        .body {
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            overflow-y: hidden;
            background: var(--bg_default);
            height: 100vh;
        }

        .default_container {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 98vh;
            overflow-y: hidden;
            position: relative;
            z-index: 10;
        }

        .screen-1 {
            background: var(--bg_default_screen1);
            padding: 2em;
            display: flex;
            flex-direction: column;
            border-radius: 10px;
            box-shadow: 0 0 1em var(--bg_default_boxshadow);
            gap: 2em;
            width: 30vw;
        }

            .screen-1 .logo {
                margin-bottom: 2em;
                display: flex;
                flex-direction: column;
                align-items: center;
            }

                .screen-1 .logo img {
                    width: 10vw;
                }

            .screen-1 .email {
                background: white;
                box-shadow: 0 0 1em var(--bg_default_boxshadow);
                padding: 1em;
                display: flex;
                flex-direction: column;
                gap: 0.5em;
                color: #4d4d4d;
                margin-top: -3em;
                border-radius: 3px;
            }

                .screen-1 .email input {
                    outline: none;
                    border: none;
                }

                    .screen-1 .email input::-moz-placeholder {
                        color: black;
                        font-size: 0.9em;
                    }

                    .screen-1 .email input:-ms-input-placeholder {
                        color: black;
                        font-size: 0.9em;
                    }

                    .screen-1 .email input::placeholder {
                        color: black;
                        font-size: 0.9em;
                    }

                .screen-1 .email ion-icon {
                    color: #4d4d4d;
                    margin-bottom: -0.2em;
                }

            .screen-1 .password {
                background: white;
                box-shadow: 0 0 1em var(--bg_default_boxshadow);
                padding: 1em;
                display: flex;
                flex-direction: column;
                gap: 0.5em;
                color: #4d4d4d;
                border-radius: 3px;
            }

                .screen-1 .password input {
                    outline: none;
                    border: none;
                }

                    .screen-1 .password input::-moz-placeholder {
                        color: black;
                        font-size: 0.9em;
                    }

                    .screen-1 .password input:-ms-input-placeholder {
                        color: black;
                        font-size: 0.9em;
                    }

                    .screen-1 .password input::placeholder {
                        color: black;
                        font-size: 0.9em;
                    }

                .screen-1 .password ion-icon {
                    color: #4d4d4d;
                    margin-bottom: -0.2em;
                }

                .screen-1 .password .show-hide {
                    margin-right: -5em;
                }

            .screen-1 .login {
                padding: 1em;
                background: var(--bg_default_login);
                color: white;
                border: none;
                border-radius: 30px;
                font-weight: 600;
                cursor: pointer;
            }

            .screen-1 .footer {
                display: flex;
                font-size: 0.7em;
                color: #5e5e5e;
                gap: 14em;
            }

                .screen-1 .footer span {
                    cursor: pointer;
                }

        .sec-2 {
            width: 100%;
            background-color: #3e46841f;
            border-radius: 3px;
            min-height: 45px;
            padding: 5px;
        }

        input {
            width: 100%;
            min-height: 45px;
            background-color: transparent;
        }

        .header {
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

        .pr5 {
            padding-right: 5px;
        }

        ::-webkit-input-placeholder {
            font-style: italic;
        }

        :-moz-placeholder {
            font-style: italic;
        }

        ::-moz-placeholder {
            font-style: italic;
        }

        :-ms-input-placeholder {
            font-style: italic;
        }

        button {
            cursor: pointer;
        }

        canvas {
            width: 100vw;
            height: 100vh;
        }
}
/*tablet*/
@media screen and (min-width: 600px) and (max-width: 1200px) {
	* {
	 font-family: 'Poppins';
}

.working_progress{
background: var(--bg_default_screen1);
        padding: 2em;
        border-radius: 30px;
        box-shadow: 0 0 2em #000;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
        width: 80%;
        flex-direction: column;
}
.working_progress > span{
font-size: larger;
word-break: break-word;
}

 body {
	 user-select: none;
	 /*overflow-y: hidden;*/
	 display: flex;
	 justify-content: center;
	 align-items: center;
	 background: #000;
	 height: 100vh;
}
 .screen-1 {
	 background: #000;
	 padding: 2em;
	 display: none;
	 flex-direction: column;
	 border-radius: 30px;
	 box-shadow: 0 0 2em #000;
	 gap: 2em;
}
 .screen-1 .logo {
	 margin-top: -3em;
}
 .screen-1 .email {
	 background: #000;
	 box-shadow: 0 0 2em #000;
	 padding: 1em;
	 display: flex;
	 flex-direction: column;
	 gap: 0.5em;
	 border-radius: 20px;
	 color: #000;
	 margin-top: -3em;
}
 .screen-1 .email input {
	 outline: none;
	 border: none;
}
 .screen-1 .email input::placeholder {
	 color: #000;
	 font-size: 0.9em;
}
 .screen-1 .email ion-icon {
	 color: #000;
	 margin-bottom: -0.2em;
}
 .screen-1 .password {
	 background: #000;
	 box-shadow: 0 0 2em #000;
	 padding: 1em;
	 display: flex;
	 flex-direction: column;
	 gap: 0.5em;
	 border-radius: 20px;
	 color: #000;
}
 .screen-1 .password input {
	 outline: none;
	 border: none;
}
 .screen-1 .password input::placeholder {
	 color: #000;
	 font-size: 0.9em;
}
 .screen-1 .password ion-icon {
	 color: #000;
	 margin-bottom: -0.2em;
}
 .screen-1 .password .show-hide {
	 margin-right: -5em;
}
 .screen-1 .login {
	 padding: 1em;
	 background: #000;
	 color: #000;
	 border: none;
	 border-radius: 30px;
	 font-weight: 600;
}
 .screen-1 .footer {
	 display: flex;
	 font-size: 0.7em;
	 color: #000;
	 gap: 14em;
	 padding-bottom: 10em;
}
 .screen-1 .footer span {
	 cursor: pointer;
}
 button {
	 cursor: pointer;
}
}

/*smartphone*/
@media screen and (max-width: 600px){
	* {
	 font-family: 'Poppins';
}
.working_progress{
background: var(--bg_default_screen1);
        padding: 2em;
        border-radius: 30px;
        box-shadow: 0 0 2em #000;
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
        width: 80%;
        flex-direction: column;
}
.working_progress > span{
font-size: larger;
word-break: break-word;
}

 body {
	 user-select: none;
	 /*overflow-y: hidden;*/
	 display: flex;
	 justify-content: center;
	 align-items: center;
	 background: #000;
	 height: 100vh;
}
 .screen-1 {
	 background: #000;
	 padding: 2em;
	 display: none;
	 flex-direction: column;
	 border-radius: 30px;
	 box-shadow: 0 0 2em #000;
	 gap: 2em;
}
 .screen-1 .logo {
	 margin-top: -3em;
}
 .screen-1 .email {
	 background: #000;
	 box-shadow: 0 0 2em #000;
	 padding: 1em;
	 display: flex;
	 flex-direction: column;
	 gap: 0.5em;
	 border-radius: 20px;
	 color: #000;
	 margin-top: -3em;
}
 .screen-1 .email input {
	 outline: none;
	 border: none;
}
 .screen-1 .email input::placeholder {
	 color: #000;
	 font-size: 0.9em;
}
 .screen-1 .email ion-icon {
	 color: #000;
	 margin-bottom: -0.2em;
}
 .screen-1 .password {
	 background: #000;
	 box-shadow: 0 0 2em #000;
	 padding: 1em;
	 display: flex;
	 flex-direction: column;
	 gap: 0.5em;
	 border-radius: 20px;
	 color: #000;
}
 .screen-1 .password input {
	 outline: none;
	 border: none;
}
 .screen-1 .password input::placeholder {
	 color: #000;
	 font-size: 0.9em;
}
 .screen-1 .password ion-icon {
	 color: #000;
	 margin-bottom: -0.2em;
}
 .screen-1 .password .show-hide {
	 margin-right: -5em;
}
 .screen-1 .login {
	 padding: 1em;
	 background: #000;
	 color: #000;
	 border: none;
	 border-radius: 30px;
	 font-weight: 600;
}
 .screen-1 .footer {
	 display: flex;
	 font-size: 0.7em;
	 color: #000;
	 gap: 14em;
	 padding-bottom: 10em;
}
 .screen-1 .footer span {
	 cursor: pointer;
}
 button {
	 cursor: pointer;
}
}