/*	.........................
	GetOpenID.com stylesheet
	Four Kitchen Studios, LLC
	http://fourkitchens.com
	.........................


COLORS ........................
x-light blue	#E6EBFF rgb(230,235,255)
light blue	#BFCFFF rgb(191,207,255)
med blue	#819FFF rgb(129,159,255)
dark blue	#6078C0 rgb(96,120,192)

light red	#E6A0A0 rgb(237,191,191)
med red		#B90101 rgb(185,0,0)

focus yellow	#FFF280 rgb(255,242,128)

light gray	#BEBEBE rgb(190,190,190)
med gray	#A0A0A0 rgb(160,160,160)
dark gray	#646464 rgb(100,100,100)
*/


/* ..... Global Elements ..... */
/* commented backslash hack v2 \*/ 
html, body{ height: 100%; } 
/* end hack */ 
html, body {
	margin: 0;
	padding: 0; 
	}

body {
	font-size: 62.5%; /* resets 1em to 10px */
	font-family: 'Trebuchet MS', Verdana, sans-serif;
	background: white url(images/bg.tiles.gif) top left repeat-x;
	color: rgb(96,120,192);
	text-align: left;
	}

#outer {
	height: 100%;
	min-height: 100%;
	margin: auto;
	position: relative;
	background: url(images/bg.biglogo.gif) bottom left no-repeat fixed;
	}
html>body #outer {height: auto;} /*for mozilla as IE treats height as min-height anyway*/

a, a:active, a:visited, a:hover { text-decoration: none; }

img { border: none; }

h1, h2, h3 {
	margin: 0 0 10px 0;
	padding: 0;
	}
h1 { font-size: 3.5em; }
h2 { font-size: 2.75em; }
h3 { font-size: 2em; }

table { display: table; }
tr { display: table-row; }
thead { display: table-header-group; }
tbody { display: table-row-group; }
tfoot { display: table-footer-group; }
col { display: table-column; }
colgroup { display: table-column-group; }
td, th { display: table-cell; }
caption { display: table-caption; }

.tiny { font-size: .5em !important; }
.small { font-size: .75em !important; }
.big { font-size: 1.5em !important; }
.huge { font-size: 3em !important; }
.b { font-weight: bold; }
.i { font-style: italic; }
.lowercase { text-transform: lowercase; }
.uppercase { text-transform: uppercase; }
.smallcaps { font-variant: small-caps; }
.on { color: rgb(185,0,0); }
.norm { font-weight: normal; text-decoration: none; font-style: normal; }

.noline { border-bottom: none !important; }
.top { margin-bottom: 30px !important; }

.aligntop { vertical-align: top; }
.alignmid { vertical-align: middle; }
.alignbot { vertical-align: bottom; }

.alignleft { float: left; }
.alignright { float: right; }

.textcenter { text-align: center !important; }
.textright { text-align: right !important; }

.hand {
	cursor: pointer;
	cursor: hand;
	}

img.icon {
	margin-right: 5px;
	vertical-align: middle;
	}

div.msg, div.errormsg {
	margin: 0 0 20px 0;
	padding: 5px;
	text-align: left;
	}
	div.msg p, div.errormsg p {
		margin: 0 0 5px 0;
		padding: 0;
		}
	div.msg code, div.errormsg code {
		font-size: 1.25em;
		}

div.msg {
	border-bottom: 1px solid rgb(96,120,192);
	background: rgb(230,235,255);
	color: rgb(96,120,192);
	font-size: 1.25em;
	line-height: 1.5em;
	}
	div.msg a, div.msg a:active, div.msg a:visited,
	h1 a, h1 a:active, h1 a:visited {
		color: rgb(96,120,192);
		border-bottom: 1px dotted rgb(96,120,192);
		}
	div.msg a:hover, h1 a:hover {
		color: rgb(96,120,192);
		border-bottom: none;
		}
	div.msg a.on, div.msg a.on:active, div.msg a.on:visited {
		color: rgb(185,0,0) !important;
		border-bottom: 1px dotted rgb(185,0,0) !important;
		}
	div.msg a.on:hover {
		border-bottom: none !important;
		}
	div.msg a.totop {
		float: right;
		margin: 0 10px 0 10px;
		padding: 0;
		border: none;
		font-size: .75em;
		font-weight: bold;
		text-transform: uppercase;
		}
	div.msg ul {
		list-style: none;
		margin: 0 10px 5px 10px;
		padding: 0;
		}
		div.msg ul li {
			margin: 0 0 3px 20px;
			padding: 0;
			text-indent: -20px;
			}
		div.msg ul li:before {
			content: url(images/bullet.gif);
			}

div.errormsg {
	border: 1px solid rgb(185,0,0);
	background: rgb(237,191,191);
	color: rgb(185,0,0);
	font-size: 1em;
	line-height: 1.25em;
	}
	div.errormsg a, div.errormsg a:active, div.errormsg a:visited {
		color: rgb(185,0,0) !important;
		border-bottom: 1px dotted rgb(185,0,0) !important;
		}
	div.errormsg a:hover {
		color: rgb(185,0,0) !important;
		border-bottom: none !important;
		}

p.last {
	margin: 0 !important;
	padding: 0 !important;
	}
/* ..... end Global Elements ..... */


#header {
	width: 620px;
	margin: 0 auto 30px auto;
	padding: 10px 20px 0 20px;
	background: white url(images/bg.header.gif) bottom left repeat-x;
	border-bottom: 1px solid rgb(96,120,192);
	}
	#fourkitchens {
		width: 100px;
		float: right;
		}
	#logo {
		margin: 0 0 10px 0;
		padding: 0;
		}
		#logo img {
			vertical-align: top;
			}
	#menu {
		text-align: right;
		}
		#menu a, #menu a:active, #menu a:visited {
			display: block-inline;
			margin: 0;
			padding: 5px;
			background-color: rgb(129,159,255);
			border-top: 1px solid rgb(191,207,255);
			border-left: 1px solid rgb(191,207,255);
			border-bottom: 1px solid rgb(96,120,192);
			border-right: 1px solid rgb(96,120,192);
			color: white;
			font-size: 1.25em;
			font-weight: bold;
			}
		#menu a:hover {
			background-color: rgb(230,235,255);
			border: 1px solid rgb(96,120,192);
			color: rgb(96,120,192);
			}
		#menu a.current {
			background-color: rgb(237,191,191) !important;
			border: 1px solid rgb(185,0,0) !important;
			color: rgb(185,0,0) !important;
			}

#page {
	width: 600px;
	margin: 0 auto 0 auto;
	}

#content {
	margin: 0;
	padding: 0;
	}

	form {
		margin: 0;
		padding: 0;
		font-size: 1.15em;
		}
		label {
			margin: 0 0 5px 0;
			padding: 0;
			font-size: 140%;
			font-weight: bold;
			}
		input, textarea {
			padding: 5px;
			color: rgb(96,120,192);
			font-family: 'Trebuchet MS', Verdana, Sans-Serif;
			font-weight: bold;
			}
		input {
			font-size: 1.5em;
			}
		textarea {
			font-size: 1.25em;
			}
		textarea#public_key {
			height: 100px;
			font-weight: normal;
			font-size: 1em;
			}
		input:focus, textarea:focus {
			background: rgb(255,242,128) !important;
			}
		input.text, textarea.text {
			/* REMOVED FOR IE: input[type="text"], input[type="password"] */
			width: 220px;
			background-color: white;
			border: 2px solid rgb(96,120,192) !important;
			}
			input.errormsg, textarea.errormsg {
				/* REMOVED FOR IE: input[type="text"].errormsg, input[type="password"].errormsg */
				border-color: rgb(185,0,0) !important;
				}
		input.radio {
			/* REMOVED FOR IE: input[type="radio"] */
			}
			div.radiobox {
				display: inline;
				vertical-align: middle;
				}
		input.submit {
			/* REMOVED FOR IE: input[type="submit"] */
			background: rgb(230,235,255) url(images/bg.button.gif) bottom left repeat-x;
			border-top: 2px solid rgb(129,159,255);
			border-left: 2px solid rgb(129,159,255);
			border-bottom: 2px solid rgb(96,120,192);
			border-right: 2px solid rgb(96,120,192);
			cursor: pointer;
			cursor: hand;
			}
		input.submit:hover {
			border: 2px solid rgb(96,120,192);
			background: rgb(255,242,128);
			}
			input.intable {
			/* REMOVED FOR IE: input[type="submit"].intable */
				width: 100%;
				}

	table {
		table-layout: auto;
		border-collapse: separate;
		border-spacing: 0 5px;
		}
		caption {
			margin-bottom: 5px;
			text-align: left;
			color: rgb(185,0,0);
			font-size: 1.1em;
			font-weight: bold;
			}
		tr {
			background-color: rgb(230,235,255);
			}
			tr.nobg {
				background: transparent !important;
				}
		th, td {
			border-bottom: 1px solid rgb(96,120,192);
			vertical-align: middle;
			}
			th.noline, td.noline {
				border-bottom: none;
				}
		th {
			width: 100%;
			padding: 5px 0px 5px 5px;
			}
			th p {
				margin: 0 0 5px 0;
				padding: 0;
				}
		td {
			padding: 5px;
			text-align: center;
			}
			td p {
				margin: 0 0 5px 0;
				padding: 0;
				}
			td.submitbutton, td.errormsg {
				padding: 5px 0 0 5px !important;
				}

#create, #auth, #authurl, #signin, #resendpw {
	width: 600px;
	margin: 0 0 50px 0;
	}
	#auth {
		text-align: center;
		}

.step1, .step2, .step3, .step4, .step5, .step6 { padding-left: 50px !important; }
.step1 { background: rgb(230,235,255) url(images/step1.gif) top left no-repeat; }
.step2 { background: rgb(230,235,255) url(images/step2.gif) top left no-repeat; }
.step3 { background: rgb(230,235,255) url(images/step3.gif) top left no-repeat; }
.step4 { background: rgb(230,235,255) url(images/step4.gif) top left no-repeat; }
.step5 { background: rgb(230,235,255) url(images/step5.gif) top left no-repeat; }
.step6 { background: rgb(230,235,255) url(images/step6.gif) top left no-repeat; }

#clearfooter { /* needed to make room for footer */
	clear: both;
	height: 75px;
	}
#footer {
	position: absolute;
		bottom: 0;
		left: 0;
	clear: both;
	width: 100%;
	height: 25px;
	margin: 0;
	padding: 0;
	background-color: rgb(191,207,255);
	border-top: 1px solid rgb(96,120,192);
	color: rgb(96,120,192);
	font-size: 1.15em;
	font-weight: bold;
	text-align: left;
	}
	#footer p {
		margin: 0;
		padding: 5px 0 0 10px;
		}
	#footer a, #footer a:active, #footer a:visited {
		color: rgb(96,120,192);
		border-bottom: 1px dotted rgb(96,120,192);
		}
	#footer a:hover {
		color: rgb(96,120,192);
		border-bottom: none;
		}
#fourkitchenslogo {
	position: absolute;
		bottom: 0;
		right: 0;
	width: 65px;
	height: 55px;
	margin: 0 10px 5px 0;
	padding: 0;
	}
