@font-face{font-family:Ubuntu-Bold;src:url(/multi_step_form/assets/Ubuntu-Bold-6dbcce3f.ttf) format("truetype")}@font-face{font-family:Ubuntu-Medium;src:url(/multi_step_form/assets/Ubuntu-Medium-0d685f51.ttf) format("truetype")}@font-face{font-family:Ubuntu-Regular;src:url(/multi_step_form/assets/Ubuntu-Regular-66fea9c0.ttf) format("truetype")}*{margin:0;padding:0;box-sizing:border-box}body{font-size:1rem;font-family:Ubuntu-Regular,sans-serif}.container-background{width:100%;height:100vh;background-color:#f0f6ff;position:absolute;z-index:-2}.container-background svg{display:block;width:100%;margin:0;position:fixed;z-index:-1}.desktop{height:100vh}.container{min-height:100%;display:flex;flex-direction:column}.container .container-btn{height:7rem;display:flex;justify-content:center;align-items:center;gap:1rem;padding:1rem}.container .container-btn .step{display:none}.container .container-btn svg{display:none}.container .container-btn .active{background-color:#adbeff;color:#000;border:1px solid hsl(228,100%,84%)}.container .container-btn div{width:2rem;height:2rem;display:grid;place-content:center;border-radius:50%;border:1px solid hsl(0,0%,100%);color:#fff;font-family:Ubuntu-Medium,sans-serif}.container-form{background-color:#fff;height:max-content;margin:0 1rem;padding:1.5rem 1.5rem 1rem;z-index:0;border-radius:10px;box-shadow:0 0 16px 2px #00000031}.container-form h1{font-size:1.8rem;font-family:Ubuntu-Bold,sans-serif;color:#02295a}.container-form p{margin-top:1rem;line-height:1.5;color:#9699ab;margin-bottom:1rem}.container-form label{display:block;font-family:Ubuntu-Medium,sans-serif;color:#02295a;font-size:.8rem;margin-bottom:.2rem}.container-form input[type=text],.container-form input[type=email],.container-form input[type=tel]{width:100%;padding:.5rem;font-family:Ubuntu-Medium,sans-serif;font-size:1rem;color:#02295a;border:1px solid hsl(229,24%,87%);margin-bottom:1rem;border-radius:5px}.container-form input[type=text]:focus,.container-form input[type=email]:focus,.container-form input[type=tel]:focus{outline:1px solid hsl(213,96%,18%);color:#02295a}.container-form input[type=text]::placeholder,.container-form input[type=email]::placeholder,.container-form input[type=tel]::placeholder{font-family:Ubuntu-Regular,sans-serif}.btn-container{background-color:#fff;flex:auto;display:flex;flex-direction:column;justify-content:end}.btn-container div{padding:1rem;display:flex;box-shadow:0 -16px 16px 2px #0001}.btn-container button{margin-left:auto;padding:.8rem 1rem;color:#fff;background-color:#02295a;font-family:Ubuntu-Medium,sans-serif;border:none;border-radius:5px}.btn-container .btn-confirm{background-color:#473dff;padding:.8rem 1.2rem;font-size:.9rem}.btn-container .btn-back{background-color:#fff;color:#9699ab;margin-right:auto;margin-left:0;font-family:Ubuntu-Medium,sans-serif;font-size:1rem;padding-left:0}.container-select-plan input[type=radio]{display:none}.container-select-plan input[type=radio]+label{width:100%;margin-bottom:0;padding:1rem;display:flex;gap:1rem;border:1px solid hsl(229,24%,87%);border-radius:10px;margin-bottom:.8rem}.container-select-plan input[type=radio]:checked+label{background-color:#f0f6ff;border:1px solid hsl(213,96%,18%)}.container-select-plan .sub-details h2{font-family:Ubuntu-Medium,sans-serif;font-size:1rem}.container-select-plan .sub-details p{margin:0;margin-top:.3rem}.container-select-plan .sub-details span{display:inline-block;margin-top:.3rem}.container-select-plan .container-toggle{width:100%;display:flex;align-items:center;justify-content:center;gap:1.5rem;background-color:#f0f6ff;border-radius:10px;padding:.1rem 0;margin-top:1.5rem}.container-select-plan .container-toggle svg{fill:#02295a}.container-select-plan .container-toggle .bold{font-family:Ubuntu-Medium,sans-serif;font-size:1rem;letter-spacing:-.5px}.container-select-plan .container-toggle .non-bold{font-family:Ubuntu-Medium,sans-serif;color:#9699ab;font-size:1rem;letter-spacing:-.5px}.container-addons .active{background-color:#f0f6ff;border:1px solid hsl(213,96%,18%)}.container-addons label{display:grid;grid-template-columns:1.2rem 1fr auto;grid-template-rows:auto auto;border:1px solid hsl(229,24%,87%);border-radius:10px;padding:.8rem 1rem;column-gap:1rem;row-gap:.2rem;margin-bottom:.6rem}.container-addons label input{appearance:none;width:1.3rem;height:1.3rem;place-self:center;grid-row:span 2;border:1px solid hsl(229,24%,87%);border-radius:4px}.container-addons label input:checked{appearance:none;background-color:#00f;background-image:url(/multi_step_form/assets/check-mark-c186e5f3.svg)}.container-addons h2{font-size:.9rem;font-family:Ubuntu-Regular,sans-serif;grid-column:2/3;grid-row:1/2}.container-addons p{grid-column:2/3;grid-row:2/2;margin:0;line-height:1.2}.container-addons span{color:#473dff;place-self:center;grid-column:3/4;grid-row:1/3}.container-end{background-color:#f0f6ff;padding:1rem;border-radius:10px}.container-end .container-plan{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.container-end .container-plan p{margin:0;color:#02295a;font-family:Ubuntu-Bold,sans-serif}.container-end .container-plan div span{font-family:Ubuntu-Bold,sans-serif;color:#02295a}.container-end .container-plan div p{text-decoration:underline;font-family:Ubuntu-Regular,sans-serif;color:#9699ab}.container-end hr{border:none;border-top:1px solid hsl(229,24%,87%)}.container-end .container-addons div{display:flex;justify-content:space-between;margin-top:1rem}.container-end .container-addons div span{color:#9699ab}.container-end .container-addons div p{color:#02295a;font-family:Ubuntu-Medium,sans-serif}.total{display:flex;justify-content:space-between;align-items:center;padding:1rem}.total span{color:#9699ab}.total p{color:#473dff;font-family:Ubuntu-Bold,sans-serif;font-size:1.2rem}.confirmed{display:flex;flex-direction:column;align-items:center;padding:3rem 0}.confirmed svg{height:60px;margin-bottom:1.5rem}.confirmed h1{font-size:1.6rem;font-family:Ubuntu-Bold,sans-serif}.confirmed p{text-align:center;margin-top:.6rem}@media (min-width: 768px){.container-form{width:60%;margin:1rem auto 0}}@media (min-width: 1440px){.container-background{display:none}.container-background svg{display:none}.desktop{background-color:#f0f6ff;height:100vh;display:grid;place-content:center}.container{width:55rem;background-color:#fff;border-radius:10px;padding:1rem;height:70vh;display:grid;grid-template-columns:1fr 2fr;grid-template-rows:auto auto;box-shadow:0 0 16px 1px #00000031}.container .container-btn{background-image:url(/multi_step_form/assets/bg-sidebar-desktop-e6d2744a.svg);background-size:cover;height:auto;width:17rem;border-radius:10px;grid-row:span 2;flex-direction:column;position:relative;justify-content:flex-start;align-items:start;gap:2rem;padding-left:2rem;padding-top:3rem}.container .container-btn .steps-container{width:max-content;border:none;border-radius:none;display:grid;grid-template-columns:1fr max-content;column-gap:1rem}.container .container-btn .steps-container .step{display:flex;flex-direction:column;width:auto;text-transform:uppercase;border:none;border-radius:none}.container .container-btn .steps-container .step span{color:#9699ab;font-size:.8rem;font-family:Ubuntu-Regular,sans-serif}.container .container-btn .steps-container .step p{font-size:.9rem}.container .container-form{box-shadow:none;width:80%}.container .container-form input{padding:.7rem 1rem}.container .container-form .container-select-plan{display:grid;grid-template-columns:repeat(3,8rem);grid-template-rows:auto auto;column-gap:1rem;margin-top:2rem}.container .container-form .container-select-plan .container-toggle{grid-column:1/4}.container .container-form .container-select-plan .container-toggle svg:hover{cursor:pointer}.container .container-form .container-select-plan div label{flex-direction:column;gap:2rem}.container .container-form .container-select-plan div label:hover{cursor:pointer;border:1px solid hsl(213,96%,18%)}.container .container-form .container-addons{margin-top:2rem}.container .container-form .container-addons label{padding:1rem 1.5rem;column-gap:1.5rem;margin-bottom:1rem}.container .container-form .container-addons label:hover{cursor:pointer;border:1px solid hsl(213,96%,18%)}.container .container-form .container-addons input{padding:0}.container .container-form .container-end{margin-top:2rem}.container .container-form .container-end .container-plan div p:hover{cursor:pointer;color:#02295a}.container .btn-container{width:70%;margin:auto auto 0}.container .btn-container div{box-shadow:none;padding:0;margin-bottom:1rem}.container .btn-container div .btn-confirm{padding:1rem 2rem}.container .btn-container div .btn-confirm:hover{background-color:#adbeff}.container .btn-container div .btn-back:hover{cursor:pointer;color:#02295a}.container .btn-container div button:last-child{padding:.8rem 1.8rem}.container .btn-container div button:last-child:hover{cursor:pointer;background-color:#473dff}.container-form{width:60%;margin:1rem auto 0}}
