/* 界面主体 */
html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
}

body {
    --BG-0: #b7d0ff;
    --BG-1: rgb(143 144 226 / 30%);
    --YG-0: #f7da55;
    --YG-1: rgb(243 208 39 / 30%);
}

body {
    margin: 0;
    background: var(--BG-0);
}

code {
    display: block;
    text-align: center;
    color: #ca4440;
    font-size: 90%;
    padding: 0;
    white-space: nowrap;
}

input:focus {
    outline: none;
}

    input:focus::-webkit-input-placeholder {
        opacity: 0;
        -webkit-transition-duration: 0.25s;
        transition-duration: 0.25s;
    }

    input:focus::-moz-placeholder {
        opacity: 0;
        -webkit-transition-duration: 0.25s;
        transition-duration: 0.25s;
    }

    input:focus:-ms-input-placeholder {
        opacity: 0;
        -webkit-transition-duration: 0.25s;
        transition-duration: 0.25s;
    }

.login-form {
    background: #eee;
    width: 26%;
    margin: 9% auto 4% auto;
    position: relative;
    -webkit-border-radius: 0.4em;
    -moz-border-radius: 0.4em;
    box-shadow: var(--BG-1) 1px 1px, var(--BG-1) 2px 2px, var(--BG-1) 3px 3px, var(--BG-1) 4px 4px, var(--BG-1) 5px 5px, var(--BG-1) 6px 6px, var(--BG-1) 7px 7px, var(--BG-1) 8px 8px, var(--BG-1) 9px 9px, var(--BG-1) 10px 10px, var(--BG-1) 11px 11px, var(--BG-1) 12px 12px, var(--BG-1) 13px 13px, var(--BG-1) 14px 14px, var(--BG-1) 15px 15px, var(--BG-1) 16px 16px, var(--BG-1) 17px 17px, var(--BG-1) 18px 18px, var(--BG-1) 19px 19px, var(--BG-1) 20px 20px, var(--BG-1) 21px 21px, var(--BG-1) 22px 22px, var(--BG-1) 23px 23px, var(--BG-1) 24px 24px, var(--BG-1) 25px 25px, var(--BG-1) 26px 26px, var(--BG-1) 27px 27px, var(--BG-1) 28px 28px, var(--BG-1) 29px 29px, var(--BG-1) 30px 30px, var(--BG-1) 31px 31px, var(--BG-1) 32px 32px, var(--BG-1) 33px 33px, var(--BG-1) 34px 34px, var(--BG-1) 35px 35px, var(--BG-1) 36px 36px, var(--BG-1) 37px 37px, var(--BG-1) 38px 38px, var(--BG-1) 39px 39px, var(--BG-1) 40px 40px, var(--BG-1) 41px 41px, var(--BG-1) 42px 42px, var(--BG-1) 43px 43px, var(--BG-1) 44px 44px, var(--BG-1) 45px 45px, var(--BG-1) 46px 46px, var(--BG-1) 47px 47px, var(--BG-1) 48px 48px, var(--BG-1) 49px 49px, var(--BG-1) 50px 50px, var(--BG-1) 51px 51px, var(--BG-1) 52px 52px, var(--BG-1) 53px 53px, var(--BG-1) 54px 54px, var(--BG-1) 55px 55px, var(--BG-1) 56px 56px, var(--BG-1) 57px 57px, var(--BG-1) 58px 58px, var(--BG-1) 59px 59px, var(--BG-1) 60px 60px, var(--BG-1) 61px 61px, var(--BG-1) 62px 62px, var(--BG-1) 63px 63px, var(--BG-1) 64px 64px, var(--BG-1) 65px 65px, var(--BG-1) 66px 66px, var(--BG-1) 67px 67px, var(--BG-1) 68px 68px, var(--BG-1) 69px 69px, var(--BG-1) 70px 70px, var(--BG-1) 71px 71px, var(--BG-1) 72px 72px, var(--BG-1) 73px 73px, var(--BG-1) 74px 74px, var(--BG-1) 75px 75px, var(--BG-1) 76px 76px, var(--BG-1) 77px 77px, var(--BG-1) 78px 78px, var(--BG-1) 79px 79px, var(--BG-1) 80px 80px, var(--BG-1) 81px 81px, var(--BG-1) 82px 82px, var(--BG-1) 83px 83px, var(--BG-1) 84px 84px, var(--BG-1) 85px 85px, var(--BG-1) 86px 86px, var(--BG-1) 87px 87px, var(--BG-1) 88px 88px, var(--BG-1) 89px 89px, var(--BG-1)90px 90px, var(--BG-1)91px 91px, var(--BG-1)92px 92px, var(--BG-1)93px 93px, var(--BG-1)94px 94px, var(--BG-1) 95px 95px, var(--BG-1) 96px 96px, var(--BG-1) 97px 97px, var(--BG-1) 98px 98px, var(--BG-1) 99px 99px, var(--BG-1) 100px 100px, var(--BG-1) 101px 101px, var(--BG-1) 102px 102px, var(--BG-1) 103px 103px, var(--BG-1) 104px 104px, var(--BG-1) 105px 105px, var(--BG-1) 106px 106px, var(--BG-1) 107px 107px, var(--BG-1) 108px 108px, var(--BG-1) 109px 109px, var(--BG-1) 110px 110px, var(--BG-1) 111px 111px, var(--BG-1) 112px 112px, var(--BG-1) 113px 113px, var(--BG-1) 114px 114px, var(--BG-1) 115px 115px, var(--BG-1) 116px 116px, var(--BG-1) 117px 117px, var(--BG-1) 118px 118px, var(--BG-1) 119px 119px, var(--BG-1) 120px 120px, var(--BG-1) 121px 121px, var(--BG-1) 122px 122px, var(--BG-1) 123px 123px, var(--BG-1) 124px 124px, var(--BG-1) 125px 125px, var(--BG-1) 126px 126px, var(--BG-1) 127px 127px, var(--BG-1) 128px 128px, var(--BG-1) 129px 129px, var(--BG-1) 130px 130px, var(--BG-1) 131px 131px, var(--BG-1) 132px 132px, var(--BG-1)133px 133px, var(--BG-1)134px 134px, var(--BG-1)135px 135px, var(--BG-1) 136px 136px, var(--BG-1) 137px 137px, var(--BG-1) 138px 138px, var(--BG-1) 139px 139px, var(--BG-1) 140px 140px, var(--BG-1) 141px 141px, var(--BG-1) 142px 142px, var(--BG-1) 143px 143px, var(--BG-1) 144px 144px, var(--BG-1) 145px 145px, var(--BG-1) 146px 146px, var(--BG-1) 147px 147px, var(--BG-1) 148px 148px, var(--BG-1) 149px 149px, var(--BG-1) 150px 150px, var(--BG-1) 151px 151px, var(--BG-1) 152px 152px, var(--BG-1) 153px 153px, var(--BG-1) 154px 154px, var(--BG-1) 155px 155px, var(--BG-1) 156px 156px, var(--BG-1) 157px 157px, var(--BG-1) 158px 158px, var(--BG-1) 159px 159px, var(--BG-1) 160px 160px, var(--BG-1) 161px 161px, var(--BG-1) 162px 162px, var(--BG-1) 163px 163px, var(--BG-1) 164px 164px, var(--BG-1) 165px 165px, var(--BG-1) 166px 166px, var(--BG-1) 167px 167px, var(--BG-1) 168px 168px, var(--BG-1) 169px 169px, var(--BG-1) 170px 170px, var(--BG-1) 171px 171px, var(--BG-1) 172px 172px, var(--BG-1) 173px 173px, var(--BG-1) 174px 174px, var(--BG-1) 175px 175px, var(--BG-1) 176px 176px, var(--BG-1) 177px 177px, var(--BG-1) 178px 178px, var(--BG-1) 179px 179px, var(--BG-1) 180px 180px, var(--BG-1) 181px 181px, var(--BG-1) 182px 182px
}

.head {
    position: absolute;
    top: -15%;
    left: 35%;
}

    .head img {
        width: 120px;
        height: 120px;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border: 6px solid rgba(221, 218, 215, 0.23);
    }

.main {
    position: relative;
}

.main h1 {
    font-size: 25px;
    color: #676767;
    font-family: sans-serif;
    font-weight: 400;
    padding-top: 19%;
    text-align: center;
}

.main form {
    width: 80%;
    margin: 0 auto;
    padding: 6% 0 9% 0;
}

.main p {
    text-align: center;
}

.main form p a {
    color: #888;
    font-family: sans-serif;
}

form p a:hover {
    color: #21A957;
}

input[type="text"], input[type="password"] {
    text-align: left;
    position: relative;
    width: 92%;
    padding: 3%;
    background: #D3D3D3;
    margin-bottom: 6%;
    font-family: sans-serif;
    color: #676767;
    font-weight: 600;
    font-size: 16px;
    outline: none;
    border: none;
    border-radius: 5px;
    border: 1px solid #DED6D6;
    -webkit-appearance: none;
}

    input[type="text"]:hover, input[type="password"]:hover {
        border: 1px solid #949494;
        transition: 0.5s;
        -webkit-transition: 0.5s;
        -moz-transition: 0.5s;
        -o-transition: 0.5s;
    }

    input[type="text"]:focus, input[type="password"]:focus {
        background-color: white;
    }

input[type="button"] {
    width: 99%;
    padding: 3%;
    margin-bottom: 8%;
    background: #21A957;
    font-family: sans-serif;
    color: #ECECEC;
    box-shadow: inset 0px 0px 10px #666464;
    font-size: 20px;
    outline: none;
    border: none;
    cursor: pointer;
    font-weight: 500;
    border-radius: 5px;
    transition: 0.5s;
    -webkit-appearance: none;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
}

    input[type="button"]:hover {
        background: #128A42;
        color: #fff;
    }
/* 响应式 */
@media (max-width:1440px) {
    .login-form {
        width: 30%;
        margin: 11% auto 4% auto;
    }

    .main h1 {
        padding-top: 23%;
    }

    .copy-right {
        bottom: -26%;
    }
}

@media (max-width:1366px) {
    .login-form {
        width: 32%;
        margin: 10% auto 4% auto;
    }
}

@media (max-width:1280px) {
    .login-form {
        margin: 8% auto 0;
        width: 34%;
        box-shadow: var(--BG-1) 1px 1px, var(--BG-1) 2px 2px, var(--BG-1) 3px 3px, var(--BG-1) 4px 4px, var(--BG-1) 5px 5px, var(--BG-1) 6px 6px, var(--BG-1) 7px 7px, var(--BG-1) 8px 8px, var(--BG-1) 9px 9px, var(--BG-1) 10px 10px, var(--BG-1) 11px 11px, var(--BG-1) 12px 12px, var(--BG-1) 13px 13px, var(--BG-1) 14px 14px, var(--BG-1) 15px 15px, var(--BG-1) 16px 16px, var(--BG-1) 17px 17px, var(--BG-1) 18px 18px, var(--BG-1) 19px 19px, var(--BG-1) 20px 20px, var(--BG-1) 21px 21px, var(--BG-1) 22px 22px, var(--BG-1) 23px 23px, var(--BG-1) 24px 24px, var(--BG-1) 25px 25px, var(--BG-1) 26px 26px, var(--BG-1) 27px 27px, var(--BG-1) 28px 28px, var(--BG-1) 29px 29px, var(--BG-1) 30px 30px, var(--BG-1) 31px 31px, var(--BG-1) 32px 32px, var(--BG-1) 33px 33px, var(--BG-1) 34px 34px, var(--BG-1) 35px 35px, var(--BG-1) 36px 36px, var(--BG-1) 37px 37px, var(--BG-1) 38px 38px, var(--BG-1) 39px 39px, var(--BG-1) 40px 40px, var(--BG-1) 41px 41px, var(--BG-1) 42px 42px, var(--BG-1) 43px 43px, var(--BG-1) 44px 44px, var(--BG-1) 45px 45px, var(--BG-1) 46px 46px, var(--BG-1) 47px 47px, var(--BG-1) 48px 48px, var(--BG-1) 49px 49px, var(--BG-1) 50px 50px, var(--BG-1) 51px 51px, var(--BG-1) 52px 52px, var(--BG-1) 53px 53px, var(--BG-1) 54px 54px, var(--BG-1) 55px 55px, var(--BG-1) 56px 56px, var(--BG-1) 57px 57px, var(--BG-1) 58px 58px, var(--BG-1) 59px 59px, var(--BG-1) 60px 60px, var(--BG-1) 61px 61px, var(--BG-1) 62px 62px, var(--BG-1) 63px 63px, var(--BG-1) 64px 64px, var(--BG-1) 65px 65px, var(--BG-1) 66px 66px, var(--BG-1) 67px 67px, var(--BG-1) 68px 68px, var(--BG-1) 69px 69px, var(--BG-1) 70px 70px, var(--BG-1) 71px 71px, var(--BG-1) 72px 72px, var(--BG-1) 73px 73px, var(--BG-1) 74px 74px, var(--BG-1) 75px 75px, var(--BG-1) 76px 76px, var(--BG-1) 77px 77px, var(--BG-1) 78px 78px, var(--BG-1) 79px 79px, var(--BG-1) 80px 80px, var(--BG-1) 81px 81px, var(--BG-1) 82px 82px, var(--BG-1) 83px 83px, var(--BG-1) 84px 84px, var(--BG-1) 85px 85px, var(--BG-1) 86px 86px, var(--BG-1) 87px 87px, var(--BG-1) 88px 88px, var(--BG-1) 89px 89px, var(--BG-1)90px 90px, var(--BG-1)91px 91px, var(--BG-1)92px 92px, var(--BG-1)93px 93px, var(--BG-1)94px 94px, var(--BG-1) 95px 95px, var(--BG-1) 96px 96px, var(--BG-1) 97px 97px, var(--BG-1) 98px 98px, var(--BG-1) 99px 99px, var(--BG-1) 100px 100px, var(--BG-1) 101px 101px, var(--BG-1) 102px 102px, var(--BG-1) 103px 103px, var(--BG-1) 104px 104px, var(--BG-1) 105px 105px, var(--BG-1) 106px 106px, var(--BG-1) 107px 107px, var(--BG-1) 108px 108px, var(--BG-1) 109px 109px, var(--BG-1) 110px 110px, var(--BG-1) 111px 111px, var(--BG-1) 112px 112px, var(--BG-1) 113px 113px, var(--BG-1) 114px 114px, var(--BG-1) 115px 115px, var(--BG-1) 116px 116px, var(--BG-1) 117px 117px, var(--BG-1) 118px 118px, var(--BG-1) 119px 119px, var(--BG-1) 120px 120px, var(--BG-1) 121px 121px, var(--BG-1) 122px 122px, var(--BG-1) 123px 123px, var(--BG-1) 124px 124px, var(--BG-1) 125px 125px, var(--BG-1) 126px 126px, var(--BG-1) 127px 127px, var(--BG-1) 128px 128px, var(--BG-1) 129px 129px, var(--BG-1) 130px 130px, var(--BG-1) 131px 131px, var(--BG-1) 132px 132px, var(--BG-1)133px 133px, var(--BG-1)134px 134px, var(--BG-1)135px 135px, var(--BG-1) 136px 136px, var(--BG-1) 137px 137px, var(--BG-1) 138px 138px, var(--BG-1) 139px 139px, var(--BG-1) 140px 140px, var(--BG-1) 141px 141px, var(--BG-1) 142px 142px, var(--BG-1) 143px 143px, var(--BG-1) 144px 144px, var(--BG-1) 145px 145px, var(--BG-1) 146px 146px, var(--BG-1) 147px 147px, var(--BG-1) 148px 148px, var(--BG-1) 149px 149px, var(--BG-1) 150px 150px
    }
}

@media (max-width:1024px) {
    .login-form {
        margin: 12% auto 0;
        width: 45%;
        box-shadow: var(--BG-1) 1px 1px, var(--BG-1) 2px 2px, var(--BG-1) 3px 3px, var(--BG-1) 4px 4px, var(--BG-1) 5px 5px, var(--BG-1) 6px 6px, var(--BG-1) 7px 7px, var(--BG-1) 8px 8px, var(--BG-1) 9px 9px, var(--BG-1) 10px 10px, var(--BG-1) 11px 11px, var(--BG-1) 12px 12px, var(--BG-1) 13px 13px, var(--BG-1) 14px 14px, var(--BG-1) 15px 15px, var(--BG-1) 16px 16px, var(--BG-1) 17px 17px, var(--BG-1) 18px 18px, var(--BG-1) 19px 19px, var(--BG-1) 20px 20px, var(--BG-1) 21px 21px, var(--BG-1) 22px 22px, var(--BG-1) 23px 23px, var(--BG-1) 24px 24px, var(--BG-1) 25px 25px, var(--BG-1) 26px 26px, var(--BG-1) 27px 27px, var(--BG-1) 28px 28px, var(--BG-1) 29px 29px, var(--BG-1) 30px 30px, var(--BG-1) 31px 31px, var(--BG-1) 32px 32px, var(--BG-1) 33px 33px, var(--BG-1) 34px 34px, var(--BG-1) 35px 35px, var(--BG-1) 36px 36px, var(--BG-1) 37px 37px, var(--BG-1) 38px 38px, var(--BG-1) 39px 39px, var(--BG-1) 40px 40px, var(--BG-1) 41px 41px, var(--BG-1) 42px 42px, var(--BG-1) 43px 43px, var(--BG-1) 44px 44px, var(--BG-1) 45px 45px, var(--BG-1) 46px 46px, var(--BG-1) 47px 47px, var(--BG-1) 48px 48px, var(--BG-1) 49px 49px, var(--BG-1) 50px 50px, var(--BG-1) 51px 51px, var(--BG-1) 52px 52px, var(--BG-1) 53px 53px, var(--BG-1) 54px 54px, var(--BG-1) 55px 55px, var(--BG-1) 56px 56px, var(--BG-1) 57px 57px, var(--BG-1) 58px 58px, var(--BG-1) 59px 59px, var(--BG-1) 60px 60px, var(--BG-1) 61px 61px, var(--BG-1) 62px 62px, var(--BG-1) 63px 63px, var(--BG-1) 64px 64px, var(--BG-1) 65px 65px, var(--BG-1) 66px 66px, var(--BG-1) 67px 67px, var(--BG-1) 68px 68px, var(--BG-1) 69px 69px, var(--BG-1) 70px 70px, var(--BG-1) 71px 71px, var(--BG-1) 72px 72px, var(--BG-1) 73px 73px, var(--BG-1) 74px 74px, var(--BG-1) 75px 75px, var(--BG-1) 76px 76px, var(--BG-1) 77px 77px, var(--BG-1) 78px 78px, var(--BG-1) 79px 79px, var(--BG-1) 80px 80px, var(--BG-1) 81px 81px, var(--BG-1) 82px 82px, var(--BG-1) 83px 83px, var(--BG-1) 84px 84px, var(--BG-1) 85px 85px, var(--BG-1) 86px 86px, var(--BG-1) 87px 87px, var(--BG-1) 88px 88px, var(--BG-1) 89px 89px, var(--BG-1)90px 90px, var(--BG-1)91px 91px, var(--BG-1)92px 92px, var(--BG-1)93px 93px, var(--BG-1)94px 94px, var(--BG-1) 95px 95px, var(--BG-1) 96px 96px, var(--BG-1) 97px 97px, var(--BG-1) 98px 98px, var(--BG-1) 99px 99px, var(--BG-1) 100px 100px, var(--BG-1) 101px 101px, var(--BG-1) 102px 102px, var(--BG-1) 103px 103px, var(--BG-1) 104px 104px, var(--BG-1) 105px 105px, var(--BG-1) 106px 106px, var(--BG-1) 107px 107px, var(--BG-1) 108px 108px, var(--BG-1) 109px 109px, var(--BG-1) 110px 110px, var(--BG-1) 111px 111px, var(--BG-1) 112px 112px, var(--BG-1) 113px 113px, var(--BG-1) 114px 114px, var(--BG-1) 115px 115px, var(--BG-1) 116px 116px, var(--BG-1) 117px 117px, var(--BG-1) 118px 118px, var(--BG-1) 119px 119px, var(--BG-1) 120px 120px, var(--BG-1) 121px 121px, var(--BG-1) 122px 122px, var(--BG-1) 123px 123px, var(--BG-1) 124px 124px, var(--BG-1) 125px 125px, var(--BG-1) 126px 126px, var(--BG-1) 127px 127px, var(--BG-1) 128px 128px, var(--BG-1) 129px 129px, var(--BG-1) 130px 130px, var(--BG-1) 131px 131px, var(--BG-1) 132px 132px, var(--BG-1)133px 133px, var(--BG-1)134px 134px, var(--BG-1)135px 135px, var(--BG-1) 136px 136px, var(--BG-1) 137px 137px, var(--BG-1) 138px 138px, var(--BG-1) 139px 139px, var(--BG-1) 140px 140px, var(--BG-1) 141px 141px, var(--BG-1) 142px 142px, var(--BG-1) 143px 143px, var(--BG-1) 144px 144px, var(--BG-1) 145px 145px, var(--BG-1) 146px 146px, var(--BG-1) 147px 147px, var(--BG-1) 148px 148px, var(--BG-1) 149px 149px, var(--BG-1) 150px 150px
    }
}

@media (max-width:768px) {
    .login-form {
        margin: 16% auto 0;
        width: 59%;
    }
}

@media (max-width:640px) {
    .login-form {
        margin: 20% auto 0;
        width: 63%;
    }
}

@media (max-width:480px) {
    .login-form {
        margin: 32% auto 0;
        width: 74%;
        box-shadow: var(--BG-1) 1px 1px, var(--BG-1) 2px 2px, var(--BG-1) 3px 3px, var(--BG-1) 4px 4px, var(--BG-1) 5px 5px, var(--BG-1) 6px 6px, var(--BG-1) 7px 7px, var(--BG-1) 8px 8px, var(--BG-1) 9px 9px, var(--BG-1) 10px 10px, var(--BG-1) 11px 11px, var(--BG-1) 12px 12px, var(--BG-1) 13px 13px, var(--BG-1) 14px 14px, var(--BG-1) 15px 15px, var(--BG-1) 16px 16px, var(--BG-1) 17px 17px, var(--BG-1) 18px 18px, var(--BG-1) 19px 19px, var(--BG-1) 20px 20px, var(--BG-1) 21px 21px, var(--BG-1) 22px 22px, var(--BG-1) 23px 23px, var(--BG-1) 24px 24px, var(--BG-1) 25px 25px, var(--BG-1) 26px 26px, var(--BG-1) 27px 27px, var(--BG-1) 28px 28px, var(--BG-1) 29px 29px, var(--BG-1) 30px 30px, var(--BG-1) 31px 31px, var(--BG-1) 32px 32px, var(--BG-1) 33px 33px, var(--BG-1) 34px 34px, var(--BG-1) 35px 35px, var(--BG-1) 36px 36px, var(--BG-1) 37px 37px, var(--BG-1) 38px 38px, var(--BG-1) 39px 39px, var(--BG-1) 40px 40px, var(--BG-1) 41px 41px, var(--BG-1) 42px 42px, var(--BG-1) 43px 43px, var(--BG-1) 44px 44px, var(--BG-1) 45px 45px, var(--BG-1) 46px 46px, var(--BG-1) 47px 47px, var(--BG-1) 48px 48px, var(--BG-1) 49px 49px, var(--BG-1) 50px 50px, var(--BG-1) 51px 51px, var(--BG-1) 52px 52px, var(--BG-1) 53px 53px, var(--BG-1) 54px 54px, var(--BG-1) 55px 55px, var(--BG-1) 56px 56px, var(--BG-1) 57px 57px, var(--BG-1) 58px 58px, var(--BG-1) 59px 59px, var(--BG-1) 60px 60px, var(--BG-1) 61px 61px, var(--BG-1) 62px 62px, var(--BG-1) 63px 63px, var(--BG-1) 64px 64px, var(--BG-1) 65px 65px, var(--BG-1) 66px 66px, var(--BG-1) 67px 67px, var(--BG-1) 68px 68px, var(--BG-1) 69px 69px, var(--BG-1) 70px 70px, var(--BG-1) 71px 71px, var(--BG-1) 72px 72px, var(--BG-1) 73px 73px, var(--BG-1) 74px 74px, var(--BG-1) 75px 75px, var(--BG-1) 76px 76px, var(--BG-1) 77px 77px, var(--BG-1) 78px 78px, var(--BG-1) 79px 79px, var(--BG-1) 80px 80px, var(--BG-1) 81px 81px, var(--BG-1) 82px 82px, var(--BG-1) 83px 83px, var(--BG-1) 84px 84px, var(--BG-1) 85px 85px, var(--BG-1) 86px 86px, var(--BG-1) 87px 87px, var(--BG-1) 88px 88px, var(--BG-1) 89px 89px, var(--BG-1)90px 90px, var(--BG-1)91px 91px, var(--BG-1)92px 92px, var(--BG-1)93px 93px, var(--BG-1)94px 94px, var(--BG-1) 95px 95px, var(--BG-1) 96px 96px, var(--BG-1) 97px 97px, var(--BG-1) 98px 98px, var(--BG-1) 99px 99px, var(--BG-1) 100px 100px, var(--BG-1) 101px 101px, var(--BG-1) 102px 102px, var(--BG-1) 103px 103px, var(--BG-1) 104px 104px, var(--BG-1) 105px 105px, var(--BG-1) 106px 106px, var(--BG-1) 107px 107px, var(--BG-1) 108px 108px, var(--BG-1) 109px 109px, var(--BG-1) 110px 110px
    }

    .copy-right {
        left: 30%;
        bottom: -17%;
    }

    .main h1 {
        font-size: 22px;
    }

    .head img {
        width: 90px;
        height: 90px;
    }

    .head {
        top: -15%;
        left: 34%;
    }

    input[type="text"], input[type="password"], input[type="button"] {
        font-weight: 600;
        margin-bottom: 4%;
    }
}

@media (max-width:320px) {
    .login-form {
        margin: 20% auto 0;
        width: 85%;
        box-shadow: var(--BG-1) 1px 1px, var(--BG-1) 2px 2px, var(--BG-1) 3px 3px, var(--BG-1) 4px 4px, var(--BG-1) 5px 5px, var(--BG-1) 6px 6px, var(--BG-1) 7px 7px, var(--BG-1) 8px 8px, var(--BG-1) 9px 9px, var(--BG-1) 10px 10px, var(--BG-1) 11px 11px, var(--BG-1) 12px 12px, var(--BG-1) 13px 13px, var(--BG-1) 14px 14px, var(--BG-1) 15px 15px, var(--BG-1) 16px 16px, var(--BG-1) 17px 17px, var(--BG-1) 18px 18px, var(--BG-1) 19px 19px, var(--BG-1) 20px 20px, var(--BG-1) 21px 21px, var(--BG-1) 22px 22px, var(--BG-1) 23px 23px, var(--BG-1) 24px 24px, var(--BG-1) 25px 25px, var(--BG-1) 26px 26px, var(--BG-1) 27px 27px, var(--BG-1) 28px 28px, var(--BG-1) 29px 29px, var(--BG-1) 30px 30px, var(--BG-1) 31px 31px, var(--BG-1) 32px 32px, var(--BG-1) 33px 33px, var(--BG-1) 34px 34px, var(--BG-1) 35px 35px, var(--BG-1) 36px 36px, var(--BG-1) 37px 37px, var(--BG-1) 38px 38px, var(--BG-1) 39px 39px, var(--BG-1) 40px 40px, var(--BG-1) 41px 41px, var(--BG-1) 42px 42px, var(--BG-1) 43px 43px, var(--BG-1) 44px 44px, var(--BG-1) 45px 45px, var(--BG-1) 46px 46px, var(--BG-1) 47px 47px, var(--BG-1) 48px 48px, var(--BG-1) 49px 49px, var(--BG-1) 50px 50px, var(--BG-1) 51px 51px, var(--BG-1) 52px 52px, var(--BG-1) 53px 53px, var(--BG-1) 54px 54px, var(--BG-1) 55px 55px, var(--BG-1) 56px 56px, var(--BG-1) 57px 57px, var(--BG-1) 58px 58px, var(--BG-1) 59px 59px, var(--BG-1) 60px 60px, var(--BG-1) 61px 61px, var(--BG-1) 62px 62px, var(--BG-1) 63px 63px, var(--BG-1) 64px 64px, var(--BG-1) 65px 65px
    }

    .main h1 {
        padding-top: 20%;
        font-size: 20px;
    }

    .head img {
        width: 60px;
        height: 60px;
        border: 5px solid rgba(221, 218, 215, 0.23);
    }

    .head {
        top: -15%;
        left: 36%;
    }

    input[type="text"], input[type="password"], input[type="button"] {
        font-weight: 600;
        font-size: 15px;
    }

    .main form p a {
        font-size: 15px;
    }

    input[type="button"] {
        padding: 4%;
    }
}