@import"https://fonts.googleapis.com/css?family=Montserrat:400,800";.my-contact-form body{background:#f6f5f7;display:flex;justify-content:center;align-items:center;flex-direction:column;font-family:Montserrat,sans-serif;height:100vh;margin:-20px 0 50px}.my-contact-form h1{font-weight:700;margin:0}.my-contact-form h2{text-align:center}.my-contact-form a{color:#0c1529;text-decoration:underline;margin:5px 0}.my-contact-form button{border-radius:50px;border:1px solid #2a6ddf;box-shadow:0 0 0 4px #2a6ddf33;color:#fff;height:45px;padding:8px;letter-spacing:1px;transition:transform 80ms ease-in;width:100%}.my-contact-form button:active{transform:scale(.95)}.my-contact-form button:focus{outline:none}.my-contact-form button:not(.ghost){background-color:#2aab9f;width:100%;background:-webkit-linear-gradient(to right,#2aab9f,#2a6ddf);background:linear-gradient(to right,#2aab9f,#2a6ddf)}.my-contact-form button.ghost{background-color:#fff;width:100%;border:1px solid #2a6ddf;border-color:#fff;color:#2a6ddf}.my-contact-form form{background-color:#fff;display:flex;gap:15px;align-items:center;justify-content:center;flex-direction:column;padding:0 50px;height:100%;text-align:center}.my-contact-form input{background-color:#fff;border:1px solid #2a6ddf;border-radius:50px;padding:12px 15px;margin:10px 0;width:100%;height:45px;font-size:16px}.container{background-color:#fff;border-radius:10px;box-shadow:0 0 20px 2px #ebf2ffcc;position:relative;overflow:hidden;height:600px;width:62.5%;max-width:100%;min-height:480px}.form-container{position:absolute;top:0;height:100%;transition:all .6s ease-in-out}.sign-in-container{left:0;width:50%;z-index:2}.container.right-panel-active .sign-in-container{transform:translate(100%)}.sign-up-container{left:0;width:50%;opacity:0;z-index:1}.container.right-panel-active .sign-up-container{transform:translate(100%);opacity:1;z-index:5;animation:show .6s}@keyframes show{0%,49.99%{opacity:0;z-index:1}50%,to{opacity:1;z-index:5}}.overlay-container{position:absolute;top:0;left:50%;width:50%;height:100%;overflow:hidden;transition:transform .6s ease-in-out;z-index:100}.container.right-panel-active .overlay-container{transform:translate(-100%)}.overlay{background:#2aab9f;background:-webkit-linear-gradient(to right,#2a6ddf,#2aab9f,#2a6ddf);background:linear-gradient(to right,#2a6ddf,#2aab9f,#2a6ddf);background-repeat:no-repeat;background-size:cover;background-position:0 0;color:#fff;position:relative;left:-100%;height:100%;width:200%;transform:translate(0);transition:transform .6s ease-in-out}.container.right-panel-active .overlay{transform:translate(50%)}.overlay-panel{position:absolute;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:0 40px;text-align:center;top:0;height:100%;width:50%;transform:translate(0);transition:transform .6s ease-in-out}.container.right-panel-active .overlay-left{transform:translate(0)}.overlay-right{right:0;transform:translate(0)}.container.right-panel-active .overlay-right{transform:translate(20%)}.social-container{margin:20px 0}.social-container a{border:1px solid #dddddd;border-radius:50%;display:inline-flex;justify-content:center;align-items:center;margin:0 5px;height:40px;width:40px}@media (max-width: 1200px){.container{width:88%}}@media (max-width: 768px){.container{height:1000px;width:100%;border-radius:0;box-shadow:unset}.sign-up-container,.sign-in-container{width:100%}.form-container{top:0;height:50%}.overlay-container{bottom:0;top:unset;width:100%;left:unset;height:50%}.container.right-panel-active .sign-up-container{transform:translate(0);animation:unset}.container.right-panel-active .overlay-container{transform:translate(0)}.my-contact-form form,.overlay-panel{padding:0 25px}}