Skip to content

Instantly share code, notes, and snippets.

@cm85
Created July 14, 2016 23:41
Show Gist options
  • Save cm85/5d60435a533ed4eab3e247f87d017bc2 to your computer and use it in GitHub Desktop.
Save cm85/5d60435a533ed4eab3e247f87d017bc2 to your computer and use it in GitHub Desktop.
Herbal Life
<html>
<head>
<style>
body {
/* The universe is black */
background-color: black;
width: 100%;
height: 100%;
}
#sun {
/* Style your sun */
position: absolute;
top: 50%;
left: 50%;
height: 100px;
width: 100px;
margin-top: -50px;
margin-left: -50px;
border-color: #dddd00;
border-width: 8px;
border-style: solid;
border-radius: 50%;
box-shadow: 0 0 128px orangered;
}
#earth {
position: absolute;
top: 0;
left: 50%;
height: 50px;
width: 50px;
margin-left: -25px;
margin-top: -25px;
}
#earth-orbit {
position: absolute;
top: 50%;
left: 50%;
width: 300px;
height: 300px;
margin-top: -150px;
margin-left: -150px;
-webkit-animation: spin-right 10s linear infinite;
-moz-animation: spin-right 10s linear infinite;
animation: spin-right 10s linear infinite;
}
@-webkit-keyframes spin-right {
100% {
-webkit-transform: rotate(360deg);
}
}
@-moz-keyframes spin-right {
100% {
-webkit-transform: rotate(360deg);
}
}
</style>
</head>
<body>
<!-- Right below is an image of the sun -->
<img id='sun' src="https://dl.dropboxusercontent.com/u/200015521/Image%20URL%20Links/Marijuana-Leaf.png">
<!-- Insert the 'earth' on the next line -->
<div id='earth-orbit'>
<img id='earth' src="https://dl.dropboxusercontent.com/u/200015521/Pictures/Carlo.png">
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment