index.html
<!DOCTYPE html><html lang="zxx"><head> <title>xxx注册</title> <!-- Meta tags --> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <!-- Google fonts --> <link href="static/css/css2.css" rel="stylesheet"> <!-- CSS Stylesheet --> <link rel="stylesheet" href="static/css/style.css" type="text/css" media="all"> <!-- fontawesome v5--> <script src="static/js/af562a2a63.js" crossorigin="anonymous"></script></head><body> <div class="signinform"> <h1>xxx注册</h1> <!-- container --> <div class="container"> <!-- main content --> <div class="w3l-form-info"> <div class="w3l_form"> <div class="left_grid_info"> <img src="static/picture/haibao.png" alt=""> </div> </div> <div class="w3_info"> <h2>用户注册</h2> <form action="#" method="post"> <div class="form-group"> <span><i class="fas fa-user" aria-hidden="true"></i></span> <input type="text" placeholder="姓名" id="name" name="name" required> </div> <div class="form-group"> <span><i class="fas fa-key" aria-hidden="true"></i></span> <input type="Password" placeholder="密码" id="password" name="password" required> </div> <div class="form-group"> <select id="sex" name="sex" placeholder="性别" required> <option value="">请进行选择</option> <option value="male">男</option> <option value="female">女</option> <option value="other">其他</option> </select> </div> <div class="form-group"> <input type="number" placeholder="年龄" id="age" name="age" required> </div> <div class="form-group"> <input type="text" placeholder="组别" id="group" name="group" required> </div> <div class="form-group"> <input type="tel" placeholder="联系电话" id="phone" name="phone" required> </div> <button class="btn btn-last btn-block" type="button" id="returnIndex"><a href="index.html">返回首页</a></button> </form> <button class="btn btn-primary btn-block" type="submit">注册</button> </form> </div> </a> </div> </div> </div> <!-- //main content --> </div> <!-- //container --> <!-- footer --> <!-- footer --> </div></body></html>
css(css2)
/* math */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 300; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShMzVo0iPw.woff2) format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0330, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2034-2037, U+2057, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2102, U+210A-210E, U+2110-2112, U+2115, U+2119-211D, U+2124, U+2128, U+212C-212D, U+212F-2131, U+2133-2138, U+213C-2140, U+2145-2149, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B6, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;}/* symbols */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 300; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShMhVo0iPw.woff2) format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8B1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA88, U+1FA90-1FABD, U+1FABF-1FAC5, U+1FACE-1FADB, U+1FAE0-1FAE8, U+1FAF0-1FAF8, U+1FB00-1FBFF;}/* latin-ext */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 300; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShNBVo0iPw.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}/* latin */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 300; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShNPVo0.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}/* math */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShMzVo0iPw.woff2) format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0330, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2034-2037, U+2057, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2102, U+210A-210E, U+2110-2112, U+2115, U+2119-211D, U+2124, U+2128, U+212C-212D, U+212F-2131, U+2133-2138, U+213C-2140, U+2145-2149, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B6, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;}/* symbols */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShMhVo0iPw.woff2) format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8B1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA88, U+1FA90-1FABD, U+1FABF-1FAC5, U+1FACE-1FADB, U+1FAE0-1FAE8, U+1FAF0-1FAF8, U+1FB00-1FBFF;}/* latin-ext */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShNBVo0iPw.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}/* latin */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShNPVo0.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}/* math */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShMzVo0iPw.woff2) format('woff2'); unicode-range: U+0302-0303, U+0305, U+0307-0308, U+0330, U+0391-03A1, U+03A3-03A9, U+03B1-03C9, U+03D1, U+03D5-03D6, U+03F0-03F1, U+03F4-03F5, U+2034-2037, U+2057, U+20D0-20DC, U+20E1, U+20E5-20EF, U+2102, U+210A-210E, U+2110-2112, U+2115, U+2119-211D, U+2124, U+2128, U+212C-212D, U+212F-2131, U+2133-2138, U+213C-2140, U+2145-2149, U+2190, U+2192, U+2194-21AE, U+21B0-21E5, U+21F1-21F2, U+21F4-2211, U+2213-2214, U+2216-22FF, U+2308-230B, U+2310, U+2319, U+231C-2321, U+2336-237A, U+237C, U+2395, U+239B-23B6, U+23D0, U+23DC-23E1, U+2474-2475, U+25AF, U+25B3, U+25B7, U+25BD, U+25C1, U+25CA, U+25CC, U+25FB, U+266D-266F, U+27C0-27FF, U+2900-2AFF, U+2B0E-2B11, U+2B30-2B4C, U+2BFE, U+FF5B, U+FF5D, U+1D400-1D7FF, U+1EE00-1EEFF;}/* symbols */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShMhVo0iPw.woff2) format('woff2'); unicode-range: U+0001-000C, U+000E-001F, U+007F-009F, U+20DD-20E0, U+20E2-20E4, U+2150-218F, U+2190, U+2192, U+2194-2199, U+21AF, U+21E6-21F0, U+21F3, U+2218-2219, U+2299, U+22C4-22C6, U+2300-243F, U+2440-244A, U+2460-24FF, U+25A0-27BF, U+2800-28FF, U+2921-2922, U+2981, U+29BF, U+29EB, U+2B00-2BFF, U+4DC0-4DFF, U+FFF9-FFFB, U+10140-1018E, U+10190-1019C, U+101A0, U+101D0-101FD, U+102E0-102FB, U+10E60-10E7E, U+1D2C0-1D2D3, U+1D2E0-1D37F, U+1F000-1F0FF, U+1F100-1F1AD, U+1F1E6-1F1FF, U+1F30D-1F30F, U+1F315, U+1F31C, U+1F31E, U+1F320-1F32C, U+1F336, U+1F378, U+1F37D, U+1F382, U+1F393-1F39F, U+1F3A7-1F3A8, U+1F3AC-1F3AF, U+1F3C2, U+1F3C4-1F3C6, U+1F3CA-1F3CE, U+1F3D4-1F3E0, U+1F3ED, U+1F3F1-1F3F3, U+1F3F5-1F3F7, U+1F408, U+1F415, U+1F41F, U+1F426, U+1F43F, U+1F441-1F442, U+1F444, U+1F446-1F449, U+1F44C-1F44E, U+1F453, U+1F46A, U+1F47D, U+1F4A3, U+1F4B0, U+1F4B3, U+1F4B9, U+1F4BB, U+1F4BF, U+1F4C8-1F4CB, U+1F4D6, U+1F4DA, U+1F4DF, U+1F4E3-1F4E6, U+1F4EA-1F4ED, U+1F4F7, U+1F4F9-1F4FB, U+1F4FD-1F4FE, U+1F503, U+1F507-1F50B, U+1F50D, U+1F512-1F513, U+1F53E-1F54A, U+1F54F-1F5FA, U+1F610, U+1F650-1F67F, U+1F687, U+1F68D, U+1F691, U+1F694, U+1F698, U+1F6AD, U+1F6B2, U+1F6B9-1F6BA, U+1F6BC, U+1F6C6-1F6CF, U+1F6D3-1F6D7, U+1F6E0-1F6EA, U+1F6F0-1F6F3, U+1F6F7-1F6FC, U+1F700-1F7FF, U+1F800-1F80B, U+1F810-1F847, U+1F850-1F859, U+1F860-1F887, U+1F890-1F8AD, U+1F8B0-1F8B1, U+1F900-1F90B, U+1F93B, U+1F946, U+1F984, U+1F996, U+1F9E9, U+1FA00-1FA6F, U+1FA70-1FA7C, U+1FA80-1FA88, U+1FA90-1FABD, U+1FABF-1FAC5, U+1FACE-1FADB, U+1FAE0-1FAE8, U+1FAF0-1FAF8, U+1FB00-1FBFF;}/* latin-ext */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShNBVo0iPw.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}/* latin */@font-face { font-family: 'Kumbh Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(../font/c4mw1n92AsfhuCq6tVsaoIx1LQICk0boNoq0ShNPVo0.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
css(style)
/* reset code */html { scroll-behavior: smooth;}body,html { margin: 0; padding: 0; color: #585858;}* { box-sizing: border-box; font-family: 'Kumbh Sans', sans-serif;}/* wrapper */.wrapper { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto;}@media (min-width: 576px) { .wrapper { max-width: 540px; }}@media (min-width: 768px) { .wrapper { max-width: 720px; }}@media (min-width: 992px) { .wrapper { max-width: 960px; }}@media (min-width: 1200px) { .wrapper { max-width: 1140px; }}/* /wrapper */.d-grid { display: grid;}button,input,select { -webkit-appearance: none; outline: none;}button,.btn,select { cursor: pointer;}a { text-decoration: none;}h1,h2,h3,h4,h5,h6,p,ul,ol { margin: 0; padding: 0;}body { background: #f1f1f1; margin: 0; padding: 0;}form,fieldset { border: 0; padding: 0; margin: 0;}img { max-width: 100%;}/*-- //Reset-Code --*//*-- form styling --*/.signinform { padding: 40px 40px; justify-content: center; display: grid; grid-template-rows: 1fr auto 1fr; align-items: center; min-height: 100vh;}input[type="text"],input[type="Password"],input[type="number"],input[type="text"],input[type="tel"]{ font-size: 17px; font-weight: 500; color: #999; text-align: left; padding: 14px 15px 12px 35px; width: 100%; display: inline-block; box-sizing: border-box; border: none; outline: none; background: transparent; letter-spacing: .5px;}.input-group { margin-bottom: 25px; padding: 0px 0px; border-bottom: 1px solid #e5e5e5; position: relative;}.btn-block { display: block; width: 50%; margin: 0 auto;}.btn:active { outline: none;}.btn-primary { color: #fff; background-color: #6769e8; margin-top: 30px; outline: none; width: 100%; padding: 15px 15px; cursor: pointer; font-size: 18px; font-weight: 600; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; border: none; text-transform: capitalize;}.btn-primary:hover { background-color: #5d9af5; color: #fff;}.btn-last { color: #76a8f4; background-color: #ebe8e8; margin-top: 30px; outline: none; width: 100%; padding: 15px 15px; cursor: pointer; font-size: 18px; font-weight: 600; border-radius: 30px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; border: none; text-transform: capitalize;}.btn-last:hover { background-color: #9eaeec; color: #fff;}.form-row.bottom { display: flex; justify-content: space-between;}.form-row .form-check input[type="checkbox"] { display: none;}.form-row .form-check input[type="checkbox"]+label:before { border-radius: 3px; border: 1px solid #e2e2e2; color: transparent; content: "\2714"; display: inline-block; height: 18px; margin-right: 5px; transition: 0.2s; vertical-align: inherit; width: 18px; text-align: center; line-height: 20px;}.form-row .form-check input[type="checkbox"]:checked+label:before { background-color: #4d61fc; border-color: #4d61fc; color: #fff;}.form-row .form-check input[type="checkbox"]+label { cursor: pointer; color: #888;}.w3_info h2 { display: inline-block; font-size: 25px; line-height: 35px; margin-bottom: 20px; font-weight: 600; color: #0b0345;}.w3_info h4 { display: inline-block; font-size: 15px; padding: 8px 0px; color: #444; text-transform: capitalize;}a.btn.btn-block.btn-social.btn-facebook { display: block; width: 100%; padding: 10px 0px; text-align: center; font-size: 16px; font-weight: 600;}h1 { text-align: center; font-size: 40px; font-weight: 500; color: #0e0553;}.w3_info { flex-basis: 50%; -webkit-flex-basis: 50%; box-sizing: border-box; padding: 3em 3.5em; background: #fff; box-shadow: 2px 9px 49px -17px rgba(0, 0, 0, 0.1);}.left_grid_info { padding: 6em 0;}.w3l-form-info { display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */ display: -ms-flexbox; /* TWEENER - IE 10 */ display: -webkit-flex; /* NEW - Chrome */ display: flex; /* NEW, Spec - Opera 12.1, Firefox 20+ */ margin: 40px 0;}.w3l_form { padding: 0px; flex-basis: 50%; -webkit-flex-basis: 50%; background: #98b5ff;}.w3_info p { padding-bottom: 30px; text-align: center;}p.account,p.account a { text-align: center; padding-top: 20px; padding-bottom: 0px; font-size: 16px; color: #888;}p.account a { color: #6769e8;}p.account a:hover { text-decoration: underline;}a.forgot { color: #3b3663; margin-top: 2px;}a.forgot:hover { text-decoration: underline;}h3.w3ls { margin: 10px 0px; padding-left: 60px;}h3.agileits { padding-left: 10px;}.container { max-width: 890px; margin: 0 auto;}.input-group i.fa,.input-group i.fas { font-size: 16px; vertical-align: middle; box-sizing: border-box; float: left; width: 6%; margin-top: 13px; text-align: center; color: #999; opacity: .5; position: absolute; left: 0;}h5 { text-align: center; margin: 10px 0px; font-size: 15px; font-weight: 600; color: #000;}.footer p { text-align: center; font-size: 18px; line-height: 28px; color: #777;}.footer p a { color: #6769e8;}.footer p a:hover { text-decoration: underline;}p.continue { margin-top: 25px; padding: 0; margin-bottom: 20px; color: #999; opacity: .8;}p.continue span { position: relative;}p.continue span:before { position: absolute; content: ''; height: 1px; background: #999; width: 89%; left: -100%; top: 5px; opacity: .5;}p.continue span:after { position: absolute; content: ''; height: 1px; background: #999; width: 89%; right: -100%; top: 5px; opacity: .5;}.social-login { display: grid; grid-auto-flow: column; grid-gap: 20px; margin-bottom: 10px;}.facebook { padding: 13px 20px; border: 2px solid #3b5998; border-radius: 35px; text-align: center; font-size: 16px; color: #3b5998;}.facebook:hover { background: #3b5998; color: #fff;}.google { padding: 13px 20px; border: 2px solid #ea4335; border-radius: 35px; text-align: center; font-size: 16px; color: #ea4335;}.google:hover { background: #ea4335; color: #fff;}.facebook span { margin-right: 5px;}.google span { margin-right: 5px;}::-webkit-input-placeholder { /* Edge */ color: #aaa;}:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #aaa;}::placeholder { color: #aaa;}/** Responsive **/@media screen and (max-width: 1440px) {}@media screen and (max-width: 1080px) { .w3_info { padding: 3em 3em; }}@media screen and (max-width: 1024px) { .left_grid_info h3 { font-size: 2em; }}@media screen and (max-width: 991px) { .w3_info h2 { font-size: 24px; } h1 { font-size: 35px; }}@media screen and (max-width: 900px) { .left_grid_info h4 { font-size: 1em; } .w3_info { padding: 3em 2.5em; }}@media screen and (max-width: 800px) { .w3_info h2 { font-size: 23px; } .w3l-form-info { flex-direction: column; } .w3l_form { order: 2; } .container { max-width: 550px; } .left_grid_info { padding: 3em 3em; }}@media screen and (max-width: 768px) { .left_grid_info { padding: 9em 3em; }}@media screen and (max-width: 736px) { .w3_info h2 { font-size: 22px; } .w3_info { padding: 3em 2em; }}@media screen and (max-width: 667px) { .left_grid_info { padding: 3em 3em; } .w3_info { padding: 3em 3em; } .w3l-form-info { margin: 20px 0 30px; }}@media screen and (max-width: 640px) { h1 { font-size: 37px; }}@media screen and (max-width: 480px) { .w3l_form { padding: 0em; } .w3_info { padding: 2em 2em; } h1 { font-size: 34px; }}@media screen and (max-width: 415px) { h1 { font-size: 32px; } .left_grid_info p { font-size: 13px; } .signinform { padding: 40px 20px; }}@media screen and (max-width: 384px) { .signinform { padding: 30px 15px; } .social-login { grid-auto-flow: row; }}@media screen and (max-width: 375px) { .left_grid_info h3 { font-size: 1.5em; } .form-row.bottom { flex-direction: column; } a.forgot { margin-top: 17px; }}@media screen and (max-width: 320px) { h1 { font-size: 25px; } .w3_info h2 { font-size: 18px; } .btn-primary { padding: 13px 12px; font-size: 13px; } input[type="text"], input[type="email"], input[type="password"] { font-size: 13px; } .footer p { font-size: 13px; } .footer p a { font-size: 13px; }}/** /Responsive **//*-- //form styling --*/
js
window.FontAwesomeKitConfig = {"id":15632227,"version":"5.15.4","token":"af562a2a63","method":"css","baseUrl":"https://ka-f.fontawesome.com","license":"free","asyncLoading":{"enabled":true},"autoA11y":{"enabled":true},"baseUrlKit":"https://kit.fontawesome.com","detectConflictsUntil":null,"iconUploads":{},"minify":{"enabled":true},"v4FontFaceShim":{"enabled":true},"v4shim":{"enabled":true},"v5FontFaceShim":{"enabled":false}};!function(t){"function"==typeof define&&define.amd?define("kit-loader",t):t()}((function(){"use strict";function t(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}function e(e){for(var n=1;n<arguments.length;n++){var o=null!=arguments[n]?arguments[n]:{};n%2?t(Object(o),!0).forEach((function(t){r(e,t,o[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(o)):t(Object(o)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(o,t))}))}return e}function n(t){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function r(t,e,n){return(e=function(t){var e=function(t,e){if("object"!=typeof t||null===t)return t;var n=t[Symbol.toPrimitive];if(void 0!==n){var r=n.call(t,e||"default");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}(t,"string");return"symbol"==typeof e?e:String(e)}(e))in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function o(t,e){return function(t){if(Array.isArray(t))return t}(t)||function(t,e){var n=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=n){var r,o,i,a,c=[],u=!0,f=!1;try{if(i=(n=n.call(t)).next,0===e){if(Object(n)!==n)return;u=!1}else for(;!(u=(r=i.call(n)).done)&&(c.push(r.value),c.length!==e);u=!0);}catch(t){f=!0,o=t}finally{try{if(!u&&null!=n.return&&(a=n.return(),Object(a)!==a))return}finally{if(f)throw o}}return c}}(t,e)||function(t,e){if(!t)return;if("string"==typeof t)return i(t,e);var n=Object.prototype.toString.call(t).slice(8,-1);"Object"===n&&t.constructor&&(n=t.constructor.name);if("Map"===n||"Set"===n)return Array.from(t);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return i(t,e)}(t,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(t,e){(null==e||e>t.length)&&(e=t.length);for(var n=0,r=new Array(e);n<e;n++)r[n]=t[n];return r}var a="sharp",c=["classic","duotone","sharp"],u=["fak","fa-kit","fakd","fa-kit-duotone"],f=["fa","fas","fa-solid","far","fa-regular","fal","fa-light","fat","fa-thin","fad","fa-duotone","fab","fa-brands","fass","fasr","fasl","fast"];function s(t,e){var n=e&&e.addOn||"",r=e&&e.baseFilename||t.license+n,o=e&&e.minify?".min":"",i=e&&e.fileSuffix||t.method,a=e&&e.subdir||t.method;return t.baseUrl+"/releases/"+("latest"===t.version?"latest":"v".concat(t.version))+"/"+a+"/"+r+o+"."+i}function d(t,e){var n=e||["fa"],r="."+Array.prototype.join.call(n,",."),o=t.querySelectorAll(r);Array.prototype.forEach.call(o,(function(e){var n=e.getAttribute("title");e.setAttribute("aria-hidden","true");var r=!e.nextElementSibling||!e.nextElementSibling.classList.contains("sr-only");if(n&&r){var o=t.createElement("span");o.innerHTML=n,o.classList.add("sr-only"),e.parentNode.insertBefore(o,e.nextSibling)}}))}var l,h=function(){},m="undefined"!=typeof global&&void 0!==global.process&&"function"==typeof global.process.emit,p="undefined"==typeof setImmediate?setTimeout:setImmediate,v=[];function b(){for(var t=0;t<v.length;t++)v[t][0](v[t][1]);v=[],l=!1}function y(t,e){v.push([t,e]),l||(l=!0,p(b,0))}function g(t){var e=t.owner,n=e._state,r=e._data,o=t[n],i=t.then;if("function"==typeof o){n="fulfilled";try{r=o(r)}catch(t){O(i,t)}}w(i,r)||("fulfilled"===n&&A(i,r),"rejected"===n&&O(i,r))}function w(t,e){var r;try{if(t===e)throw new TypeError("A promises callback cannot return that same promise.");if(e&&("function"==typeof e||"object"===n(e))){var o=e.then;if("function"==typeof o)return o.call(e,(function(n){r||(r=!0,e===n?S(t,n):A(t,n))}),(function(e){r||(r=!0,O(t,e))})),!0}}catch(e){return r||O(t,e),!0}return!1}function A(t,e){t!==e&&w(t,e)||S(t,e)}function S(t,e){"pending"===t._state&&(t._state="settled",t._data=e,y(E,t))}function O(t,e){"pending"===t._state&&(t._state="settled",t._data=e,y(P,t))}function j(t){t._then=t._then.forEach(g)}function E(t){t._state="fulfilled",j(t)}function P(t){t._state="rejected",j(t),!t._handled&&m&&global.process.emit("unhandledRejection",t._data,t)}function _(t){global.process.emit("rejectionHandled",t)}function F(t){if("function"!=typeof t)throw new TypeError("Promise resolver "+t+" is not a function");if(this instanceof F==!1)throw new TypeError("Failed to construct 'Promise': Please use the 'new' operator, this object constructor cannot be called as a function.");this._then=[],function(t,e){function n(t){O(e,t)}try{t((function(t){A(e,t)}),n)}catch(t){n(t)}}(t,this)}F.prototype={constructor:F,_state:"pending",_then:null,_data:void 0,_handled:!1,then:function(t,e){var n={owner:this,then:new this.constructor(h),fulfilled:t,rejected:e};return!e&&!t||this._handled||(this._handled=!0,"rejected"===this._state&&m&&y(_,this)),"fulfilled"===this._state||"rejected"===this._state?y(g,n):this._then.push(n),n.then},catch:function(t){return this.then(null,t)}},F.all=function(t){if(!Array.isArray(t))throw new TypeError("You must pass an array to Promise.all().");return new F((function(e,n){var r=[],o=0;function i(t){return o++,function(n){r[t]=n,--o||e(r)}}for(var a,c=0;c<t.length;c++)(a=t[c])&&"function"==typeof a.then?a.then(i(c),n):r[c]=a;o||e(r)}))},F.race=function(t){if(!Array.isArray(t))throw new TypeError("You must pass an array to Promise.race().");return new F((function(e,n){for(var r,o=0;o<t.length;o++)(r=t[o])&&"function"==typeof r.then?r.then(e,n):e(r)}))},F.resolve=function(t){return t&&"object"===n(t)&&t.constructor===F?t:new F((function(e){e(t)}))},F.reject=function(t){return new F((function(e,n){n(t)}))};var C="function"==typeof Promise?Promise:F;function I(t,e){var n=e.fetch,r=e.XMLHttpRequest,o=e.token,i=t;return o&&!function(t){return t.indexOf("kit-upload.css")>-1}(t)&&("URLSearchParams"in window?(i=new URL(t)).searchParams.set("token",o):i=i+"?token="+encodeURIComponent(o)),i=i.toString(),new C((function(t,e){if("function"==typeof n)n(i,{mode:"cors",cache:"default"}).then((function(t){if(t.ok)return t.text();throw new Error("")})).then((function(e){t(e)})).catch(e);else if("function"==typeof r){var o=new r;o.addEventListener("loadend",(function(){this.responseText?t(this.responseText):e(new Error(""))}));["abort","error","timeout"].map((function(t){o.addEventListener(t,(function(){e(new Error(""))}))})),o.open("GET",i),o.send()}else{e(new Error(""))}}))}function U(t,e,n){var r=t;return[[/(url\("?)\.\.\/\.\.\/\.\./g,function(t,n){return"".concat(n).concat(e)}],[/(url\("?)\.\.\/webfonts/g,function(t,r){return"".concat(r).concat(e,"/releases/v").concat(n,"/webfonts")}],[/(url\("?)https:\/\/kit-free([^.])*\.fontawesome\.com/g,function(t,n){return"".concat(n).concat(e)}]].forEach((function(t){var e=o(t,2),n=e[0],i=e[1];r=r.replace(n,i)})),r}function k(t,n){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:function(){},o=n.document||o,i=d.bind(d,o,[].concat(f,u,c.map((function(t){return"fa-".concat(t)}))));t.autoA11y.enabled&&r(i);var a=t.subsetPath&&t.baseUrl+"/"+t.subsetPath,l=[{id:"fa-main",addOn:void 0,url:a}];if(t.v4shim&&t.v4shim.enabled&&l.push({id:"fa-v4-shims",addOn:"-v4-shims"}),t.v5FontFaceShim&&t.v5FontFaceShim.enabled&&l.push({id:"fa-v5-font-face",addOn:"-v5-font-face"}),t.v4FontFaceShim&&t.v4FontFaceShim.enabled&&l.push({id:"fa-v4-font-face",addOn:"-v4-font-face"}),!a&&t.customIconsCssPath){var h=t.customIconsCssPath.indexOf("kit-upload.css")>-1?t.baseUrlKit:t.baseUrl,m=h+"/"+t.customIconsCssPath;l.push({id:"fa-kit-upload",url:m})}var p=l.map((function(r){return new C((function(o,i){var a=r.url||s(t,{addOn:r.addOn,minify:t.minify.enabled}),c={id:r.id},u=t.subset?c:e(e(e({},n),c),{},{baseUrl:t.baseUrl,version:t.version,id:r.id,contentFilter:function(t,e){return U(t,e.baseUrl,e.version)}});I(a,n).then((function(t){o(T(t,u))})).catch(i)}))}));return C.all(p)}function T(t,e){var n=e.contentFilter||function(t,e){return t},r=document.createElement("style"),o=document.createTextNode(n(t,e));return r.appendChild(o),r.media="all",e.id&&r.setAttribute("id",e.id),e&&e.detectingConflicts&&e.detectionIgnoreAttr&&r.setAttributeNode(document.createAttribute(e.detectionIgnoreAttr)),r}function L(t,n){n.autoA11y=t.autoA11y.enabled,"pro"===t.license&&(n.autoFetchSvg=!0,n.fetchSvgFrom=t.baseUrl+"/releases/"+("latest"===t.version?"latest":"v".concat(t.version))+"/svgs",n.fetchUploadedSvgFrom=t.uploadsUrl);var r=[];return t.v4shim.enabled&&r.push(new C((function(r,o){I(s(t,{addOn:"-v4-shims",minify:t.minify.enabled}),n).then((function(t){r(x(t,e(e({},n),{},{id:"fa-v4-shims"})))})).catch(o)}))),r.push(new C((function(r,o){I(t.subsetPath&&t.baseUrl+"/"+t.subsetPath||s(t,{minify:t.minify.enabled}),n).then((function(t){var o=x(t,e(e({},n),{},{id:"fa-main"}));r(function(t,e){var n=e&&void 0!==e.autoFetchSvg?e.autoFetchSvg:void 0,r=e&&void 0!==e.autoA11y?e.autoA11y:void 0;void 0!==r&&t.setAttribute("data-auto-a11y",r?"true":"false");n&&(t.setAttributeNode(document.createAttribute("data-auto-fetch-svg")),t.setAttribute("data-fetch-svg-from",e.fetchSvgFrom),t.setAttribute("data-fetch-uploaded-svg-from",e.fetchUploadedSvgFrom));return t}(o,n))})).catch(o)}))),C.all(r)}function x(t,e){var n=document.createElement("SCRIPT"),r=document.createTextNode(t);return n.appendChild(r),n.referrerPolicy="strict-origin",e.id&&n.setAttribute("id",e.id),e&&e.detectingConflicts&&e.detectionIgnoreAttr&&n.setAttributeNode(document.createAttribute(e.detectionIgnoreAttr)),n}function M(t){var e,n=[],r=document,o=r.documentElement.doScroll,i=(o?/^loaded|^c/:/^loaded|^i|^c/).test(r.readyState);i||r.addEventListener("DOMContentLoaded",e=function(){for(r.removeEventListener("DOMContentLoaded",e),i=1;e=n.shift();)e()}),i?setTimeout(t,0):n.push(t)}function N(t){"undefined"!=typeof MutationObserver&&new MutationObserver(t).observe(document,{childList:!0,subtree:!0})}try{if(window.FontAwesomeKitConfig){var D=window.FontAwesomeKitConfig,R={detectingConflicts:D.detectConflictsUntil&&new Date<=new Date(D.detectConflictsUntil),detectionIgnoreAttr:"data-fa-detection-ignore",fetch:window.fetch,token:D.token,XMLHttpRequest:window.XMLHttpRequest,document:document},H=document.currentScript,K=H?H.parentElement:document.head;(function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return"js"===t.method?L(t,e):"css"===t.method?k(t,e,(function(t){M(t),N(t)})):void 0})(D,R).then((function(t){t.map((function(t){try{K.insertBefore(t,H?H.nextSibling:null)}catch(e){K.appendChild(t)}})),R.detectingConflicts&&H&&M((function(){H.setAttributeNode(document.createAttribute(R.detectionIgnoreAttr));var t=function(t,e){var n=document.createElement("script");return e&&e.detectionIgnoreAttr&&n.setAttributeNode(document.createAttribute(e.detectionIgnoreAttr)),n.src=s(t,{baseFilename:"conflict-detection",fileSuffix:"js",subdir:"js",minify:t.minify.enabled}),n}(D,R);document.body.appendChild(t)}))})).catch((function(t){console.error("".concat("Font Awesome Kit:"," ").concat(t))}))}}catch(a){console.error("".concat("Font Awesome Kit:"," ").concat(a))}}));
pic(自配)