.spotlight { overflow: hidden; } .spotlight-overlay { width: 100.1%; height: 100.1%; position: absolute; top: 0; left: 0; right: 0; bottom:0; background: radial-gradient( circle at 130% center, rgba(32, 31, 49, 0) 50%, rgba(32, 31, 49, 0.5) 60%, rgba(32, 31, 49, 1) 80%, rgba(32, 31, 49, 1) 100% ), linear-gradient( to top, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 20%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to left, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 20%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to bottom, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 20%, rgba(32, 31, 49, 0) 100% ); z-index: 1; } @media only screen and (max-width: 1300px) { .spotlight-overlay { background: radial-gradient( circle at 130% center, rgba(32, 31, 49, 0) 50%, rgba(32, 31, 49, 0.5) 60%, rgba(32, 31, 49, 1) 80%, rgba(32, 31, 49, 1) 100% ), linear-gradient( to top, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 20%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to left, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 20%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to bottom, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 50%, rgba(32, 31, 49, 0) 100% ); } } @media only screen and (max-width: 1200px) { .spotlight-overlay { background: radial-gradient( circle at 100% center, rgba(32, 31, 49, 0) 50%, rgba(32, 31, 49, 0.5) 60%, rgba(32, 31, 49, 1) 95%, rgba(32, 31, 49, 1) 100% ), linear-gradient( to top, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 20%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to left, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 20%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to bottom, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 70%, rgba(32, 31, 49, 0) 100% ); } } @media only screen and (max-width: 900px) { .spotlight-overlay { background: radial-gradient( circle at 60% center, rgba(32, 31, 49, 0) 50%, rgba(32, 31, 49, 0.5) 85%, rgba(32, 31, 49, 1) 95%, rgba(32, 31, 49, 1) 100% ), linear-gradient( to top, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 70%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to left, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 20%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to bottom, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 70%, rgba(32, 31, 49, 0) 100% ), linear-gradient( to right, rgba(32, 31, 49, 1) 0%, rgba(32, 31, 49, 0) 15%, rgba(32, 31, 49, 0) 100% ); } }