.tablet { border: 15px solid black; border-bottom-width: 40px; border-radius: 15px; height: 300px; width: 200px; /* home button */ &::after { border: 1px solid white; border-radius: 4px; content: " "; height: 10px; left: -90px; position: relative; top: 180px; width: 50px } } .screenshot { border: 1px solid $primary-color; box-shadow: 0 0 .75rem rgba(75, 75, 75, .35); display: inline-block; margin: 1rem 0; figcaption { background: $primary-color; color: white } } .transparent { /* TODO small data svg */ background: linear-gradient( 45deg, rgba(0, 0, 0, 0.1) 25%, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0.2) 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0 ), linear-gradient( 45deg, rgba(0, 0, 0, 0.1) 25%, rgba(0, 0, 0, 0.2) 25%, rgba(0, 0, 0, 0.2) 75%, rgba(0, 0, 0, 0.1) 75%, rgba(0, 0, 0, 0.1) 0 ), rgb(255, 255, 255); background-position: 0 0, 80px 80px; background-size: 32px 32px }