*{padding:0;box-sizing:border-box;margin:0;font-family:Roboto,sans-serif}.loginRegist .containers{overflow:hidden;min-height:100vh;position:relative;max-width:100%;background-size:cover;background-color:var(--bg-color);background-image:url(https://marvanti.info/assets/images/register.jpg);background-repeat:no-repeat}.loginRegist .containers:before{height:2000px;transform:translateY(-50%);right:48%;transition:1.8s ease-in-out;content:"";position:absolute;top:-10%;border-radius:50%;background:linear-gradient(-45deg,var(--bg-round-a),var(--bg-round-b));background:var(--ambed-black,#3c3531);width:2000px;z-index:6}.loginRegist .forms-containers{height:100%;position:absolute;top:0;left:0;width:100%}.loginRegist .signin-signup{transform:translate(-50%,-50%);grid-template-columns:1fr;transition:1s ease-in-out .7s;position:absolute;top:50%;left:75%;width:50%;display:grid;z-index:5}.loginRegist #popUpBox,.loginRegist .btn-modal{transform:translate(-50%,-50%);position:absolute;top:50%;background:pink;left:50%}.loginRegist form{overflow:hidden;grid-column:1/2;padding:0 5rem;justify-content:center;grid-row:1/2;transition:.2s ease-in-out .7s;flex-direction:column;align-items:center;display:flex}.loginRegist form.sign-in-form{z-index:2}.loginRegist .containers.sign-up-mode form.sign-in-form,.loginRegist form.sign-up-form{opacity:0;z-index:1}.loginRegist .btn-modal{padding:10px 30px;font-size:20px;color:#fff;cursor:pointer}.loginRegist #popUpBox{overflow:hidden;padding:10px;text-align:center;box-shadow:0 0 10px #000;border-radius:10px;width:500px;display:none;z-index:9999}.loginRegist .title{font-size:2.2rem;font-weight:600;margin-bottom:10px;color:var(--ambed-black,#a47c68)}.loginRegist .input-field{height:55px;grid-template-columns:15% 70% 15%;padding:0 .4rem;margin:10px 0;box-shadow:0 1px 4px rgba(0,0,0,.16);border-radius:55px;background:#fdfbfe;background:#ffffff26;width:85%;display:grid}.loginRegist .input-field i{font-size:1.1rem;color:var(--ambed-black,#a47c68);text-align:center;line-height:55px}.loginRegist .key{text-decoration:none;color:var(--key-color)}.loginRegist .key:hover,.loginRegist .pass:hover{color:var(--pass-hover-color)}.loginRegist .pass{color:var(--pass-color);margin:12px 0}.loginRegist #togglePassword,.loginRegist #toggleReg{color:var(--input-icon);text-align:center}.loginRegist .input-field input{font-size:1.1rem;border:none;font-weight:600;color:var(--ambed-black,#a47c68);outline:0;background:0 0;line-height:1}.loginRegist .input-field input::placeholder{font-weight:500;color:var(--input-hover)}.loginRegist .btn{height:49px;font-size:13px;border:none;font-weight:600;color:var(--btn-text);color:#fff;transition:.5s;text-transform:uppercase;outline:0;background-color:var(--ambed-base,#a47c68);margin:10px 0;box-shadow:none!important;border-radius:49px;cursor:pointer;width:150px}.loginRegist .btn:hover{background-color:var(--warning,#a47c68)}.loginRegist .check{font-size:16px;position:relative;margin:12px 0;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:block}.loginRegist .checkmark{color:var(--check-text)}.loginRegist .checkmark a{text-decoration:underline;color:var(--check-link)}.loginRegist .checkmark a:hover{color:var(--check-hover)}.loginRegist .social-text{padding:.7rem 0;font-size:1rem;color:var(--social-text)}.loginRegist .icon-mode,.loginRegist .social-icon{text-decoration:none;color:var(--icon-color);transition:.3s;display:flex}.loginRegist .social-media{justify-content:center;display:flex}.loginRegist .social-icon{height:46px;justify-content:center;font-size:1.1rem;border:1px solid var(--icon-color);margin:0 .45rem;align-items:center;border-radius:50%;width:46px}.loginRegist .icon-mode:hover,.loginRegist .social-icon:hover{border-color:var(--social-icon);color:var(--social-icon)}.loginRegist .icon-mode{height:32px;justify-content:center;font-size:1rem;border:1px solid var(--icon-color);margin:40px 5px 0;align-items:center;border-radius:50%;width:32px}.loginRegist .text-mode{padding:.5rem 0;font-size:.8rem;font-style:italic;color:var(--social-text)}.loginRegist .panels-containers{height:100%;grid-template-columns:repeat(2,1fr);position:absolute;top:0;left:0;width:100%;display:grid}.loginRegist .panel{justify-content:space-around;flex-direction:column;text-align:center;align-items:flex-end;display:flex;z-index:7}.loginRegist .left-panel{pointer-events:all;padding:0 17% 19rem 12%}.loginRegist .right-panel{pointer-events:none;padding:3rem 12% 2rem 17%}.loginRegist .panel .content{color:#fff;transition:.9s ease-in-out .6s;text-align:center}.loginRegist .panel h3{font-size:1.5rem;font-weight:600;color:#fff;line-height:2}.loginRegist .panel p{padding:.7rem 0;font-size:.95rem}.loginRegist .btn.transparent{height:41px;font-size:.8rem;border:2px solid #fff;font-weight:600;margin:0;background:0 0;width:150px}.loginRegist .image{transition:1.1s ease-in-out .4s;width:90%;margin-top:10px}.loginRegist .right-panel .content,.loginRegist .right-panel .image{transform:translateX(800px)}.loginRegist .containers.sign-up-mode:before{transform:translate(100%,-50%);right:52%}.loginRegist .containers.sign-up-mode .left-panel .content,.loginRegist .containers.sign-up-mode .left-panel .image{transform:translateX(-800px)}.loginRegist .containers.sign-up-mode .right-panel .content,.loginRegist .containers.sign-up-mode .right-panel .image{transform:translateX(0)}.loginRegist .containers.sign-up-mode .left-panel{pointer-events:none}.loginRegist .containers.sign-up-mode .right-panel{pointer-events:all}.loginRegist .containers.sign-up-mode .signin-signup{left:25%}.loginRegist .containers.sign-up-mode form.sign-up-form{opacity:1;z-index:2}.keyboard{padding:5px 0;transition:bottom .4s;position:fixed;bottom:0;box-shadow:0 0 50px rgba(0,0,0,.5);background:var(--keyboard-color);left:0;width:100%;user-select:none;z-index:999}.keyboard--hidden{bottom:-100%}.keyboard__keys{text-align:center}.keyboard__key{-webkit-tap-highlight-color:transparent;height:45px;padding:0;justify-content:center;font-size:1.05rem;border:none;color:var(--key-letter);position:relative;max-width:90px;outline:0;margin:3px;align-items:center;border-radius:4px;background:hsla(0,0%,100%,.2);cursor:pointer;width:6%;vertical-align:top;display:inline-flex}.keyboard__key:active{background:hsla(0,0%,100%,.12)}.keyboard__key--wide{width:12%}.keyboard__key--extra-wide{max-width:500px;width:36%}.keyboard__key--activatable:after{height:8px;right:10px;content:"";position:absolute;top:10px;border-radius:50%;background:rgba(0,0,0,.4);width:8px}.keyboard__key--active:after{background:#08ff00}.keyboard__key--dark{background:rgba(0,0,0,.25)}@media (max-width:870px){.loginRegist .containers{height:100vh;min-height:800px}.loginRegist .containers:before{height:1500px;transform:translateX(-50%);right:auto;transition:2s ease-in-out;bottom:68%;top:auto;left:30%;width:1500px}.loginRegist .signin-signup{transform:translate(-50%,-100%);transition:1s ease-in-out .8s;top:95%;left:50%;width:100%}.loginRegist .panels-containers{grid-template-columns:1fr;grid-template-rows:1fr 2fr 1fr}.loginRegist .panel{padding:2.5rem 8%;justify-content:space-around;flex-direction:row;align-items:center}.loginRegist .panel .content{transition:.9s ease-in-out .8s;padding-right:15%}.loginRegist .panel h3{font-size:1.2rem}.loginRegist .panel p{padding:.5rem 0;font-size:.7rem}.loginRegist .btn.transparent{height:35px;font-size:.7rem;width:135px}.loginRegist .image{display:none}.loginRegist .left-panel{grid-row:1/2}.loginRegist .right-panel{grid-row:3/4}.loginRegist .right-panel .content,.loginRegist .right-panel .image{transform:translateY(300px)}.loginRegist .containers.sign-up-mode:before{transform:translate(-50%,100%);right:auto;bottom:32%}.loginRegist .containers.sign-up-mode .left-panel .content,.loginRegist .containers.sign-up-mode .left-panel .image{transform:translateY(-300px)}.loginRegist .containers.sign-up-mode .signin-signup{transform:translate(-50%);top:5%;left:50%}.loginRegist .key,.loginRegist .keyboard{font-size:.1px;opacity:0;visibility:hidden}}@media (max-width:570px){.loginRegist form{padding:0 1.5rem}.loginRegist .image,.loginRegist .panel p{display:none}.loginRegist .panel .content{padding:.5rem 1rem}.loginRegist .containers:before{bottom:75%;left:50%}.loginRegist .containers.sign-up-mode:before{bottom:24%;left:50%}.loginRegist .field-icon{position:relative;margin-left:300px;float:right;margin-top:-55px;z-index:1}}@media (max-width:385px){.loginRegist .field-icon{position:relative;margin-left:260px;float:right;margin-top:-55px;z-index:1}}@media (max-width:350px){.loginRegist .field-icon{position:relative;margin-left:200px;float:right;margin-top:-55px;z-index:1}}