@font-face {
	font-family: "Milk";
	src: url('../fonts/ABTSmilk.eot?'); /* IE9 */
 	src: url('../fonts/ABTSmilk.eot?') format('eot'), /* IE6-8 */
	     url('../fonts/ABTSmilk.ttf') format('truetype'), /* Older Webkits */
	     url('../fonts/ABTSmilk.svg#webfont') format('svg'), /* Opera */
	     url('../fonts/ABTSmilk.woff') format('woff'); /* Modern browsers */
	font-weight: normal;
	font-style: normal;
}

#promote-buttons #content { min-height: 40em; }

#promote-buttons #page-head { border: 0; margin: 0; padding: 30px 0 10px; text-align: center; clear: both; }
#promote-buttons #page-head .crumb { font-size: .857em; text-align: left; margin-top: -1.75em; }
#promote-buttons #page-head .crumb a:before { content: "\00AB\00A0"; }
#promote-buttons #page-head ol { margin: .5em 40px 1em; text-align: left; font-size: .925em; }
#promote-buttons #page-head ol strong { color: #a33500; }
#promote-buttons #page-head .page-title { margin: 0 0 .1em; color: #ab181a; font: 200 72px/1 "Bebas Neue", "League Gothic", Haettenschweiler, "Arial Narrow", sans-serif; letter-spacing: 1px; text-transform: uppercase; text-shadow: 3px 3px 0 rgba(170, 160, 130, 0.5); }

#button-builder { position: relative; margin: 0 0 1em; padding-bottom: 2em; overflow: hidden; }
#button-builder .step { width: 620px; padding: 19px; float: left; margin: 0 0 10px;
  border: 1px solid #d8d4ca; 
  background: #fff;
  background: -moz-linear-gradient(top, rgba(255,255,255,.9) 0, rgba(255,255,255,0) 80%); 
  background: -webkit-linear-gradient(top, rgba(255,255,255,.9) 0, rgba(255,255,255,0) 80%);
  background: linear-gradient(top, rgba(255,255,255,.9) 0, rgba(255,255,255,0) 80%);

}
#button-builder .step h3, #button-preview h3 { font: 20px/1 "Bebas Neue", "League Gothic", "Arial Narrow", sans-serif; letter-spacing: .5px; }
#button-builder .step h3 b { float: left; margin: -8px 10px 0 -8px; padding: 4px 3px 4px 5px; width: 24px; height: 24px; text-align: center; font: 20px/20px Georgia, Times, serif; background: #ab181a; color: #fff; -moz-border-radius: 16px; -webkit-border-radius: 16px; border-radius: 16px; text-shadow: 1px 1px 0 rgba(0,0,0,.5); -moz-box-shadow: 1px 1px 1px rgba(0,0,0,.3); -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.3); box-shadow: 1px 1px 1px rgba(0,0,0,.3); }
#button-builder label { cursor: pointer; display: block; }
#button-build ul { list-style: none; margin: 0 0 1.4em; padding: 0; }

#step-design li { float: left; margin: 0 20px 1em 0; padding: 5px; overflow: hidden; }
#step-design li:last-child { margin-right: 0; }
#step-design input { position: absolute; left: -999em; }
#step-design img { display: block; padding: 1px; margin: 2px; border: 1px solid #d8d4ca; box-shadow: 2px 2px 2px rgba(0,0,0,.1); }
#step-design img:hover, #step-design li.selected img { border-color: #25a; border-width: 2px; margin: 1px; }

#step-color li, #step-topic li { float: left; width: 120px; margin: 0 25px 1em 2px; padding: 2px; border: 1px solid #d8d4ca; box-shadow: 2px 2px 2px rgba(0,0,0,.1); }
#step-color input, #step-topic input { position: absolute; left: -999em; }
#step-color label, #step-topic label { display: block; overflow: hidden; padding: .5em 10px; text-align: center; font-size: 1.142em; text-transform: uppercase; color: #fff; text-shadow: 0 0 3px rgba(0,0,0,.5), 1px 1px 0 #000; }
#step-color li:hover, #step-color li.selected, #step-topic li:hover, #step-topic li.selected { border-color: #25a; border-width: 2px; margin: 0 25px 1em 2px; width: 118px; padding: 2px; }
#step-color li:hover label, #step-color li.selected label, #step-topic li:hover label, #step-topic li.selected label { margin: -1px; }
#step-color .gray label, #step-topic .Gray label { background: #443f3e; }
#step-color .orange label, #step-topic .Orange label { background: #f16a22; }
#step-color .red label, #step-topic .Red label { background: #ec2224; }

#step-topic label { font: normal 18px/1 "Milk", sans-serif; text-transform: none; letter-spacing: 1px; }

#button-code { font: .857em monospace; width: 94%; height: 6em; margin: 0 0 1.4em; } 

#button-preview { width: 210px; padding: 20px; float: right; border: 1px solid #d8d4ca; }
#button-preview.fixed { position: fixed; z-index: 99; top: 20px; margin-left: 684px; }
#button-image { display: block; margin: 1em auto 1.4em; }
