/**
 * Fork Onsite reset
 * @author	Johan Ronsse <johan@netlash.com>
 * Based on Netlog reset and Eric Meyer's reset
 */
body, form, fieldset, ol, ul, dl, li, dt, dd, td, th ,tr, h1, h2, h3, h4, h5, h6, p, pre, blockquote, address { margin: 0; padding: 0; }
ol, ul { list-style:none; }
img, fieldset { border: 0; }
input, select, textarea { font-size: 100%; vertical-align: middle; }
table { border-collapse: collapse; border-spacing: 0; empty-cells: show; }
th { text-align: left; }
a:focus { overflow: hidden; }

/**
 * Stylesheet for TwitPickr
 * @media	screen, projection
 * @author	Tijs Verkoyen
 * @author	Joke De Nul
 */
/* Typography and text styles */
body { font: 300 14px Arial, sans-serif; line-height: 1.48; padding: 0 0 20px; color: #333; }

/* Headings */
h1, h2, h3, h4 { font: 700px 19px Helvetica, Arial, sans-serif; line-height: 1.1; }
h1, h2 { font-size: 19px; padding: 8px 0 2px 0; margin: 0 0 12px 0; }
h3 { font-size: 16px; padding: 7px 0 5px 0; }
h4 { font-size: 13px; padding: 7px 0 7px 0; font-weight: 700; }
p { padding: 0 0 10px 0; }
ul, ol { padding: 0 0 12px 24px; }
ul { list-style: disc; }
ol { list-style-type: decimal; padding: 0 0 12px 24px; }
small, span.mute { color: #808080; font-size: 11px; }
code { font: 300 12px Monaco, "Courier New", monospace; line-height: 1.15; }
pre { padding: 7px 14px; margin: 0 0 14px; background: #F5F5F5; }
blockquote, q { font-style: italic;	color: #666; }
blockquote { padding: 0 0 0 14px; }
cite { font-size: 11px; text-align: right; display: block; position: relative; top: -14px; height: 0; }
abbr, acronym { cursor: help; }

/* Links */
a:link, a:visited, a:active { color: #FF0084; text-decoration: none; }
a:hover, a:active { color: #0063C8; text-decoration: underline; }

/* Structure */
#container { width: 780px; margin: 0 auto; }
#header { padding: 20px 0 30px;	}
	#header h1 a { display: block; width: 455px; height: 110px;  background: transparent url('../images/header_bg.gif') no-repeat top left; }
		#header h1 a span { display: none; }

#content {}
	#content .left { float: left; width: 370px; }
	#content .right { float: left; margin-right: 10px; width: 370px; }
	#content .left-large { float: left; width: 420px; }
	#content .right-small { float: left; margin-right: 10px; width: 270px; }

	#content #select-pictures { width: 410px; }
	
	#content .image-grid ul li { float: left; margin: 10px; height: 95px; list-style: none; background: #FFF url('../images/image_grid_bg.jpg') no-repeat top left; }
	#content .image-grid ul li a { display: block; width: 90px; height: 95px; }
	#content .image-grid ul li img { width: 67px; height: 67px; margin: 5px 0 0 10px; border: 1px solid #F2F2F2; }
	
	#content .image-grid-large ul { padding: 0; }
	#content .image-grid-large ul li { list-style: none; float: left; margin: 0 0 15px 0; background: transparent url(../images/polaroid.png) no-repeat top left; height: 210px; width: 210px; }
	#content .image-grid-large ul li img { width: 135px; height: 135px; margin: 26px 0 0 10px; border: 1px solid #F2F2F2; }

#footer { margin: 35px 0; border-top: 1px solid #CCC; }
#footer ul { float: right; padding: 10px; }
#footer li { float: left; padding: 0 10px; list-style: none; font-size: 11px; }

/* Forms */
fieldset { margin: 10px 0; padding: 17px; border: 1px solid #F2F2F2; }
fieldset.birdie { background: #C8DDF3 url('../images/the_dance_not_moving.gif') no-repeat bottom right; }
label { font-weight: 900; }
.input-text { margin: 3px 3px 5px 0; padding: 2px; font: 300 15px Arial, sans-serif; }
.input-text-error { background-color: #FFB2B2; }
.image-grid-large .input-text { width: 110px; margin-top: 1px; }
.image-grid-large .input-checkbox { margin: 0 2px 0 10px; }
input#name { width: 330px; }

/* Loading */
fieldset.loading { background-image: url(../images/the_dance.gif); }
span.cloud { position: absolute; margin: 7px 0 0 230px; display: none; width: 100px; height: 56px; background: transparent url(../images/cloud.gif) no-repeat bottom right; }
.right-small span.cloud { margin: 60px 0 0 160px; }
/* Success */
#content p.success { padding: 15px; margin-bottom: 20px; background-color: #C8DDF3; border: 1px solid #F2F2F2; text-align: center; }

/* Errors */
span.form-error { display: inline-block; color: #F00; font-weight: 900; }
p.error { border: 1px solid #F00; background-color: #FFB2B2; color: #F00; font-weight: 900; padding: 3px; margin: 5px; }

/** Warnings */
.warning { margin-bottom: 7px; padding: 5px; background-color: #FF6; border: 1px solid #F2F2F2;  }

span.is-you { position: absolute; display: block; width: 92px; height: 46px; margin: -42px 0 0 -23px; background-image: url(../images/this_is_you.gif); }

/* General */
.pink { color: #FF0084; }
.blue { color: #0063C8; }
.floatright { float: right; margin-right: 10px; }

/* Clearfix */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }