@layer addon { .templateForm { .inner { @media (min-width: 56em) { grid-template-columns: repeat(12, 1fr); display: grid; grid-column: span 12; .intro { grid-column: span 5; } iframe { grid-column: span 7; } } @media (--min-fablet) { grid-template-columns: repeat(12, 1fr); display: grid; grid-column: span 12; .intro { grid-column: span 5; } iframe { grid-column: span 7; } } } } }