Skip to content

Instantly share code, notes, and snippets.

@moqmar
Last active August 5, 2016 21:47
Show Gist options
  • Save moqmar/0054409c8e9f0270dab76f8fde977b4c to your computer and use it in GitHub Desktop.
Save moqmar/0054409c8e9f0270dab76f8fde977b4c to your computer and use it in GitHub Desktop.
Shared via plgrnd.com
<!doctype html>
<meta charset="utf-8">
<style>
@import 'https://cdnjs.cloudflare.com/ajax/libs/normalize/4.2.0/normalize.min.css';
@import 'https://fonts.googleapis.com/css?family=Fira+Sans';
body { margin: 0; padding: 25px; background: #f8f8f8; font-family: Fira Sans, sans-serif; }
/* ... */
</style>
<style>
@import 'https://fonts.googleapis.com/css?family=Bungee+Inline|Fira+Mono';
body { padding: 50px; }
h1 { font-family: Bungee Inline, sans-serif; font-weight: normal; font-size: 4em; margin: 0; color: #86BAAA; text-align: center; position: relative; }
h1:before, h1:after { content: ""; border-radius: 2px; display: block; position: absolute; top: 0.45em; left: 0; right: 0; height: 1px; border: 6px solid #86BAAA; }
h1:before { left: calc(50% + 3.6em); }
h1:after { right: calc(50% + 3.6em); }
div { position: relative; margin-top: 25px; }
div:before { display: block; content: ""; width: 100%; padding-top: 56.25%; }
iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
</style>
<h1>Hello Gist!</h1>
<div>
<iframe src="https://www.youtube.com/embed/JOCtdw9FG-s?autoplay=1" frameborder="0" allowfullscreen></iframe>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment