/* Global attributes */
html * {
	padding:				0;
	border:					none;
	margin:					0;
}

body {
	margin-left:										10mm;
}

h2, h3 {
	margin:					1em 0 .5em 0;
}

h1 {
	border-bottom:			1px solid #E6E4DB;
	margin:					1.2em 0 1em 0;
}

h4, h5, h6 {
	margin:					.6em 0 .3em 0;
}

p {
	margin-bottom:			.5em;
}

ul {
	padding:				0 2em;
	margin-bottom:			1.2em;
}

li {
	margin-bottom:			.5em;
}

pre {
/*	padding:				.3em .6em;*/
/*	background:				#EDEBE3;*/
/*	border:					1px solid #BFB9C3;*/
/*	border-right-color:		#DBD6DF;*/
/*	border-bottom-color:	#DBD6DF;*/
/*	margin-bottom:			.5em;*/
/*	overflow:				auto;*/
}

*[type="hidden"] {
	display:				none;
}
/* /Global attributes */


/* Header and footer */
#header {
	height:											20mm;
/*	background:				#277AAC;*/
	background:					 					#FFF;
	border-bottom:									.6mm solid #000;
/*	position:				relative;*/
}

#header h1 {
	border:					none;
	margin:					0;
}

#header h1#logo_screen {
	display:										none;
}

#header h1 img {
	width:											65mm;
	border:											none;
}

#header p a {
	display:										none;
}

#footer {
	display:									none;
}
/* /Header and footer */


/* Main content */
.subnavigation, .subnavigation *, #notice {
	display:												none;
}
/* /Main content */


/* Blank slate instructions */
#blank_slate_instructions #arrow, 
#blank_slate_instructions #hand_cursor {
	display:											none;
}
/* /Blank slate instructions */


/* Cards */
#cards {
	padding:				0;
}

#cards li {
/*	float:					left;*/
/*	float:												none;*/
/*	width:					11em;*/
/*	height:					5em;*/
/*	padding:				.6em 1.5em 1em 5.5em;*/
	padding:											2mm 20mm 2mm 0;
/*	background:yellow;*/
	border-bottom:										.3mm solid #000;
/*	margin:					0 .3em .3em 0;*/
	margin:												0;
	position:											relative;
	page-break-inside:									avoid;
}

#cards ins {
	display:											none;
}

#cards li img {
	display:											none;
/*	position:				absolute;*/
/*	top:					.7em;*/
/*	left:					1.4em;*/
}

#cards ins {
	display:											none;
}

#cards h2 {
	margin:					0 0 .5em 0;
}

#cards h3 {
/*	width:					4em;*/
	width:												15mm;
	height:												5mm;
/*	padding:				.2em 1em;*/
/*	background:				#277AAC;*/
	border:												.3mm solid #000;
	margin-left:										2em;
	position:				absolute;
/*	top:					4.8em;*/
	top:												-.3mm;
/*	left:					2em;*/
	right:												2mm;
}

#cards p {
	margin-bottom:			.2em;
	margin-left:										5mm;
}

#cards ins {
	display:											none;
}

#cards .info {
	width:												15mm;
	position:											absolute;
	right:												2mm;
	top:												11mm;
}
#cards .info:after {
	content:											" on the web";
}

#cards li div.more_info {
	display:						block;
}

#cards .edit {
	display:											none;
}
/* /Cards */


/* Forms */
form, #errorExplanation {
/*	width:					30em;*/
/*	padding:				1.5em 2.5em 2em 2em;*/
	padding:												5mm 0;
	position:				relative;
}

label {
	float:					left;
/*	width:					11.5em;*/
	width:													35mm;
/*	border-bottom:			1px solid #E6E4DB;*/
	position:				relative;
/*	top:					.4em;*/
	top:													.5mm;
	z-index:				2;
}

hr {
	width:					0;
	padding:				0;
	border:					none;
	margin:					0 0 .4em 0;
	visibility:				hidden;
	clear:					both;
}

input, select, textarea {
	display:				block;
/*	width:					18em;*/
	width:													130mm;
	height:													auto;
/*	padding:				.2em;*/
/*	border:					1px solid #BFB9C3;*/
/*	border-right-color:		#DBD6DF;*/
/*	border-bottom-color:	#DBD6DF;*/
	background:				#FFF;
/*	margin:					0 0 0 11em;*/
	margin:													0 0 0 40mm;
	position:				relative;
	z-index:				3;
}
/*
input:focus, select:focus, textarea:focus {
	background:				#FFF9D9;
}

input:focus, input:hover, 
select:focus, select:hover, 
textarea:focus, textarea:hover, 
.submit:focus, .submit:hover {
	border-color:			#A089A9;
}*/


select#person_birthday_3i {
	float:					left;
	width:					3.5em;
/*	margin-left:			.7em;*/
	margin-left:												4mm;
}
select#person_birthday_2i {
/*	width:					7.5em;*/
	width:														30mm;
/*	margin-left:			15em;*/
	margin-left:												48mm;
}

#more_info {
	top:					5mm;
	left:					10mm;
}

#markdown_link, #preview_text {
	display:											none;
}

textarea {
	display:												none;
/*	float:					left;*/
/*	clear:														left;*/
/*	width:					98.4%;*/
/*	width:auto;*/
/*	height:					12.3em;*/
/*	height:														165mm;*/
/*	padding-top:			2em;*/
	padding:													3mm 15mm;
	border:														.3mm solid #000;
/*	margin:					0 1em 0 0;*/
	margin:														auto;
/*	top:					-1.75em;*/
	top:														6mm;
/*	z-index:				1;*/
/*	display:										none;*/
}

fieldset fieldset, fieldset a, fieldset img, #delete_picture, 
#picture, #person_picture, .submit {
	display:					 						none;
}
/* /Forms */


/* Form errors */
#errorExplanation {
	display:											none;
}
/* /Form errors */


/* Markdown instructions */

#markdown_instructions {
/*	width:					19em;*/
/*	padding:				1.4em;*/
/*	position:				absolute;*/
	position:										static;
	page-break-before:								always;
/*	top:					5.3em;*/
/*	left:					38.5em;*/
/*	z-index:				4;*/
}

#markdown_instructions * {
	line-height:			1em;
	padding:				0;
	margin:					0;
}

#markdown_instructions h3 {
	display:				list-item;
	list-style-type:		disc;
	margin:					1.5em 0 .6em 0;
}

#markdown_instructions pre {
	width:					7.5em;
	padding:				0 .1em .2em .1em;
	margin:					.5em 0 -1.1em 0;
}

#markdown_instructions p.output_sample {
	margin-left:			10.5em;
}

#markdown_instructions h1.output_sample {
	margin:					-.9em 0 0 5.1em;
} 

#markdown_instructions h2.output_sample {
	margin-left:			8.6em;
}

#markdown_instructions ul.output_sample {
	margin:					-2em 0 0 9.1em;
}

#markdown_instructions ol.output_sample {
	margin:					-2.2em 0 0 9.5em;
}

#markdown_instructions img.print.output_sample {
	width:					60mm;
}

#markdown_instructions pre.screen.input_sample, 
#markdown_instructions img.screen.output_sample {
	display:											none;
}

#markdown_instructions .link, 
#markdown_instructions .image {
	width:					100%;
	margin-bottom:			.4em;
}

#more_tips {
/*	margin-top:				1.5em;*/
	display:									none;
}
/* /Markdown instructions */


/* More info */
.more_info img, .more_info object, 
#markdown_instructions img {
	display:				block;
	padding:				2px;
	outline:				1px solid #E6E4DB;
	margin:					.5em auto;
}
/* /More info */


/* Errors 403, 404, 500 */
#page_error {
	float:					left;
	width:					18.75em;
	margin-right:			2em;
	margin-bottom:			10em;
}

#error_warning {
	margin-top:				6em;
}

#page_not_found {
	display:				inline;
}
/* /Errors 403, 404, 500 */

/* Typography global attributes */
html * {
	color:					#000;
    font:                   normal normal normal 1em/1em "Lucida Grande", "Gill Sans", Helvetica, "Trebuchet MS", Arial, Verdana, sans-serif;
}

h1, h2, h3 {
	font-weight:			bold;
}

h1 {
	font-size:											200%;
	font-family:			"Eurostile";
}

h2 {
	color:					#277AAC;
	font-size:				95%;
}

h3 {
	color:					#333;
	font-size:				85%;
}

h4, h5, h6 {
	color:					#555;
	font-size:				70%;
}

p {
	font-size:				80%;
	line-height:			1.15em;
}

p *, p code {
	font-size:				100%;
}

li {
	font-size:				75%;
	line-height:			1.2em;
}

ul li *, ol li * {
	font-size:				100%;
}

code {
	font:					normal normal normal 80%/1.2em "Lucida Console", "Monaco", monospace; 
}

strong {
	font-weight:			bold;
}

em {
	font-style:				italic;
}

a {
	color:					#9E3107;
	outline:				none;
}
a:link {
	text-decoration:		underline;	
}
a:focus, a:hover {
	color:					#FFF;
	text-decoration:		none;
}
/* /Typography global attributes */


/* Header and footer */
#header h1 {
	text-align:										right;
}

#header h1 a, #header h1 a:link {
	text-decoration:		none;
}
#header h1 a:hover {
	text-decoration:		underline;
}

#header h1 img {
/*	color:					#FFF;*/
	color:											#000;
	font-weight:									bold;
	font-family:			"Eurostile";
}

#header p {
/*	color:					#FFF;*/
	color:											#000;
/*	font-size:				70%;*/
	font-size:										85%;
} 
#header p a:link, #header p a:visited {
	color:					#E6E4DB;
	text-decoration:		underline;
}
#header p a:focus, #header p a:hover {
	color:					#FFF;
	text-decoration:		none;
}
/* /Header and footer */


/* Main content */
.subnavigation, #notice {
	text-transform:			uppercase;
}

#notice, #error {
	color:					#000;
	font-size:				90%;
	text-align:				center;
}

#notice {
	font-weight:			bold;
}

#error {
	font-size:				85%;
	line-height:			1.2em;
}
#error, #error a, #error a:link {
	color:					#FFF;
}

img#warning {
	color:					#B53758;
	font-weight:			bold;
	font-size:				200%;
	text-align:				center;
	text-transform:			uppercase;
	letter-spacing:			-.05em;	
}
/* /Main content */


/* Card-shaped areas */
#blank_slate_instructions li, #cards li, 
form, #markdown_instructions, #errorExplanation {
	list-style-type:		none;
}
/* /Card-shaped areas */


/* Blank slate instructions */
h1#how_to_start {
	font-size:				120%;
}

#blank_slate_instructions li {
/*	color:					#277AAC;*/
	font-size:				300%;
	font-weight:			bold;
/*	text-align:				center;*/
}

#blank_slate_instructions p {
	display:inline;
/*	color:					#000;*/
	font-size:				30%;
}

#blank_slate_instructions p.subnavigation a {
	line-height:			3em;
}
/* /Blank slate instructions */


/* Cards */
#cards li {
	font-size:				100%;
}

#cards li * {
	color:												#000;
	line-height:										1.5em;
}

#cards del, #cards ins {
	text-decoration:									none;
}

#cards h2 del {
	font-weight:										bold;
}

#cards h2 {
/*	color:												#000;*/
	font-size:				95%;
}

#cards h2 del {
	font-weight:							bold;
}

#cards h3 {
/*	color:												#000;*/
/*	font-size:				70%;*/
	font-size:											75%;
	text-align:				center;
}

#cards p {
/*	font-size:				80%;*/
	font-size:											85%;
}

#cards p a {
	text-decoration:									none;
}

#cards .info {
	font-size:											70%;
	text-align:											right;
	line-height:										1em;
}

#cards .edit, #cards .delete {
	font-size:				70%;
}
/* /Cards */


/* Forms */
label {
/*	font-size:				90%;*/
	font-size:											80%;
/*	text-align:				right;*/
}

input, select, textarea {
/*	color:					#9E3107;*/
}

input#person_name {
	text-transform:										uppercase;
}

#more_info {
	text-align:				left;
}

#markdown_link, #preview_text {
	color:					#277AAC;
	font-size:				77%;
}
#preview_text {
	text-transform:			uppercase;
}
a#markdown_link:hover, a#preview_text:hover {
	color:					#FFF;
}

textarea {
	font-size:				85%;
	line-height:			1.2em;
}

#delete_picture {
	font-size:				70%;
}

#picture {
	text-align:				center;
}

#person_picture {
	font-size:				85%;
}

.submit {
	font-size:				85%;
	text-align:				center;
}
.submit:active {
	color:					#FFF;
}

#ask_for_login {
	font-size:				75%;
	line-height:			1.2;
}
/* /Forms */


/* Form errors */
#errorExplanation h2 {
	color:					#FFF;
	font-size:				90%;
	text-align:				center;
}

#errorExplanation p {
	font-weight:			bold;
	text-align:				center;
}
/* /Form errors */


/* Markdown instructions */
#markdown_instructions * {
	color:											#000;
}
/* /Markdown instructions */


/* More info */
#facebox img, 
#markdown_instructions img {
	color:					#999;
	font-size:				120%;
	text-align:				center;
}
/* /More info */


/* Errors 403, 404, 500 */
#page_not_found {
	line-height:			2.5em;
}
/* /Errors 403, 404, 500 */

#facebox * {
	color:					#000;
	background:				none;
	outline:				none;
	border:					none;
}

#facebox table {
 	margin:					auto;
}

#facebox .body {
	padding:				1em 2em;
	border:					.3mm solid #888;
}

#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br, 
#facebox .top, #facebox a.close, #facebox .footer {
	display:				none;
}

#facebox h1 {
	font-size:				150%;
}

/* The following selector deals with huge URLs, images and some <pre> tags.
Not very aesthetic, but seems to work.
For now, let's hope people won't abuse it that much. */
#facebox p {
	overflow:				hidden;
}

#facebox img {
	display:				inline;
	padding:				2px;
	outline:				1px solid #DDD;
	margin:					0 auto;
}