@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap");.bgc{background:#fff linear-gradient(90deg,#e2e2e2,rgba(0,0,0,.8))}.section-body{display:flex;align-items:center;justify-content:center;flex-direction:column;height:1000px}.flex{display:flex;flex-direction:row}.container3{width:768px;max-width:100%;min-height:680px}.container3,.container3-mobile{background-color:#fff;border-radius:30px;box-shadow:0 5px 15px rgba(0,0,0,.35);position:relative;overflow:hidden}.container3-mobile{height:950px;max-height:80%;min-width:400px}.container3 p,.container3-mobile p{font-size:14px;line-height:20px;letter-spacing:.3px;margin:20px 0}.container3 span,.container3-mobile span{font-size:12pt}.container3 a{color:#333;font-size:13px;text-decoration:none;margin:15px 0 10px}.container3 button,.container3-mobile button{background-color:#000;color:#fff;font-size:12px;padding:10px 45px;border:1px solid transparent;border-radius:8px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;margin-top:10px;cursor:pointer}.container3 button.hidden,.container3-mobile button.hidden{background-color:transparent;border-color:#fff}.container3 form{padding:0 40px;height:100%}.container3 form,.container3-mobile form{background-color:#fff;display:flex;align-items:center;justify-content:center;flex-direction:column}.container3-mobile form{padding:40px 0;width:100%}.container3 input{margin:8px 0}.container3 input,.container3-mobile input{background-color:#eee;border:none;padding:10px 15px;font-size:13px;border-radius:8px;width:100%;outline:none}.container3-mobile input{margin:8px}.form-container{top:0;height:100%}.form-container,.form-container-mobile{position:absolute;transition:all .6s ease-in-out}.form-container-mobile{left:0;width:100%}.sign-in{left:0;width:50%;z-index:2}.sign-in-mobile{top:0;height:100%;z-index:2}.container3.active .sign-in{transform:translateX(100%)}.container3-mobile.active .sign-in-mobile{transform:translateY(100%)}.sign-up{left:0;width:50%;opacity:0;z-index:1}.sign-up-mobile{top:0;height:50%;opacity:0;z-index:1}.container3.active .sign-up{transform:translateX(100%);opacity:1;z-index:5;animation:move .6s}.container3-mobile.active .sign-up-mobile{transform:translateY(100%);opacity:1;z-index:5;animation:move .6s}@keyframes move{0%,49.99%{opacity:0;z-index:1}50%,to{opacity:1;z-index:5}}.social-icons{margin:20px 0}.social-icons a{border:1px solid #ccc;border-radius:20%;display:inline-flex;justify-content:center;align-items:center;margin:0 3px;width:40px;height:40px}.toggle-container{top:0;left:50%;width:50%;height:100%;border-radius:150px 0 0 100px}.toggle-container,.toggle-container-mobile{position:absolute;overflow:hidden;transition:all .6s ease-in-out;z-index:1000}.toggle-container-mobile{top:50%;left:0;width:100%;height:50%;border-radius:50px 75px 0 0}.container3.active .toggle-container{transform:translateX(-100%);border-radius:0 150px 100px 0}.container3-mobile.active .toggle-container-mobile{transform:translateY(-100%);border-radius:0 0 75px 50px}.toggle{background:#000 linear-gradient(90deg,silver,#383838);left:-100%;height:100%;width:200%;transform:translateX(0)}.toggle,.toggle-mobile{color:#fff;position:relative;transition:all .6s ease-in-out}.toggle-mobile{background:#000 linear-gradient(180deg,silver,#383838);top:-100%;width:100%;height:200%;transform:translateY(0)}.container3.active .toggle{transform:translateX(50%)}.container3-mobile.active .toggle-mobile{transform:translateY(50%)}.toggle-panel{width:50%;height:100%;padding:0 30px;top:0;transform:translateX(0)}.toggle-panel,.toggle-panel-mobile{position:absolute;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;transition:all .6s ease-in-out}.toggle-panel-mobile{width:100%;height:50%;padding:30px 0;left:0;transform:translateY(0)}.toggle-left{transform:translateX(-200%)}.toggle-left-mobile{transform:translateY(-200%)}.container3.active .toggle-left{transform:translateX(0)}.container3-mobile.active .toggle-left-mobile{transform:translateY(0)}.toggle-right{right:0;transform:translateX(0)}.toggle-right-mobile{bottom:0;transform:translateY(0)}.container3.active .toggle-right{transform:translateX(200%)}.container3-mobile.active .toggle-right-mobile{transform:translateY(200%)}