/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }


ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

a { color:#838c1c; text-decoration: none; }

#container {
	background: #FFF;
	width: 580px;
	margin: 0 auto;
	-moz-box-shadow: 0 0 10px 5px #c3c3c3;
	-webkit-box-shadow:0 0 10px 5px #c3c3c3;
	box-shadow:0 0 10px 5px #c3c3c3;
}

/* header */

#header {  overflow: hidden; }

#logoWrap { background:url('../images/demo-page/jflow-logo.png') no-repeat top left transparent; margin: 5px auto 10px; width: 310px; height: 100px; position: relative; }

#logoWrap h1 { font: 56px/1em 'Rokkitt', serif; color:#4f4e4e; text-shadow: 1px 1px 2px #9f9f9f; margin: 0px; text-indent: -9999px;}

#logoWrap h1 span { font-size: 18px; line-height: 30px; text-transform: uppercase; text-shadow: 0px 0px 0px; text-indent: -9999px;}

#headerSocials { overflow: hidden; position: absolute; bottom: 15px; left: 0; }

.socialItem { float: left; }

#adWrap { float: right; margin: 25px 30px 15px; background: #DDD; }

#downloadWrap { float: right; text-align: center; margin: 0 30px 0 0; }

#downloadWrap a { background: url('../images/download-sprite.png') no-repeat right top transparent; padding: 0 40px 0 0; font-style: italic; font-size: 14px; float: left; line-height: 30px; }

#downloadWrap a:hover { background-position: right -31px; color:#5d6410; }

/* content */

#content { padding: 20px 20px 60px; overflow: hidden; }

#content p { font-size: 14px; color:#646464; line-height: 18px; margin: 0 0 10px; }

#content h2, #content h3, #content h4 { font-size: 16px; font-weight: bold;padding: 15px 0; }

#main { float: left; width: 600px; }

#sidebar { float: right; width: 250px; }

/* intro */

#content .intro-heading { font:30px/42px 'Rokkitt', serif; color:#4f4e4e; border-bottom: 1px solid #d6d6d6; margin: 0 0 15px; padding: 0; }

#content .intro-p { font-size: 18px; line-height: 22px; font-style: italic;  }

/* sidebar */

.sidebar-widget { margin: 10px 0 20px; }

#sidebar .widgettitle { font:24px/30px 'Rokkitt', serif; color:#4f4e4e; margin: 0 0 15px; padding: 0; }

.ad-widget { padding: 20px 0 0; }

/* checklist */

.check-list { margin: 0; }

.check-list li { background: url('../images/demo-page/checkmark.png') no-repeat 0px 0px transparent; padding: 0 0 12px 20px; font-size: 14px; line-height: 20px; font-style: italic; }

#w3c { padding-bottom: 0px; }

#w3c span { position: relative; top: -15px; }

#w3c a { padding: 0 0 0 5px; position: relative; top: -5px; }

/* options table */

.option-name { font-weight: bold;   }

.option-type { font-style: italic; }

table td { padding:10px; line-height:18px; }

tr:nth-child(odd)		{ background-color:#eee; }

tr:nth-child(even)		{ background-color:#fff; }

/* code */

pre { background: #EEE; margin:0 0 15px; padding: 10px; overflow: auto; font-size: 12px; }