
/* 

jFlow Plus Demo CSS 

Description: Demo styles NOT for use with jFlow Plus

Creator: Devin Walker

Date: October 4, 2011

*/

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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

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

body { line-height: 1; }

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; }

body { margin: 0; padding: 0 50px 50px 50px; background: #000 url("../images/bg.jpg"); background-repeat: no-repeat; background-position:top center; background-attachment:fixed; font-family: Arial, Helvetica, sans-serif; }

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

#container { background: #eee url("../images/bgcontainer.fw.png"); width: 940px; margin: 0 auto; -moz-box-shadow: 0 0 10px 5px #c3c3c3; -webkit-box-shadow:0 0 10px 5px #c3c3c3; box-shadow:0 0 12px 1px #000; margin-top:120px;}

/* header */



#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; color:#002053; }

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

#sidebar { float: right; width: 250px; }
#sidebar img{
	border:1px solid #333;
	margin-bottom:5px;
	}

/* intro */

#content .intro-heading { font:30px/42px 'Rokkitt', serif; color:#002053; 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; }
#facebookLike{
	background:#FFF;
	}

/* 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; }
/* Header Style */
.codrops-top {
	width:100% !important;
	line-height: 24px;
	font-size: 11px;
	background: #000;
	
	text-transform: uppercase;
	z-index: 9999;
	position: fixed;
	top:0px;
	left:0px;
	font-family: Cambria, Georgia, serif;
	box-shadow: 1px 0px 2px rgba(0,0,0,0.2);
	color:#FFF;
	padding-left:20px;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */

.codrops-top:before,
.codrops-top:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.codrops-top:after {
    clear: both
}

.codrops-top a {
	padding: 0px 10px;
	letter-spacing: 1px;
	color: #eee;
	display: inline-block;
}

.codrops-top a:hover {
	background: rgba(255,255,255,0.6);
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	float: left;
	display: block;
}