.Form { position: relative; background: #292E3D; overflow: hidden; display: grid; grid-template-rows: auto 1fr; grid-template-columns: 1fr; gap: rem(20px); padding: rem(25px) rem(20px); border-radius: rem(28px); @include iftablet { padding: rem(30px); } @include iflaptop { grid-template-rows: 1fr; grid-template-columns: auto rem(400px); padding: rem(40px); } @include ifdesktop { grid-template-columns: auto rem(550px); padding: rem(40px) rem(60px); } &:after { content: ''; display: block; width: 100%; height: 100%; position: absolute; z-index: 1; left: 0; top: 0; background-color: rgba(#163055, .6); transition: 250ms background-color; } .Background { position: absolute; object-fit: cover; z-index: 1; } .PanelLeft { display: flex; flex-direction: column; } .PanelRight { place-self: center center; @include iftablet{ width: rem(400px); place-self: end end; } @include iflaptop{ width: 100%; } .AdvPhoneInput{ display: none; @include iftablet{ display: block; } } .MobileBtns { position: relative; display: flex; flex-direction: column; gap: rem(20px); z-index: 2; max-width: rem(400px); @include iftablet{ display: none; } } } .SubTitle { position: relative; z-index: 2; font-family: $font-open-sans; font-weight: $font-light; font-size: rem(22px); line-height: 100%; color: $color-white; margin-bottom: rem(16px); @include iftablet { margin-bottom: rem(20px); } @include iflaptop { font-size: rem(24px); } @include ifdesktop { font-size: rem(30px); margin-bottom: rem(16px); } } .Title { position: relative; z-index: 2; font-family: $font-open-sans; font-weight: $font-regular; font-size: rem(26px); line-height: 130%; color: $color-white; max-width: rem(660px); margin: 0; @include iftablet { font-size: rem(28px); } @include iflaptop { font-size: rem(32px); } @include ifdesktop { font-size: rem(48px); } } }