.login{min-height:100vh;width:390px;background-color:#fff;display:flex;flex-flow:column;align-items:center;justify-content:center;position:absolute}.login section{display:flex;flex-flow:column;align-items:center;margin-bottom:20px;gap:40px;justify-start:flex-start}.login section .logo{animation:floatAnimation 2s infinite ease-in-out}.login img{justify-content:flex-start;width:300px;height:min-content}.login .loginButton{opacity:0;background-color:#4285f4;color:#fff;padding:15px;font-size:1.2rem;border:none;border-radius:5px;cursor:pointer;justify-content:center;width:90%;max-width:300px;animation:fadeInBut 1s ease-in-out forwards .5s,shake .5s ease-in-out 4s forwards}.login .loginButton:hover{background-color:#ef3737}.login .loginButton:active{background-color:#000}.login .loginButton img{top:2px;position:relative;user-drag:none}.login .googleG{width:20px}@keyframes fadeInBut{0%{opacity:0}to{opacity:1;transform:translate(5px)}}@keyframes shake{0%{transform:translate(0)}25%{transform:translate(-5px)}50%{transform:translate(5px)}60%{transform:translate(-5px);transform:translateY(-10px)}70%{transform:translate(5px)}80%{transform:translateY(10px);transform:translate(-10px)}to{transform:translate(5px)}}@keyframes floatAnimation{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}.balance{display:flex;flex-flow:column;padding:30px;align-items:flex-start;color:#9095a0;font-weight:400;line-height:26px;position:relative;top:5px;cursor:context-menu}.balance__symbols{display:flex;align-items:center;top:-10px;position:relative;cursor:pointer}.balance .amount{font-size:2rem;line-height:48px;font-weight:700;color:#323842;text-align:right;-webkit-number-format:"n2"}.balance .eye{width:30px}.balance .eyeContainer{top:4px;margin-left:1rem;position:relative}.banner__container{position:absolute;top:90px;padding:30px}.banner__container .banner{cursor:grab;gap:25px;display:flex;align-items:center;background-color:#f1f6fd;position:relative;right:7px;height:147px;width:342px;border-radius:8px;box-shadow:0 0 1px #171a1f26;box-shadow:0 0 2px #171a1f33;box-shadow:100px}.banner__container .banner div{display:flex;flex-flow:column;gap:40px}.banner__container .banner div .description{font-weight:700;line-height:22px;text-align:start;font-family:Arimo;color:#171a1f;width:153px}.banner__container .banner div .aButton{font-family:DM Sans;line-height:18px;font-weight:400;font-size:11px;width:109px;height:28px;border:1px solid rgb(23,26,31);color:#171a1f;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer}.banner__container .banner .bannerSVG{position:relative;top:10px}.banner__container .indicator{display:flex;position:relative;justify-content:center;top:10px;gap:5px}.banner__container .dot{width:6px;height:6px;border-radius:3px;background-color:#dee1e6}.banner__container .dot--active{background-color:#1e64dd;width:22px;height:6px;border-radius:3px}.navbar{position:relative;display:flex;justify-content:space-around;height:52px;box-shadow:0 2px 5px #171a1f2b;box-shadow:0 0 2px #171a1f33}.navbar-item{color:#565e6c;font-family:DM Sans;font-size:10px;position:relative;width:97.5px;height:52px;background-color:#fff}.navbar-item:before{content:"";display:inline-block;height:28px}.navbar-item .navSVG{position:relative}.navbar-item #paymentsImg{top:-2px}.navbar-item #exploreImg{top:2px}.navbar .active{border-top:2px solid rgb(30,100,221);color:#1e64dd;cursor:pointer}.navbar .disabled{cursor:default;color:#565e6c}.history__container{position:absolute;top:390px;padding:30px}.history__container .history{position:relative;list-style:none}.history__container .history ul{list-style:none;height:36vh;overflow-y:auto;width:350px}.history__container .history ul li{display:flex;justify-content:space-between;width:323px;height:68px;stroke-width:1px;border-bottom:1px solid #F3F4F6;padding:10px 0;margin:10px 0;cursor:pointer}.history__container .history ul li:hover{background-color:#f5fcff}.history__container .history ul .iconAndInfo{display:flex;justify-content:space-between;gap:23px}.history__container .history ul .info{display:flex;flex-flow:column;align-items:flex-start;justify-content:center}.history__container .history ul .details{color:#9095a0;font-family:DM Sans;font-size:14px;font-style:normal;font-weight:400;line-height:22px;display:flex;justify-content:flex-start;gap:5px}.history__container .history ul .charge{text-align:right;font-family:DM Sans;font-size:16px;font-style:normal;font-weight:500;line-height:26px}.history__container .history ul .positivecharge{color:#17a948}.history__container .history ul .negativecharge{color:#de3b40}.history__container .history__title{display:flex;align-items:center;justify-content:space-between;width:330px}.history__container .history__title h2{font-family:Arimo;font-weight:700;font-size:20px;line-height:30px;color:#171a1f}.history__container .history__title span{width:70px;height:36px;font-family:DM Sans;font-weight:400;font-size:14px;line-height:40px;color:#9095a0;cursor:pointer}.history__container .history__title span:hover{text-decoration:underline}.history__container .history .item{display:flex;align-items:center;border-bottom:1px solid #d3d3d3;padding:.5rem;margin-bottom:.5rem}.history__container .history .icon{font-size:1.5rem;margin-right:1rem}.history__container .history .name{color:#323842;font-family:Arimo;font-size:16px;font-style:normal;font-weight:400;line-height:26px;width:fit-content}.history__container .history .section{font-size:.8rem;color:gray;margin-left:.5rem}.history__container .history .date{font-size:.8rem;color:gray;margin-left:auto}.history__container .history .amount{font-size:1rem;font-weight:700;color:green}.history__container .history .amount.negative{color:red}.history__container .history .amount:before{content:attr(data-amount-symbol);margin-right:.5rem}.history__container .history .see-all{font-size:.8rem;color:gray;float:right;margin-top:1rem}.actionMenu__container{position:absolute;top:280px;width:390px;padding:30px}.actionMenu__container .actionMenu{display:flex;justify-content:space-around;align-items:center;position:relative;right:10px}.actionMenu__container .actionMenuItem{display:flex;flex-direction:column;align-items:center;text-align:center;font-family:DM Sans,sans-serif;font-weight:400;font-size:14px;line-height:22px;color:#171a1f;cursor:pointer}.actionMenu__container .actionMenuItem:before{content:"";display:block;width:52px;height:52px;border-radius:50%;border:1px solid rgb(23,26,31);margin-bottom:8px}.actionMenu__container .actionMenuItem .cloudinaryImgWrapper{position:relative;top:-50px;height:0px}.actionMenu__container .actionMenuItem .qr,.actionMenu__container .actionMenuItem .transfer{position:relative}.actionMenu__container .actionMenuItem .qr{top:4px}.actionMenu__container .actionMenuItem .transfer{top:3px}.actionMenu__container .disabled{cursor:default}.notificationProfile{width:fit-content;display:flex;position:absolute;align-self:flex-end;gap:20px;padding:30px}.notificationProfile .bell,.notificationProfile figure{cursor:pointer}.notificationProfile .profile{margin:0}.notificationProfile .profile img{max-width:28px;width:fit-content;border-radius:100%}.home{margin:0;background-color:#fff;min-height:100vh;display:flex;flex-direction:column;justify-content:space-between}.home>.header{display:flex;justify-content:space-between;align-items:center;padding:16px}.home>.header>.balance{font-size:18px;color:gray}.home>.header>.balance>.eye{cursor:pointer}.home>.header>.notifications{color:gray;font-size:20px}.home>.header>.profile{width:50px;height:50px;border-radius:50%}.home>.content{display:flex;flex-direction:column}.home>.content>.slider{width:100%;height:200px}.home>.content>.navbar{display:flex;justify-content:space-between;align-items:center;padding:16px}.home>.content>.history{padding:16px}.transaction_searchBar{position:relative;padding:24px}.transaction_searchBar .searchIcon{position:absolute;left:35px;top:50%}.transaction_searchBar input{display:flex;height:43px;width:341px;align-items:center;border-radius:22px;border:1px solid #9095A0;background:#fff;margin-top:24px;padding-left:40px;color:#171a1f;overflow:visible}.transaction_searchBar input::placeholder{color:#bcc1ca;font-family:DM Sans;font-size:16px;font-style:normal;font-weight:400;line-height:26px}.contacts_categories{display:flex;justify-content:center;align-items:center}.contacts_categories>div{display:flex;align-items:center;justify-content:center;width:160.5px;height:52px;color:#565e6c;font-family:DM Sans;font-size:14px;font-style:normal;font-weight:400;line-height:22px;cursor:pointer}.contacts_categories .active{color:#1e64dd;font-weight:700;border-bottom:4px solid #1E64DD}.newpayee__container{position:relative;padding:24px}.newpayee__container .newpayee{cursor:pointer;width:342px;height:44px;display:flex;justify-content:center;align-items:center;gap:6px;border-radius:22px;border:1px solid #1E64DD;background-color:#fff;color:#1e64dd}.newpayee__container .newpayee span{font-family:DM Sans;font-size:16px;font-style:normal;font-weight:400;line-height:26px}.newpayee__container .newpayee .newpayee_icon{position:relative;top:2px}.contacts_container{position:relative;padding:0 24px 24px;display:flex;flex-flow:column;align-items:flex-start}.contacts_container h4{color:#171a1f;font-family:Arimo;font-size:1rem;font-style:normal;font-weight:700;line-height:26px;margin-bottom:14px}.contacts_container ul{list-style:none;max-height:48vh;overflow:scroll}.contacts_container ul li{display:flex;gap:12px;align-items:center;justify-content:space-between;height:79px;border-bottom:1px solid #F3F4F6;width:352px;cursor:pointer}.contacts_container ul li:hover{background-color:#f5f5f5}.contacts_container ul li .contact_fav{padding:24px}.contacts_container ul li .imgArticle{display:flex;gap:17px}.contacts_container ul li .contact_photo{max-width:46px;border-radius:100%;border:1px double}.contacts_container ul li article{display:flex;flex-flow:column;align-items:flex-start;justify-content:center}.contacts_container ul li article .contact_name{color:#171a1f;font-family:Arimo;font-size:1rem;font-style:normal;font-weight:400;line-height:26px}.contacts_container ul li article .contact_email{color:#9095a0;font-family:DM Sans;font-size:12px;font-style:normal;font-weight:400;line-height:20px}.transaction__page{min-height:100vh;display:flex;flex-flow:column;position:absolute;background-color:#fff;width:390px}.custom_title{padding:24px 24px 0;margin-top:20px}.custom_title .back_arrow{float:left;cursor:pointer}.custom_title h2{display:inline;color:#171a1f;text-align:center;font-family:Arimo;font-size:20px;font-style:normal;font-weight:700;line-height:30px;position:relative;right:12px}.newpayee__page{min-height:100vh;position:absolute;background-color:#fff;width:390px}.newpayee__page .LOADING{width:100%;height:100%;position:absolute;background-color:#ffffff97;z-index:999999}.newpayee__page .LOADING .spinner{position:relative;top:25%}.newpayee__page .newpayee__container{display:flex;flex-flow:column}.newpayee__page .newpayee__container .starIcon{float:right;cursor:pointer}.newpayee__page .newpayee__container .profileImageIcon{width:120px;height:120px;margin-top:30px;border:1px dashed;border-radius:100%;cursor:pointer}.newpayee__page .newpayee__container form{display:flex;flex-flow:column;margin-top:50px;align-items:flex-start}.newpayee__page .newpayee__container form .emailError,.newpayee__page .newpayee__container form .nameError{font-weight:300;position:absolute;color:red}.newpayee__page .newpayee__container form .emailError{bottom:305px}.newpayee__page .newpayee__container form .nameError{bottom:200px}.newpayee__page .newpayee__container form label:not(.radio_label),.newpayee__page .newpayee__container form p{color:#171a1f;font-family:Arimo;font-size:14px;font-style:normal;font-weight:700;line-height:22px;margin-bottom:5px}.newpayee__page .newpayee__container form input:not(.radio_input){width:100%;height:50px;margin-bottom:30px;border-radius:8px;padding:24px;border:1px solid #9095A0;color:#171a1f;font-family:Arimo;font-size:18px;font-style:normal;font-weight:400;line-height:28px}.newpayee__page .newpayee__container form .radio_input{cursor:pointer;margin-left:30px;margin-bottom:80px}.newpayee__page .newpayee__container form .radio_label{padding-left:5px;color:#171a1f;font-family:DM Sans;font-size:1rem;font-style:normal;font-weight:400;line-height:22px;cursor:pointer}.newpayee__page .newpayee__container form button{position:relative;width:100%;height:44px;border:none;border-radius:22px;background:#1e64dd;cursor:pointer}.newpayee__page .newpayee__container form button:hover{background:#000}.newpayee__page .newpayee__container form button span{color:#fff;font-family:DM Sans;font-size:16px;font-style:normal;font-weight:400;line-height:26px}@keyframes spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.payee__container{display:flex;flex-flow:column;align-items:center;position:relative;margin-top:42px;margin-bottom:10px}.payee__container img{width:64px;height:64px;border:1px double;border-radius:100%}.payee__container figcaption{color:#171a1f;text-align:center;font-family:Arimo;font-size:16px;font-style:normal;font-weight:400;line-height:26px}.payee__container p{color:#9095a0;text-align:center;font-family:DM Sans;font-size:12px;font-style:normal;font-weight:400;line-height:20px}.transaction_body__container{position:relative;display:flex;flex-flow:column;align-items:flex-start;width:100%;padding:24px}.transaction_body__container label{color:#171a1f;font-family:Arimo;font-size:14px;font-style:normal;font-weight:700;line-height:22px}.transaction_body__container input,.transaction_body__container textarea,.transaction_body__container #balance{width:100%;border-radius:8px;background-color:#fff;box-shadow:none;border:1px solid #9095A0;margin-bottom:24px}.transaction_body__container #amount{display:inline-flex;padding:16px 140px 16px 24px;justify-content:center;align-items:center;height:100px;gap:54px;color:#171a1f;font-family:Arimo;font-size:48px;font-style:normal;font-weight:400;line-height:68px}.transaction_body__container #balance{padding:14px;height:70px;display:flex;justify-content:space-between;align-items:center}.transaction_body__container #balance .walletDetails{display:flex;align-items:center;gap:16px}.transaction_body__container #balance .details{display:flex;flex-flow:column;align-items:flex-start;justify-content:stretch}.transaction_body__container #balance .details .titleSpan{color:#171a1f;font-family:Arimo;font-size:18px;font-style:normal;font-weight:400;line-height:28px}.transaction_body__container #balance .details .balanceSpan{color:#9095a0;font-family:DM Sans;font-size:12px;font-style:normal;font-weight:400;line-height:20px}.transaction_body__container #note{padding:12px;resize:none;height:58px}.transaction_body__container #noteLabel{color:#424955;font-family:DM Sans;font-size:14px;font-style:normal;font-weight:700;line-height:22px}.transaction_body__container button{display:flex;width:342px;padding:9px 0;justify-content:center;align-items:center;border-radius:22px;background:#1e64dd;position:relative;top:50px;border:none;cursor:pointer}.transaction_body__container button:hover{background-color:#000}.transaction_body__container button span{color:#fff;font-family:DM Sans;font-size:16px;font-style:normal;font-weight:400;line-height:26px}.transfer_to__page{min-height:100vh;display:flex;flex-flow:column;position:absolute;background-color:#fff;width:390px}.success__header{background:#1e64dd;box-shadow:0 0 1px #171a1f26,0 0 2px #171a1f33;height:183px;color:#fff;width:100%}.success__header h2{font-family:Arimo;font-size:24px;font-style:normal;font-weight:400;line-height:36px}.success__header .success__icons{display:flex;justify-content:space-between;padding:24px}.success__header .check{position:relative;padding-top:24px}.success__header .interactive_icon{cursor:pointer}.fav_contact{border:1px solid #DEE1E6;border-radius:8px;display:flex;gap:50px;align-items:center;justify-content:space-around;height:79px;width:342px;cursor:pointer;margin-bottom:24px}.fav_contact:hover{background-color:#f5f5f5}.fav_contact .imgArticle{display:flex;gap:17px}.fav_contact .contact_photo{border-radius:100%;border:1px double;width:46px;height:46px}.fav_contact article{display:flex;flex-flow:column;align-items:flex-start;justify-content:center}.fav_contact article .contact_name{color:#171a1f;font-family:Arimo;font-size:1rem;font-style:normal;font-weight:400;line-height:26px}.fav_contact article .contact_email{color:#9095a0;font-family:DM Sans;font-size:12px;font-style:normal;font-weight:400;line-height:20px}.summary{position:relative;border:1px solid #dee1e6;width:342px;padding:20px;height:274px;border-radius:8px}.summary_data{border-bottom:1px solid #DEE1E6}.summary_line{display:flex;justify-content:space-between;line-height:22px;margin-bottom:16px}.summary_key{color:#9095a0;font-family:DM Sans;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.summary_value{color:#171a1f;text-align:right;font-family:Arimo;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.summary_note{text-align:left;width:100%;padding:10px 0;height:83px}.summary_note span{color:#9095a0;font-family:DM Sans;font-size:14px;font-style:normal;font-weight:400;line-height:22px}.summary_note p{overflow:scroll;height:100%;color:#171a1f;font-family:DM Sans;font-size:12px;font-style:normal;font-weight:400;line-height:20px}.summary_footer{position:relative;display:flex;justify-content:center;top:100px}.summary_footer button{display:flex;width:342px;height:44px;padding:9px 0;justify-content:center;align-items:center;border-radius:22px;background:#1e64dd;box-shadow:none;border:none;color:#fff;cursor:pointer}.summary_footer button:hover{background-color:#000}.summary_footer button span{color:#fff;font-family:DM Sans;font-size:1rem;font-style:normal;font-weight:400;line-height:26px}.success__page{min-height:100vh;display:flex;flex-flow:column;align-items:center;position:absolute;background-color:#fff;width:390px}.success__page .transferto{color:#171a1f;text-align:center;font-family:DM Sans;font-size:1rem;font-style:normal;font-weight:400;line-height:22px;padding:13px;margin-bottom:3px}*{padding:0;margin:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}body{margin:0;display:flex;justify-content:center;align-items:center;animation:fadeIn 1s ease-in-out forwards;font-family:Arimo,sans-serif;background-color:#e0e0e0}#root{width:390px;background-color:#fff}div{text-align:center}footer{position:sticky;width:100%;bottom:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}