* { margin: 0; padding: 0; }

body { 
	background: url('/m/images/header.jpg') no-repeat 50% 0%; 
	background-color: #fff; 
	color: #222; 
	font: 13px/1.5em "Helvetica", arial, verdana, sans-serif !important; 
	line-height: 1.5em !important; 
	text-align: center; 
	width: auto;
}

.clear { clear: both;}
.noborder { border: none !important; }

h2 {
	margin-top: 1.5em;
}

h3 {
	margin-top: 0.5em;
}

p {
	margin-top: 1em;
}

ul, ol {
	margin: 1.5em 3em;
}

ul li, ol li {
/*	margin-bottom: 1.5em;
*/}

li p {
	margin-top: 0.25em;
}

a, a:link {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

/*** Template ***/
#header { 
/*	border-bottom: 1px solid #97c71c;*/
	width: 850px;
	height: 75px;
	margin: 0 auto;
	position: relative;
	text-align: left;
	}

#header h1 {
	position: absolute;
	width: 275px;
	height: 75px;
}
#header h1 a {
	display: block;
	width: 275px;
	height: 75px;
}

#header h1 a span {
	display: none;
}

	#nav {
		border-bottom: 1px solid #aaa;
		color: #fff;
		text-align: left;
		padding-top: 1em;
		margin-bottom: 0em;
	}

	#nav ul {
		list-style: none;
		padding:0;
		height: 2em;
	}

	#nav ul li {
		display: inline;
		padding: 0;
	}

	#nav ul li.first {
		padding-left: 0;
	}

	#nav ul a:link, #nav ul a:visited {
		float: left;
		background-color: #DEEBB8;
		border: 1px solid #bBc4aB;
		border-bottom: none;
		
		-moz-border-radius-topleft: 4px;
		-moz-border-radius-topright: 4px;
		-webkit-border-top-left-radius: 4px;
		-webkit-border-top-right-radius: 4px;
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
		
		padding: 0.3em 0.5em 0.1em 0.5em;
		margin-right: 0.4em;
		text-decoration: none;
		color: #444;
	}
	#nav ul a:hover {
		background-color: #E6ECD4;
	}
	#nav ul a.active {
		background-color: #fff;
		border-color: #aaa;
		border-bottom: 1px solid #fff;
	}

	#subnav {
		color: #fff;
		text-align: left;
		margin-bottom: 0em;
		padding-left: 50px;
	}

	#subnav ul {
		list-style: none;
		padding:0;
		height: 2em;
	}

	#subnav ul li {
		display: inline;
		padding: 0;
	}

	#subnav ul li.first {
		padding-left: 0;
	}

	#subnav ul a:link, #subnav ul a:visited {
		float: left;
		background-color: #d6f3fe;
		border: 1px solid #bBc4aB;
		border-top: none;
		
		-moz-border-radius-bottomleft: 4px;
		-moz-border-radius-bottomright: 4px;
		-webkit-border-bottom-left-radius: 4px;
		-webkit-border-bottom-right-radius: 4px;
		border-bottom-left-radius: 4px;
		border-bottom-right-radius: 4px;
		
		padding: 0.2em 0.2em 0.1em;
		margin-right: 0.4em;
		text-decoration: none;
		color: #444;
	}
	#subnav ul a:hover {
		background-color: #E6ECD4;
	}
	#subnav ul a.active {
		background-color: #fff;
		border-color: #aaa;
		border-bottom: 1px solid #fff;
	}


#main-body {
	padding-top: 2em;
	background: url('/m/images/commoner-id.png') no-repeat 108% -15px;
}

#main-body.register, #main-body.edit {
	background-image: url(/m/images/edit.png);
	background-position: 100% -1px;
}

#main-body.openid {
	background-image: url(/m/images/openid.png);
	background-position: 102% 1px;
}

#main-body.works {
	background-image: url(/m/images/works.png);
	background-position: 100% 1px;
}

#main-body.organization {
	background-image: url(/m/images/commoner-org.png);
	background-position: 102% 1px;
}

.box {
	text-align: left;
	width: 800px;
	margin: 0 auto;
}

.nbox {
	width: 825px;
}

#footer {
	background-color: #eee;
	color: #666;
	padding: 2em 0 4em 0;
	margin-top: 10em;
}

#license {
	font-size: 90%;
}
#license img {
	float: left;
	margin-right: 1em;
	padding-top: 3px;
	padding-bottom: 3em;
}

.block {
	margin-bottom: 3em;
}

#title {
	padding: 1em 0;
	border-bottom: 1px solid #888;
	margin-right: 160px;
	color: #000;
	font-size: 125%;
}

.index #title {
	padding-top: 0;
}

#title h1 {
	line-height: 1.15em;
}

#title h3 {
	color: #888;
	margin-top: 0.25em;
	margin-bottom: 0.25em;
	line-height: 1.25em;
}


.column {
	width: 45%;
	float: left;
}
.column-wide {
	width: 62%;
	padding-right: 4%;
}
.column-narrow {
	width: 33%;
}


/*** FORMS ***/

div.form {
	background: url(../images/paper.png);
	background-color: #f9f6e2;
	margin-top: 0.5em;
	margin-left: -1.5em;
	padding: 1.5em;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}

div.form h2 {
	margin-top: 0;
}

div.form h3.notice {
	color: #800;
}

div.form input[type="text"], div.form .field #id_photo {
	width: 300px;
	font-size: 102%;
}

.field_label {
	display: inline-block;
	width: 8em;
}

div.form form .field {
	margin: 1em 0 1.5em 0;
	padding-bottom: 1.5em;
	border-bottom: 1px solid #EEDFCC;
}
div.form form .promo-field { text-align:center }
div.form form .promo-field input[type="text"] {
    line-height:2em;
    border: 1px solid #999;
    padding:5px;
    width:5em;
    font-family:monospace;
    font-size:24px;
}

div.form form .field .help {
	font-style: oblique;
	font-size: 95%;
	margin-top: 0.5em;
	margin-left: 8.5em;
}

div.form form textarea {
	width: 500px;
	margin: 1em 0;
	padding: 0.25em;
}

.form #photo {
	overflow: auto;
	display: block;
}
.form #photo img {
	float: left;
	margin-right: 0.75em;
	margin-bottom: 0.5em;
	padding: 7px;
	border: 1px solid #EEDFCC;
	background-color: #fff;
}

/*** Index ***/
div#aboutcc {
    background: url(../images/paper-green.png);
    background-color: #f9f6e2;
    margin: 3em -1.5em;
    padding: 1.5em;
    -moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}

div.benefits h2 {
	margin-top: 0;
}

ul#benefit_list {
	width: 100%;
	list-style: none;
	margin: 0 0 0em 0;
	overflow:hidden;
}

ul#benefit_list li {
	width: 260px;
	text-align: center;
	float: left;
}
ul#benefit_list li h2 {
	margin-top: 0.25em;
}

div#join_network {
	width: 66%;
	margin: 2em auto 0 auto;
	padding: 0.5em;
	overflow: auto;
	text-align: center;
}

div#join_network h2, div#join_network h3 {
	width: 66%;
	line-height: 1em;
	padding: 0;
	margin: 0 auto ;
}

div#join_network h2 a, div#join_network h3 a {
	color: #5E3B20;
	text-decoration: none;
	display: block;
	padding: 15px;
	margin: 7px;
}
div#join_network h3 a:hover {
	text-decoration: underline;
}

div#join_network h2 a {
	margin: 3px;
	border: 1px solid #A07D65;
	background-color: #f0f0f0;
	font-size: 125%;
}

div#join_network h2 a:hover {
	background-color: #A07D65;
	color: #fff;
}
/*** About Page ***/
#about ul#benefits {
	list-style: none;
	margin: 1.5em 0;
}

#about ul#benefits li {
	overflow: auto;
}

#about ul#benefits li img {
	float: left;
	margin-right: 1.5em;
}

/*** Profile ***/

.profile-info img {
	float: left;
	margin-right: 10px;
}

.profile-info ul img {
	margin-top: 0;
}

.profile-info p {}

.profile-info ul {
	list-style: none;
	font-style: italic;
	margin: 0;
}

.profile-info ul li {
	margin-bottom: 0.25em;
}

.profile-info .story {
	padding-top: 1em;
}

ul.licensed-works {
	list-style: none;
	/*border: 1px solid #ccc;
	*/
	background: url(/m/images/paper-green.png);
	-moz-border-radius: 8px;
	padding: 0.5em;
	margin: 0;
}

ul.licensed-works li {
	margin-bottom: 0.75em;
	padding: 0.25em 0;
	padding-bottom: 1em;
	border-bottom: 1px solid #cFdEbC; /*#d4d4d4;*/
}

ul.licensed-works li img {
	display: inline-block;
	margin-bottom: -4px;
}

ul.licensed-works li.last {
	border: none;
}

.profile-box {
	/*border: 1px solid #ccc;
	*/
	background: url(/m/images/paper-green.png);
	-moz-border-radius: 8px;
	padding: 0.5em;
	margin: 0;
	padding-bottom: 1.5em;
	margin-bottom: 2em;
}

.profile-box img {
	float: left;
	padding-right: 10px;
}

.profile-box p {
	margin-top: 0 !important;
	line-height: 1.25em;
}

.profile-box input {
	margin-top: 10px;
	width: 97%;
}

a.add_work {
	float: right;
	color: #000;
	padding: 2px 4px;
	border: 1px solid #ddd;
	background-color: #fff;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
}

.messages {
    padding: 1px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    background-color: #effda7;
    margin-bottom: 1em;
}

.messages ul {
    margin: 1em;
    margin-left: 1.5em;
}

.site_messages p {
    margin:0;
    padding:5px;
}

/*** Registration ***/

iframe.tos {
	background-color: #fff;
	width:750px;
	height: 150px;
	border:1px solid #ccc;
	padding: 10px;
}

.id_agree_to_tos{ padding: 20px; }

div#register-form .field_label {
    font-weight: bold; 
	width: 120px;
	padding-right: 5px;
	text-align: right;
}

div#register-form input[type="text"], div#register-form .field #id_photo {
	width: 150px;
	font-size: 102%;
}
span#openidurl { padding-right:5px; }

/*** About ***/
ul#benefits li {
	margin-bottom: 1.5em;
}

.promo_code_box {
    background-color: #B7FB8C;
    border-style: dashed;
    border-width: 2px;
    border-color: #989C8C;
    margin-top:-10px;
    margin-bottom:10px;
    margin-left: auto;
    margin-right: auto;
    padding:20px;
    width:30em;
    text-align:center;
}

.account_box {
    background-color: #EEEEEE;
    font-size:2em;
    border-style: solid;
    border-width: 1px;
    border-color: #989C8C;
    margin-top:10px;
    margin-right: 10px;
    margin-bottom:10px;
    margin-left: auto;
    margin-right: auto;
    padding:15px;
    text-align:center; 
}

.account_box h2 a{
	color:#5E3B20;
	line-height: 1.1em;
	margin-top: -55px;
	display:block;
}

.account_box_container {
	display: table-cell;
    margin-left: auto;
    margin-right: auto;
	vertical-align:middle;
	float: center;
	width: 350px;
	padding: 10px;
    height: 10em;
}

.account_box p { font-size:10px; }

.container {
	margin-right:auto;
	margin-left:auto;
	text-align:center;
}

.form {	
    /* margin-top:-40px; */
}

input#id_promo{
	margin-bottom:10px;
}

.backlink {
    float:right;
}
