*{box-sizing:inherit;outline:0}*,*:before,*:after{margin:0;padding:0}html{font-size:62.5%;box-sizing:border-box}body{box-sizing:inherit;-webkit-font-smoothing:antialiased;line-height:1.5;font-family:Space-Grotesk-medium}@font-face{font-family:Space-Grotesk-medium;src:url(./assets/Fonts/Space_Grotesk/static/SpaceGrotesk-Medium.ttf)}@font-face{font-family:Space-Grotesk-regular;src:url(./assets/Fonts/Space_Grotesk/static/SpaceGrotesk-Regular.ttf)}.app--container{width:100%;margin:auto;height:100vh;display:grid;grid-template-columns:repeat(3,1fr);position:relative}.app__card{grid-column:1/span 1}.app__card--bg-img{width:100%;height:100%;background-image:url(/assets/bg-main-desktop-8bf4510a.png);background-size:cover;background-repeat:no-repeat;background-position:center}.app__form{grid-column:2/-1;display:grid;grid-template-columns:40% 40% 20%}.form--container{grid-column:2/span 1;width:80%;min-width:40rem;display:flex;align-items:center;justify-content:center}.form__layout>*:not(:last-child){margin-bottom:2rem}.form__layout>*:last-child{margin-top:2rem}.form__layout__item{display:flex;flex-direction:column}.form__layout__item .error{color:red}.form__layout__item--labels{color:#21092f;text-transform:uppercase;font-size:1.125rem;margin-bottom:.5rem;letter-spacing:1.25px}.form__date-cvv--container{display:grid;grid-template-columns:1fr 1fr;-moz-column-gap:2rem;column-gap:2rem}.form__field{width:100%;padding:1rem 2rem;border-radius:10px;outline:none;border:1px solid hsl(270,3%,87%);color:#21092f;font-size:2rem;font-family:Space-Grotesk-medium}.form__field::-moz-placeholder{color:#dedddf;font-family:Space-Grotesk-medium}.form__field::placeholder{color:#dedddf;font-family:Space-Grotesk-medium}.form__date__field{display:grid;grid-template-columns:1fr 1fr;-moz-column-gap:1rem;column-gap:1rem}.form__btn{width:100%;border-radius:10px;background-color:#21092f;color:#dedddf;text-align:center;padding:1rem 2rem;font-size:1.5rem;font-family:Space-Grotesk-medium}.error{color:#ff5252;font-family:Space-Grotesk-medium;font-size:1rem;text-transform:capitalize}.card--container{height:-moz-max-content;height:max-content;padding:3rem 0;width:40%;min-width:45rem;max-width:65rem;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;position:absolute;top:50%;left:30%;transform:translate(-50%,-50%)}.card--container.submitted{left:50%}.card--container.submitted>*{transform:translate(-50%,-50%) scale(1.5);position:absolute;left:50%;top:50%}.card--container>*:not(:last-child){margin-bottom:4rem;align-self:flex-start}.card--container>*.submitted{transform:translate(-50%,-50%) scale(1.5);position:absolute;left:50%;top:50%}.card__back--container{position:relative}.card__back--cvv{position:absolute;color:red;top:48.5%;right:10%;transform:translate(-50%,-50%);display:flex}.card__back--cvv-inputs{width:1rem;font-size:1.5rem;font-family:Space-Grotesk-medium;border-radius:50%;border:none;background:none;color:#fff;transition:all 2ms ease-in-out;margin-right:.25rem}.card__back--cvv-inputs.not-active{color:#ffffff6b}.card__front--container{position:relative}.card__front--content{position:absolute;top:0;left:0;background:transparent;color:#fff;padding:3rem;width:100%;display:flex;flex-direction:column;align-items:flex-start}.card__front--header{width:100%;margin-bottom:6rem;display:flex;align-items:center;justify-content:flex-start}.card__front--footer{width:100%;display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;padding-right:1.5rem;font-size:1.5rem;letter-spacing:2px;text-transform:uppercase}.card__logo{width:4rem;height:4rem;background-color:#fff;border-radius:50%;margin-right:2rem}.card__icon{width:2rem;height:2rem;background-color:transparent;border:2px solid #fff;border-radius:50%}.card__number{width:100%;margin-bottom:2.5rem;display:flex;align-items:center}.card__number-inputs{width:2.125rem;font-size:3rem;font-family:Space-Grotesk-regular;border-radius:50%;border:none;background:none;color:#fff;text-align:center}.card__number-space{margin-right:1rem}.not-active{color:#ffffff6b!important}