@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap";#root{width:100%;min-height:100vh;background-color:var(--color-brand-4)}@media screen and (min-width: 769px){#root{width:100%;min-height:100vh;display:grid;place-items:center;background-color:var(--color-site-1)}}:root{--color-brand-1: hsl(234, 29%, 20%);--color-brand-2: hsl(231, 7%, 60%);--color-brand-3: hsl(4, 100%, 67%);--color-brand-3-1: hsla(4, 100%, 67%, .2);--color-brand-4: hsl(0, 0%, 100%);--color-site-1: hsl(235, 18%, 26%);--color-site-2-1: #ff527b;--color-site-2-2: #ff6a3a;--font-roboto: "Roboto", sans-serif}label{font-size:1.6rem;color:var(--color-brand-1);position:relative;font-weight:700}label.error:before{content:"Valid email required";position:absolute;top:.5rem;right:0;font-size:1.2rem;color:var(--color-brand-3)}#email{display:block;color:var(--color-brand-1);background-color:transparent;width:100%;border:1.5px solid var(--color-brand-2);padding:1.5rem 2rem;border-radius:.5rem;outline:none;margin:1rem auto 2rem;font-size:1.6rem}#email.error{border-color:var(--color-brand-3);background-color:var(--color-brand-3-1);color:var(--color-brand-3)}.FormBtn{display:block;width:100%;margin:auto;background:var(--color-brand-1);color:var(--color-brand-4);font-size:1.6rem;cursor:pointer;padding:1.5rem 2rem;border-radius:.5rem;outline:none;border:none;font-weight:700;transition:all .2s ease-in-out}.FormBtn:hover{background:linear-gradient(120deg,var(--color-site-2-1),var(--color-site-2-2))}@media screen and (min-width: 769px){#email{margin-bottom:3rem}}:root{--color-brand-1: hsl(234, 29%, 20%);--color-brand-2: hsl(231, 7%, 60%);--color-brand-3: hsl(4, 100%, 67%);--color-brand-4: hsl(0, 0%, 100%);--color-site-1: hsl(235, 18%, 26%);--font-roboto: "Roboto", sans-serif}main{background-color:var(--color-brand-4);border-radius:2rem}.Container-ImgBox{width:100%;height:28rem;margin-bottom:2rem}.Container-TxtBox-QRCode{display:flex;justify-content:space-between;margin-bottom:30px}.QRCode{display:inline-block;text-align:center}.Container-TxtBox-Para{margin-top:30px}.Container-ImgBox img{width:99.9%;height:100%;object-fit:cover}.Container-TxtBox{padding:2rem}.Container-TxtBox-Title{color:var(--color-brand-1);font-size:3.4rem;margin-bottom:1.5rem}.Container-TxtBox-Para{font-size:1.6rem;color:var(--color-brand-1);margin-bottom:1.5rem;line-height:2.5rem}.Container-TxtBox-List{list-style:none}.Container-TxtBox-List>li{display:flex;align-items:flex-start;justify-content:flex-start;gap:.5rem;margin-bottom:1.5rem}.Container-TxtBox-List>li>p{font-size:1.6rem;color:var(--color-brand-1)}@media screen and (min-width: 769px){main{padding:2rem}.Container{display:grid;grid-template-columns:repeat(2,1fr);align-items:flex-start;justify-content:center;gap:4rem;grid-auto-flow:dense}.Container-ImgBox{grid-column:2;height:100%;margin-bottom:0;max-height:80rem}.QRCode-Title{font-size:15px}.Container-TxtBox{grid-column:1}.Container-TxtBox-Title{font-size:5rem;margin-bottom:3rem}.Container-TxtBox-Para{max-width:36rem;margin-bottom:2.5rem}.Container-TxtBox-List{margin-bottom:5rem}}:root{--color-brand-1: hsl(234, 29%, 20%);--color-brand-2: hsl(231, 7%, 60%);--color-brand-3: hsl(4, 100%, 67%);--color-brand-3-1: hsla(4, 100%, 67%, .2);--color-brand-4: hsl(0, 0%, 100%);--color-site-1: hsl(235, 18%, 26%);--font-roboto: "Roboto", sans-serif}*,*:after,*:before{padding:0;margin:0;box-sizing:border-box;font-family:var(--font-roboto)}html{font-size:62.5%}.MSGBox{width:100%;min-height:100vh;padding:12rem 2rem 2rem;position:relative}@media screen and (min-width: 769px){.MSGBox{max-width:40rem;padding:3rem 2rem 2rem;min-height:auto;height:44rem}}.MSGBox>img{width:8rem;height:8rem;margin-bottom:2rem}.MSGBox-Title{font-size:3.4rem;color:var(--color-brand-1);margin-bottom:1.5rem}.MSGBox-Para{font-size:1.6rem;color:var(--color-brand-1);margin-bottom:1.5rem;line-height:2.5rem}.MSGBox-Para>span{font-weight:700}.MSGBox-Btn{display:block;position:absolute;bottom:2rem;left:2rem;right:2rem;border:none;outline:none;background-color:var(--color-brand-1);color:var(--color-brand-4);font-size:1.6rem;font-weight:700;cursor:pointer;border-radius:.5rem;padding:1.5rem 2rem;transition:all .2s ease-in-out}.MSGBox-Btn:hover{background:linear-gradient(120deg,var(--color-site-2-1),var(--color-site-2-2))}