Skip to content

Instantly share code, notes, and snippets.

@jasondavis
Created November 20, 2012 19:11
Show Gist options
  • Select an option

  • Save jasondavis/4120322 to your computer and use it in GitHub Desktop.

Select an option

Save jasondavis/4120322 to your computer and use it in GitHub Desktop.
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
#wrapper {margin: 0 auto -46px;height: 100%;
min-height: 100%;
background: #F3F3F3 fixed no-repeat url(http://www.stickermule.com/images/dribbble/bg.jpg);background-position: 0px 260px;background-size: 100% auto;
}
#content {padding: 30px;width: 960px;margin: 0 auto;
}
#header {margin: 16px 0;
}
h1 {margin-bottom: 20px;
}
h1 {font-family: "proxima-nova-1", "proxima-nova-2", "HelveticaNeue", "Helvetica Neue", "HelveticaNeueRoman", "HelveticaNeue-Roman", "Helvetica Neue Roman", 'TeXGyreHerosRegular', "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;color: #404040;font-size: 390%;font-weight: 700;line-height: 1em;text-shadow: 3px 3px 0px #CFCFCF;letter-spacing: -1px;
}
p {color: #606060;font-size: 110%;line-height: 26px;
}
#get-yours {margin: 44px 0 0 0;
}
.pink-button {color: white;font-family: "HelveticaNeue", "Helvetica Neue", "HelveticaNeueRoman", "HelveticaNeue-Roman", "Helvetica Neue Roman", 'TeXGyreHerosRegular', "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;font-size: 145%;font-weight: 600;letter-spacing: -1px;text-shadow: 0px -1px 0px #75344D;padding: 16px 28px;border: 1px solid #A3466A;border-radius: 8px;-webkit-border-radius: 8px;-moz-border-radius: 8px;background-color: #F274A4;background-image: linear-gradient(to bottom, #F274A4 0%, #E8538C100%);background-image: -webkit-linear-gradient(top, #F274A4 0%, #E8538C 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #F274A4), color-stop(1, #E8538C));background-image: -o-linear-gradient(top, #F274A4 0%, #E8538C 100%);background-image: -moz-linear-gradient(top, #F274A4 0%, #E8538C 100%);background-image: -ms-linear-gradient(top, #F274A4 0%, #E8538C 100%);box-shadow: 0px 3px 0px #BD4E79, 0px 4px 0px #A3466A, inset 0px 1px 0pxrgba(255, 255, 255, .4);-webkit-box-shadow: 0px 3px 0px #BD4E79, 0px 4px 0px #A3466A, inset 0px 1px 0px rgba(255, 255, 255, .4);-moz-box-shadow: 0px 3px 0px #bd4e79, 0px 4px 0px #a3466a, inset 0px 1px 0px rgba(255,255,255,.4);
}
.pink-button:active {background-image: linear-gradient(to bottom, #EB709F 0%, #E15088100%);background-image: -webkit-linear-gradient(top, #EB709F 0%, #E15088 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #EB709F), color-stop(1, #E15088));background-image: -o-linear-gradient(top, #EB709F 0%, #E15088 100%);background-image: -moz-linear-gradient(top, #EB709F 0%, #E15088 100%);background-image: -ms-linear-gradient(top, #EB709F 0%, #E15088 100%);position: relative;top: 4px;box-shadow: inset 0px 1px 3px rgba(0, 0, 0, .4);
}
.pink-button:hover {background-image: linear-gradient(to bottom, #F37CAA 0%, #EA5C93100%);background-image: -webkit-linear-gradient(top, #F37CAA 0%, #EA5C93 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #F37CAA), color-stop(1, #EA5C93));background-image: -o-linear-gradient(top, #F37CAA 0%, #EA5C93 100%);background-image: -moz-linear-gradient(top, #F37CAA 0%, #EA5C93 100%);background-image: -ms-linear-gradient(top, #F37CAA 0%, #EA5C93 100%);box-shadow: 0px 3px 0px #BD4E79, 0px 4px 0px #A3466A, inset 0px 1px 0pxrgba(255, 255, 255, .5), 0px 5px 4px rgba(0, 0, 0, .1);-webkit-box-shadow: 0px 3px 0px #BD4E79, 0px 4px 0px #A3466A, inset 0px 1px 0px rgba(255, 255, 255, .5), 0px 5px 4px rgba(0, 0, 0, .1);-moz-box-shadow: 0px 3px 0px #bd4e79, 0px 4px 0px #a3466a, inset 0px 1px 0px rgba(255,255,255,.5), 0px 5px 4px rgba(0,0,0,.1);
}
a {color: #606060;text-decoration: none;
}
#nav-wrapper {height: 46px;text-align: left;background-color: #525252;background-image: linear-gradient(to bottom, #525252 0%, #2F2F2F100%);background-image: -webkit-linear-gradient(top, #525252 0%, #2F2F2F 100%);background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #525252), color-stop(1, #2F2F2F));background-image: -o-linear-gradient(top, #525252 0%, #2F2F2F 100%);background-image: -moz-linear-gradient(top, #525252 0%, #2F2F2F 100%);background-image: -ms-linear-gradient(top, #525252 0%, #2F2F2F 100%);box-shadow: 0px 1px 5px rgba(0, 0, 0, .3);-webkit-box-shadow: 0px 1px 5px rgba(0, 0, 0, .3);-moz-box-shadow: 0px 1px 5px rgba(0,0,0,.3);
}
.container {width: 960px;margin: 0 auto;padding: 0 20px;
}
#footer, .push {height: 46px;
}
<div id="wrapper">
<div id="nav-wrapper">
<div class="container">
<a href="http://www.stickermule.com">
<img alt="Sticker Mule Dribbble Logo" src="http://www.stickermule.com/images/dribbble/logo.png" id="logo">
</a>
</div>
</div>
<div id="content">
<div id="header">
<h1>Free Dribbble Sticker Pack!</h1>
<p><strong>Sticker Mule loves Dribbble.</strong> That's why we're giving away 10,000 free Dribbble sticker packs to Players, <br>Rookies and Prospects for a limited time.</p>
</div>
<div id="get-yours">
<a class="pink-button" href="/dribbble/request">Get yours now</a>
</div>
</div>
<div class="push"></div>
</div>
http://www.stickermule.com/dribbble
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"html"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment