.label-bold{font-weight:700}:root{--dark-blue: #123877;--orange: #ff7a00;--blue: rgb(29, 123, 255);--gray: rgb(100, 100, 100)}.container{padding:0 2rem;display:flex;flex-flow:row nowrap;gap:1rem;height:100vh;justify-content:space-evenly;align-items:center}.container *{margin:0}.container>div{width:30%}.image{background-image:url(https://demo.hardinjobmela.com/log.png);background-size:contain;background-repeat:no-repeat;margin-top:8rem;width:43%;height:70%}.intro{display:flex;flex-direction:column;justify-content:center;align-items:center}.intro>div{text-align:center;padding:1rem;font-size:1.5rem}.intro h1:nth-child(1){color:var(--orange)}.intro h1:nth-child(2){color:var(--dark-blue)}.intro .strip{color:var(--orange);width:60%;height:.4rem;background-color:var(--orange);border-radius:1rem;margin:.5rem auto}.form{display:flex;justify-content:center;align-items:center}.form form{padding:3rem 1.5rem;display:flex;flex-direction:column;font-size:1.2rem;gap:1.5rem;box-shadow:0 0 5px gray;min-width:300px;width:80%;max-width:500px}.form form .header{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:5%}.form form .header img{max-height:3rem}.form form h3,.form form .login>a{color:var(--gray)}.form form .email,.form form .password{display:flex;flex-direction:column;gap:.5rem}.form form .email input,.form form .password input{border-radius:.5rem;border:1px solid var(--blue)}.form form .email input:hover,.form form .password input:hover{box-shadow:0 0 5px var(--blue)}.form form .login{font-size:1.3rem;display:flex;flex-direction:column;justify-content:center;gap:1rem}.form form .login button{color:#fff;font-size:1rem;border-radius:.5rem;border:none;margin:0;font-weight:700;justify-content:center}.form form .login button:nth-child(3){align-self:center}.form form .login>a{font-weight:600;text-align:center;text-decoration:none}@media screen and (max-width: 1150px){.container{padding:0 1.5rem;min-height:100vh;height:auto}.container>div{width:45%}.form form{min-width:300px}.form form,.form form>div>input{font-size:1rem}.intro>div{font-size:1.2rem}.form form .login button{font-size:1.2rem}}@media screen and (max-width: 830px){.container{padding:0 1rem}.intro{display:none}.form{margin-top:inherit}.form form,.form form>div>input{font-size:.8rem}.intro>div{font-size:1rem}.form form .login button{font-size:1rem}#first-head,#second-head{font-size:large}}@media screen and (max-width: 700px){.container{flex-direction:column;padding:1rem .5rem}.container>div{width:70%}.form form,.form form>div>input{font-size:.8rem}.intro>div{font-size:1rem}#first-head,#second-head{font-size:large}}@media screen and (max-width: 550px){.container>div{width:90%}}@media screen and (max-width: 400px){.container>div{width:95%}#first-head,#second-head{font-size:large}}