body{background-color:#ecf1f3}.container__register{width:100%;height:100vh;display:flex;padding-top:4rem;flex-direction:row;position:relative}.img__container__patient{& img{width:100%;height:100%;object-fit:cover}& .cape{width:100%;height:100%;background-color:rgba(62,28,118,.5);position:absolute}}.img__container__doctor,.img__container__patient{width:50%;position:relative;height:47rem;display:flex;justify-content:center;align-items:center}.img__container__doctor{left:-50%;& img{object-fit:cover}& .cape,& img{width:100%;height:100%}& .cape{background-color:rgba(62,28,118,.5);position:absolute}}.register__container__patient{width:50%;padding:12rem 4rem 2rem;display:flex;justify-content:center;flex-direction:column;& .register__container{display:flex;flex-direction:column;border-radius:.5rem;border:1px solid transparent;box-shadow:-4px -2px 46px -1px rgba(0,0,0,.3);background-color:#fcfcfc;justify-content:center;align-items:center;h2{text-align:center;padding:2rem 0 0}}}.register__container__doctor{width:50%;position:relative;left:50%;padding:14rem 4rem 2rem;display:flex;justify-content:center;flex-direction:column;& .register__container{display:flex;flex-direction:column;border-radius:.5rem;border:1px solid transparent;box-shadow:-4px -2px 46px -1px rgba(0,0,0,.3);background-color:#fcfcfc;justify-content:center;align-items:center;h2{text-align:center;padding:2rem 0 0}}}.form__container{display:grid;grid-template-columns:1fr 1fr;grid-column-gap:2.5rem;padding:2rem;justify-content:center}.input__container{position:relative;display:flex;flex-direction:column;margin:.5rem;& input{width:100%;-moz-appearance:none;appearance:none;-webkit-appearance:none;padding:.5rem;border-radius:.5rem;border:1px solid #a7a7a7;margin-top:.5rem;background-color:transparent;color:#6031ae;outline:none;font-size:1em}& input:focus{border:1px solid #b99aee}& input[type=date]{background:#d8c5f7;outline:none;color:#fff;border-color:#d8c5f7;&::-webkit-calendar-picker-indicator{color:#fff;cursor:pointer;padding:5px}&:focus,&:valid{background-color:#b99aee;border-color:#b99aee}}& span{position:absolute;left:0;padding:1rem;pointer-events:none;font-size:.7em;color:#a7a7a7;text-transform:uppercase;transition:.2s}& span[class=date]{transform:translateX(10px) translateY(-1px);font-size:.65em;padding:0 10px;background:#fff;border:1px solid #a7a7a7;color:#a7a7a7;border-radius:2px}& input:focus~span,& input:valid~span{color:#b99aee;transform:translateX(10px) translateY(-1px);font-size:.65em;padding:0 10px;background:#b99aee;color:#fff;border-radius:2px}& select{padding:.5rem;border-radius:.5rem;border:1px solid #dedede;margin-top:.5rem;background:transparent;color:#000}}.buttons__form{display:flex;justify-content:center;gap:1rem;padding:0 0 2rem;& button{width:10rem;padding:.75rem;border-radius:.5rem;border:none;margin-top:.5rem;background:#b99aee;color:#fff}& button:nth-child(2){background:#ececec;color:#000;&:hover{background:#dedede}}& button:hover{background:#966bdd}}