/* ========================================================================== */

/* avoid browser inconsistencies */
ol,ul,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input,div,center
{ margin:0; padding:0; }

/* remove blue linked image borders */
a img,:link img,:visited img { border:none; }

/* de-italicize address */
address { font-style:normal; }

/* ========================================================================== */

body { background-color: #FFF; margin: 0; padding: 0; }
a { text-decoration: none; color: #3D80CC; margin: 0; padding: 0; }
a:hover { text-decoration: underline; }
li { font-family: tahoma, verdana, arial; font-size: 13px; }

/* ========================================================================== */

#background { position: relative; left: 50%; padding: 0; margin: 0; margin-left: -380px; background: url("/img/back-margins.gif") repeat-y; width: 760px; min-height: 100%; }
#background #flash-message { margin: 4px 16px 12px 16px; padding: 4px; border: 2px solid #FFCD00; background-color: #FFF7AA; font-family: tahoma, verdana, arial, sans serif; font-size: 12px; font-weight: bold; color: #000; text-align: center; }

/* ========================================================================== */

#body { width: 718px; margin: 0; padding: 0 12px 0 12px; font-family: tahoma, verdana, arial; font-size: 0.7em; text-align: left; position: relative; left: 9px; clear: both; }
* html #body { width: 742px; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-table;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* ========================================================================== */

#content { width: 478px; margin: 0; padding: 0; float: left; }

* xhtml #content { width: 492px; }

#content, #content p { font-family: tahoma, arial, sans-serif; }
#content h1 { margin: 0 0 8px 0; padding: 0; font-size: 20px; }
#content h2 {
	font-family: helvetica, arial, sans serif;
	font-weight: bold;
	font-size: 16px;
	color: #000;
	border-left: 8px solid #99C9FF;
	background-color: #E5F1FF;
	vertical-align: middle;
	padding: 4px 2px 2px 10px;
	margin: 0;
}

#content h2 a, #content h2 a:visited {
	font-size: 12px;
	font-weight: bold;
	color: #FF366C;
	border-left: 2px solid #FFF;
	padding: 0 2px 0 4px;
	position: relative;
	top: -1px;
	margin: 0 0 0 4px;
}

#content td {
	vertical-align: top;
}

#content ol {
	margin: 0;
	padding: 0;
}

/* ========================================================================== */

div.errorSection {
	font-size: 14px;
	background-color: #FE9;
	border: solid 1px #FA6;
	text-align: left;
	padding: 16px;
	margin: 0 0 16px 0;
}

.errorList td {
	font-family: arial;
	font-size: 12px;
	font-style: italic;
}

td.errorIcon {
	width: 16px;
	vertical-align: top;
}

/* ========================================================================== */

input.checkbox {
	width: 20px;
}

input#submitButton {
	width: 100px;
	margin-left: 100px;
	margin-bottom: 0px;
	padding-bottom: 0px;
}

form {
	margin: 0px;
	padding: 0px;
	border: 0px;
}

br {
	clear: left;
}

/* ========================================================================== */

#site-url {
	font-size: 14px;
	margin: 0 0 8px 0;
}

#inputForm #site-url input {
	position: relative;
	width: 200px;
	padding: 0;
	margin: 0;
}

* html #inputForm #site-url input {
	top: 2px;	
}

/* ========================================================================== */

#buttons {
	text-align: center;
	font-size: 15px;
	margin: 0 0 16px 0;
}

* html #buttons {
	padding: 0;
}

#buttons input#submitButton {
	padding: 0;
	margin: 0;
	width: 100px;
	height: 30px;
}

* html #buttons input#submitButton {
	position: relative;
	top: 6px;
}

/* ========================================================================== */

#footer {
	font-family: tahoma;
	font-size: 0.7em;
	color: #AAA;
	background-color: #222;
	clear: both;
	margin: 0; padding: 0;
	width: 742px;
	height: 25px;
	position: relative;
	left: 9px;
}

#siteLinks {
	background-color: #222;
	padding: 6px 8px 0 8px;
	float: left;	
}

#copyright {
	background-color: #222222;
	padding: 6px 8px 0 8px;
	float: right;
}

/* ========================================================================== */
.content_image {
	overflow: auto;
	width: 99%;
	overflow-y: hidden;
	border: 1px solid #DDD;
}

.content_image img {
	padding: 16px 4px 16px 4px;
}

/* ========================================================================== */
#content pre {
	overflow: auto;
	width: 99%;
	overflow-y: hidden;
	border: 1px solid #DDD;
	padding: 24px 8px 24px 8px;
}

/* ========================================================================== */

#content #pagination {
	font-size: 14px;
	text-align: left;
	padding: 0 0 6px 0;
	margin: 16px 0 0 0;
}

#content #pagination a {
	border: 1px solid #3D80CC;
	padding: 2px 6px 2px 6px;
	font-weight: normal;
}

#content #pagination a:hover {
	background: #3D80CC;
	color: #FFF;
	text-decoration: none;
}

#content #pagination .currentpage {
	border: 1px solid #3D80CC; /* #FF366C; */
	font-weight: bold;
	background: #3D80CC; /* #FF366C; */
	color: #FFF;
	padding: 2px 6px 2px 6px;
}

#content #pagination .inactive {
	color: #CCC;
	border: 1px solid #CCC;
	padding: 2px 6px 2px 6px;
	font-weight: normal;
}

/* ========================================================================== */

#content .item {
	font-family: verdana, tahoma, arial, sans-serif;
	margin: 0 0 16px 0;
	padding: 0;
	border: 0;
}

#content .item h3 {
	font-size: 12px;
	line-height: 150%;
	background-color: #E5F1FF;
	color: #4DA0FF;
	padding: 4px 8px 6px 8px;
	margin: 0;
	border-top: 2px solid #99C9FF;
}

#content .item h3 small {
	line-height: 100%;
	font-size: 11px;
	font-weight: normal;
}

* html #content .item h3 {
	line-height: 120%;
}

#content .item p {
	font-family: verdana, tahoma, arial, sans-serif;
	font-size: 11px;
	margin: 4px 8px 4px 8px;
	color: #888;
}

#content .item p em {
	color: #AAA;
	font-weight: bold;
	font-style: normal;
}

#content .item .actions {
	border-top: 0;
	padding: 4px 0 4px 8px;
	background-color: #E5F1FF;
	color: #FFF;
	font-weight: bold;
}

#content .item .actions a {
	padding: 0;
	color: #FF366C;
}

/* =========================================================================== */
#content .frame {
	font-family: verdana, tahoma, arial, sans-serif;
	font-size: 11px;
	line-height: 200%;
	margin: 16px 0 16px 0;
	border: 2px solid #FD6;
	background-color: #FFC;
	padding: 8px;
	text-align: center;
}

#content .frame p {
	font-family: verdana, tahoma, arial, sans-serif;
	font-size: 11px;
}

/* =========================================================================== */
#content .published {
	padding: 8px;
	margin: 8px 0 16px 0;
	background-color: #DFD;
	border: 2px solid #0B0;
	color: #0B0;
	text-align: center;
	font-family: verdana, tahoma, arial, sans-serif;
	font-size: 11px;
}

#content .not_published {
	padding: 8px;
	margin: 8px 0 16px 0;
	background-color: #FDD;
	border: 2px solid #B00;
	color: #B00;
	text-align: center;
	font-family: verdana, tahoma, arial, sans-serif;
	font-size: 11px;
}

/* =========================================================================== */

.embed {
	margin: 0;
	border: 0;
	padding: 0;
	text-align: left;
}

embed, object {
	width: 460px;
	height: 360px;
	margin-bottom: 8px;
	border: 0;
	padding: 0;
	color: #FFF;
	background-color: #FFF;
	text-align: left;
}

embed.odeo {
	height: 100px;
}

/* =========================================================================== */

ul.history, ul.history li {
	font-family: verdana, tahoma, arial, sans-serif;
	font-weight: normal;
	font-size: 11px;
	line-height: 150%;
	padding: 0;
	margin: 0;
}

ul.history li {
	list-style: none;
	padding: 8px 0px 8px 20px;
	xbackground-image: url(/img/icon/comment.png);
	background-repeat: no-repeat;
	background-position: 0 8px;
	border-top: 2px solid #EEE;
}

/* =========================================================================== */

img.user { width: 16px; height: 16px; margin: 0 4px 0 4px; padding: 0; float: left; border: 1px solid #CCC; }

#content img.user_logo { width: 16px; height: 16px; position: relative; top: 4px; margin: 0 4px 0 8px; border: 1px solid #CCC; padding: 0; }

.lesson .body small { position: relative; top: 2px; }

#content img.user_logo_www { width: 16px; height: 16px; position: relative; top: 4px; margin: 0 4px 0 2px; border: 1px solid #CCC; padding: 0; }

/* =========================================================================== */

#content .top_rank {
	clear: both; border-top: 2px solid #EEE;
}

#content .top_rank img {
	border: 4px solid #DDD; float: left; margin: 8px 8px 8px 0;
	background-image: url(/img/photo-default.png);
}

#content .top_rank .desc {
	float: left; width: 300px; margin-top: 8px; font-size: 12px;
}

#content .top_rank .desc b {
	font-size: 16px;
}

#content .top_rank .desc .no {
	font-family: arial black; font-size: 32px;
}

#content .rank {
	font-family: verdana, tahoma, sans-serif; font-size: 11px; clear: both; border-top: 2px solid #EEE; padding: 0;
}

#content .rank img {
	position: relative; left: 2px; top: 4px; border: 1px solid #EEE;
}

#content .rank .desc {
	margin: 8px 8px 12px 8px; padding: 0; line-height: 150%;
}

#content .rank .desc .no {
	font-family: arial black; font-size: 16px;
}

/* ============================================================================= */
#content .history {
	font-family: verdana, tahoma, arial, sans-serif; border-bottom: 2px solid #EEE; padding-bottom: 8px; margin-bottom: 8px;
}

#content .history img.logo {
	width: 16px; height: 16px; float: left; border: 1px solid #AAA; margin-right: 4px; position: relative; top: -2px;
}

#content iframe.clipmarks {
	width: 400px;
	height: 300px;
	border: 1px solid #AAA;
	padding: 2px;
}

/* ============================================================================= */

#content #controls {
	font-family: verdana; background-color: #EEE; margin-bottom: 16px;  border-top: 2px solid #BBB;
}
#content #controls #ctrl_head {
	color: #444; font-weight: bold; background-color: #DDD; padding: 6px;
}
#content #controls #ctrl_body {
	padding: 8px;
}
#content #controls #ctrl_body input.submit {
	width: 80px; float: right;
}
#content #controls #ctrl_body label {
	width: 100px; float: left; padding-top: 2px;
}
#content #controls #ctrl_body select {
	margin-right: 8px; margin-bottom: 8px; font-size: 11px; font-family: verdana;
}

/* ============================================================================== */
#content div.form_header_first, #content div.form_header, #content div.form_header_desc {
	border-bottom: 1px solid #3D80CC;
	color: #3D80CC;
	font-family: helvetica, arial;
	font-size: 24px;
	letter-spacing: -2px;
	margin-bottom: 24px;
}

#content div.form_header {
	margin-top: 32px;
	margin-bottom: 24px;
}

#content div.form_header_desc {
	margin-top: 32px;
	margin-bottom: 8px;
}

#content div.form_desc {
	margin-bottom: 24px;
	color: #999;
}

/* ============================================================================== */

#top { border: 0; margin: 0; padding: 0; background: #7A7A7A; }
#top img { float: left; margin: 0; padding: 0; border: 0; }
#top_content { text-align: right; color: #FFF; font-family: arial, sans-serif; font-size: 11px; font-weight: bold; padding: 3px 12px 0 0; height: 17px; border-bottom: 1px solid #444; }
* html #top_content { height: 21px; }
#top_content a { color: #FFF; }

/* ============================================================================== */

.action { display: block; font-family: helvetica; font-size: 24px; letter-spacing: -2px; line-height: 42px; margin: 0; padding: 0; clear: both; position: relative; top: -8px; }
.action img { margin: 0 12px 0 0; padding: 0; position: relative; left: 2px; top: 8px; }
