/*http://meyerweb.com/eric/tools/css/reset/    v1.0|20080212*/ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}:focus{outline:0;}ins{text-decoration:none;}del{text-decoration:line-through;}table{border-collapse:collapse;border-spacing:0;}

@font-face { font-family: "FF Dax"; src:url("http://ffonts.justanotherfoundry.com/Dax/DaxWebPro"); }
@font-face { font-family: "FF Dax"; src:url("http://ffonts.justanotherfoundry.com/Dax/DaxWebPro-Bold"); font-weight: bold; }

body {
	background: #2a2a2a;
	font-family: "FF Dax", Verdana, sans-serif;
	font-size: 16px;
	letter-spacing: 0.2px;
	color: #ccc;
	line-height: 1.6em;
}

#page-wrap {
	width: 808px;
	padding: 0 13px;
	margin: 5em auto;
}

h1 {
	color: #ffde00;
	display: inline;
	font-size: 72px;
	font-weight: bold;
	letter-spacing: -2px;
}

#fontfonter-logo-er {
	color: white;
}

h2 {
	font-size: 29px;
	display: inline;
	font-weight: normal;
	margin-left: 0.6em;
}

.msie-warning {
	font-size: 21px;
	line-height: 1.4em;
	border: 1px solid #ffde00;
	margin: 0 0 3em 0;
	padding: 0.4em 0.6em;
}

h3 {
	font-weight: bold;
	font-size: 22px;
	margin: 2em 0 0.6em;
}

form {
	white-space: nowrap;
}

#URL-wrap, #fontfonter-submit-wrap {
	padding: 0.25em 0;
	margin: 0;
	display: inline-block;
	height: 2.1em;
	vertical-align: top;
}

#URL-wrap {
	width: 650px;
	background: black;
	-webkit-border-top-left-radius: 0.3em;
	-webkit-border-bottom-left-radius: 0.3em;
	-moz-border-radius-topleft: 0.3em;
	-moz-border-radius-bottomleft: 0.3em;
	border-top-left-radius: 0.3em;
	border-bottom-left-radius: 0.3em;
}

#fontfonter-submit-wrap {
	width: 158px;
	background: #666;
	-webkit-border-top-right-radius: 0.3em;
	-webkit-border-bottom-right-radius: 0.3em;
	-moz-border-radius-topright: 0.3em;
	-moz-border-radius-bottomright: 0.3em;
	border-top-right-radius: 0.3em;
	border-bottom-right-radius: 0.3em;
}

input {
	font-family: "FF Dax", Verdana, sans-serif;
	border: 0;
	font-size: 22px;
	width: 100%;
}

#URL {
	background: black;
	color: #888;
	font-family: "FF Dax", Verdana, sans-serif;
	padding-left: 0.6em;
}

#fontfonter-submit {
	outline: none;
	background: #666;
	color: #ccc;
	font-weight: bold;
}

#fontfonter-submit:hover {
	cursor:pointer;
}

#fontfonter-submit-wrap:hover {
	background: black;
}

#fontfonter-submit-wrap:hover > input {
	background: black;
}

.space-before {
	margin-left: 8px;
}

.space-above {
	margin-top: 8px;
}

#demo-nytimes, #demo-ilovetypography, #demo-twitter, #demo-digg, #demo-behance, #demo-google {
	display: block;
	width: 400px;
	height: 150px;
	float: left;
}

#demo-nytimes:hover, #demo-ilovetypography:hover, #demo-twitter:hover, #demo-digg:hover, #demo-behance:hover, #demo-google:hover {
	background-position: 0 -150px;
}

#demo-nytimes span, #demo-ilovetypography span, #demo-twitter span, #demo-digg span, #demo-behance span, #demo-google span {
	display: none;
}

#demo-nytimes { background: url("nytimes.png") no-repeat 0 0; }
#demo-ilovetypography { background: url("ilovetypography.png") no-repeat 0 0; }
#demo-twitter { background: url("twitter.png") no-repeat 0 0; }
#demo-digg { background: url("digg.png") no-repeat 0 0; }
#demo-behance { background: url("behance.png") no-repeat 0 0; }
#demo-google { background: url("google.png") no-repeat 0 0; }

a {
	color: #ccc;
}

a:hover {
	color: white;
}

p {
	display: table;
}

.smaller {
	font-size: 14px;
	letter-spacing: 0.35px;
	line-height: 1.6em;
}

ul {
	font-size: 1em;
	padding-left: 1.25em;
	display: block;
	list-style-type: disc;
	list-style-position: outside;
	margin-bottom: 3em;
	font-weight: normal;
}

li {
	margin-top: 0.5em;
	line-height: 18px;
}

#fontshop-logo {
	position: relative;
	top: 8px;
}

#bookmarklet {
	position: absolute;
	top: 20px;
	left: 2.5%;
}

h4 {
	margin-top: 0.8em;
	color: #ffde00;
}

