/******************************************************************
 * Title: Lessonshare master styles
 * Author: admin@lesson-share.com
 * Copyright:  2009, Lessonshare, LLC.
 * All rights resevered (please don't re-use without permission).
*******************************************************************/

body {
   font-family: arial, helvetica, sans-serif;
   font-size: 80%;
   text-align: center; /* To center layout in IE5/Win */
   line-height: 1.4;
   color: #000000;
   background: #FFFFFF;
   margin: 0;
   padding: 0;
   }

 img {
	border: none;
	}


/* Headings & Paragraphs
 * =========================== */
h1 {
	font-size: 1.4em;
	margin: 0;
	border-bottom: 1px solid #DDDDDD;
	}
h2 {
	font-size: 1.2em;
	margin: 10px 0 5px 0;
	border-bottom: 1px solid #DDDDDD;
	}
h3 {
	font-size: 1.0em;
	margin: 5px 0 0 0;
	}
p {
   font-size: 1.0em;
   margin: 10px 0;
   }
p.big-top {
    margin-top: 25px;
    }

/* Links
 * =========================== */
a { 
   outline: none;
   text-decoration: none;
   }
a:link, a:visited, a:hover, a:active { 
   color: #0000FF;
   }
a:hover {
   text-decoration: underline;
   }


/* Lists
 * =========================== */
ul,ol {
	margin: 5px 0;
	padding: 0;
   list-style-type: none;
	}
li {
   margin: 0;
   padding: 0;
   }

/* Bullets */
ul.bulleted {
   margin-left: 1em;
   list-style: disc;
   list-style-position: outside;
   }
ul.bulleted li {
   margin: 5px 2px;
   padding-left: 5px;
   }

/* Ordered */
ol {
   margin-left: 1em;
   }
ol li {
   margin: 5px 1em;
   list-style-type: decimal;
   list-style-position: outside;
   }


/* Tables
 * =========================== */
table {
    margin: 0;
    padding: 0;
    border-collapse: collapse;
    }
th, td {
    padding: 5px 10px 5px 0;
    }
table.faded th {
    color: #999999;
    }
table.right-heads th {
    text-align: right;
    }

/* Forms
 * =========================== */
form {
	margin: 0;
	padding: 0;
	}
fieldset {
    border: 1px solid #DDDDDD;
    }
legend {
    color: #666666;
    }
input, textarea, select {
    font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
    padding: 4px;
	border: 1px solid #BBBBBB;
	}
textarea.fullwidth {
	width: 98%;
    display: block;
	overflow-y: auto;
	overflow-x: hidden;
	}
.side-th th {
   color: #333;
	padding: 5px 15px 5px 0;
	vertical-align: top;
	text-align: left;
	}
.disabled {
	background-color: #EEEEEE;
	}
.loading {
	background-color: #FFFFCC;
	}
.hint {
	font-size: 0.9em;
	color: #999999;
	}
tr.pad-bottom th, tr.pad-bottom td {
   padding-bottom: 15px;
   }

/* Messages */
.feedback_inline,
.error-message { /* used by validation */
   color: #333;
	font-size: 0.9em;
	margin: 5px 0;
	padding: 2px 5px;
	}
.error,
#authMessage, /* used by Auth */
.error-message { /* used by validation */
	background-color: #FFCCFF;
	border: 1px solid #FF66CC;
	}



/*	LAYOUT
---------------------*/
#page,
#header,
#footer {
	width: 950px;
	margin: 0 auto;
	text-align: left; /* Re-aligns "body" definition */
	}
#header {
   width: 970px;  /* +20px provide over hang */
   height: 50px;
	margin-bottom: 15px;
   background: #FFFFFF url(/img/head.png) no-repeat top center;
	}
a#logo {
   position: relative;
   left: 10px;
   top: 12px;
   	width: 178px;
	height: 27px;
	background: url(/img/logo.png) no-repeat top left;
	display: block;
	}
/*
#menu { 
	width: 500px;
	height: 50px;
	float: right;
	color: #FFFFFF;
	}
*/
#left_column {
	width: 625px;
	float: left;
	}
#right_column {
	width: 300px;
	margin-top: 25px;
	float: right;
	}
/*
.content {
	padding: 10px 0;
	}
*/
#footer {
	color:#666666;
	font-size: 0.9em;
	padding: 10px 0;
	}
#footer ul {
	width: 640px;
	float: left;
	}
#footer li {
 	float: left;
	margin-right: 10px;
	}


/*	Inline Lists
------------------------------------------------------------------------*/
ul.inline {
	display: inline;
	}
ul.inline li {
	display: inline;
	}

	
/* RIGHT COLUMN SECTIONS
------------------------------------------------------------------------*/
#right_column p {
	margin: 0 0 10px 0;
	}
#right_column .subsection {
   margin-bottom: 15px;
   }
#basic-info {
	background-color: #D6E9F8;
	}
#basic-info h2 {
	border-color: #99CCCC;
	}
#browse {
	background-color: #EEEEEE;
	}
#browse h2 {
	border-color: #DDDDDD;
	}


/* ROUND CORNERS - 10px
------------------------------------------------------------------------*/
.roundtop {
  background: url(/img/corners/ne_gray.gif) no-repeat top right;
}
.roundtop div {
  font-size: 0;
  height: 10px;
  background: url(/img/corners/nw_gray.gif) no-repeat top left;
}
.roundbottom {
  background: url(/img/corners/se_gray.gif) no-repeat bottom right;
}
.roundbottom div {
  font-size: 0;
  height: 10px;
  background: url(/img/corners/sw_gray.gif) no-repeat bottom left;
}
.roundcontent {
  padding: 0px 10px 0px 10px;
}

#basic-info .roundtop { background-image: url(/img/corners/ne_blue.gif); }
#basic-info .roundtop div { background-image: url(/img/corners/nw_blue.gif); }
#basic-info .roundbottom { background-image: url(/img/corners/se_blue.gif); }
#basic-info .roundbottom div { background-image: url(/img/corners/sw_blue.gif); }


/* User profile
 * =========================== */
img#profile-image {
   margin: 0 10px 5px 0;
   float: left;
   clear: left;
   border: 1px solid #CCCCCC
   }


/* Lesson lists
 * =========================== */
ul#lessons {
   margin: 5px 0;
   padding: 0;
   }
ul#lessons li {
   margin: 0;
	padding: 10px 0;
	border-bottom: 1px solid #DDDDDD;
	}
div.lesson-summary {
	width: 78%;
	float: left;
	clear: left;
	padding-right: 2%;
	border-right: 1px dotted #CCCCCC;
	}
div.lesson-details {
	width: 18%;
	float: right;
	font-size: 0.9em;
	}
.title {
	font-weight: bold;
	}
.description {
	margin: 2px 0;
	}
.author {
   color: #666666;
   font-size: 0.9em;
   line-height: 1.6;
   }
span.tags, span.options {
   color: #666666;
	font-size: 0.9em;
	margin-top: 5px;
	padding: 2px 5px;
	display: block;
   background-color: #EFEFEF;
	}

   
/*	LESSONS
------------------------------------------------------------------------*/
/*** Sections ***/
div.section {
	width: 100%;
	margin: 15px 0px;
	}
		
/*** Preview Styles ***/
.movable {
	cursor: move;
	border: 1px solid #DDDDDD;
	}
.preview-inner {
	margin: 10px;
	}
pre.tab,
textarea.tab {
	font-family:"Courier New", Courier, mono;
	font-size: 12px;
	}


/*** Build Options ***/
#build-options {
	margin: 40px 0 20px 0;
	padding-bottom: 15px;
	border-top: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	}
#share-status {
	margin-bottom: 15px;
	}
.video_preview {
	float: left;
	clear: left;
	margin-right: 10px;
	}

/*** Lesson View ***/
#info {
	padding: 5px 0 10px 0;
	margin-bottom: 10px;
	border-bottom: 1px dotted #CCCCCC;
	}
#lesson-options {
	margin: 40px 0 20px 0;
	padding-bottom: 15px;
	border-top: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	}
#tabs {
	padding-top: 10px;
	display: block; /* give full width */
	font-weight: bold;
	background-color: #EEEEEE;
	border-bottom: 1px solid #DDDDDD;
	}
#tabs li {
	line-height: 2;
	margin-left: 7px;
	}
#tabs a {
	padding: 5px 10px;
	border-top: 1px solid #DDDDDD;
	border-right: 1px solid #DDDDDD;
	border-left: 1px solid #DDDDDD;
	}
#tabs a.active-tab {
	border-bottom: 1px solid #FFFFFF; /* covers ul#tabs border in IE */
	background: #FFFFFF;
	}
.panel {
	display: none;
	}
.panel.active-tab-body {
	display: block;
	}
.memo_entry {
	padding: 5px 0;
	border-top: 1px dotted #CCCCCC;
}

/*	clear fix
 * credit to http://www.positioniseverything.net/easyclearing.html
 * use on container that holds floats
------------------------------------------------------------------------*/
/* This needs to be first because FF3 is now supporting this */
.clearfix {display: inline-block;}

.clearfix:after {
    content: " ";
    display: block;
    height: 0;
    clear: both;
    font-size: 0;
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

<!--[if IE]>
.clearfix {
  zoom: 1%;     /* triggers hasLayout */
  display: block;     /* resets display for IE/Win */
  }  /* Only IE can see inside the conditional comment
    and read this CSS rule. Don't ever use a normal HTML
    comment inside the CC or it will close prematurely. */
<![endif]-->

.clear {
	clear: both;
	}


/*	ReCAPTCHA
------------------------------------------------------------------------*/
div#recaptcha_widget{
	width: 400px;
	}
div#recaptcha_image {
	border: 1px solid #999999;
	margin-bottom: 5px;
	}
div#recaptcha_wrap {
	float: left;
	}	
div#recaptcha_options {
	float: left;
	margin-left: 10px;
	}


/*	FEEDBACK & ERRORS MESSAGES
------------------------------------------------------------------------*/
#ajax_status {
	margin: 5px 0;
	padding: 0 5px;
	background-color:#DDF4F2;
	border: 2px solid #99CCCC;
}
.message { /* Used by CakePHP */
	margin: 5px 0;
	padding: 5px 10px;
	background-color:#DDF4F2;
	border: 1px solid #99CCCC;
	}


/*	FEED LINKS
------------------------------------------------------------------------*/
h1 a.rss {
	width: 14px;
	height: 14px;
	background: url("/img/atomfeed.png") no-repeat right top;
	margin-top: 7px;
	float: right;
	clear: right;
	}

/*	miscellaneous
------------------------------------------------------------------------*/
#toggleable div { 
	display: none; 
	}
.subtle {
	font-size: 0.9em;
	color:#999999;
	}
.faded {
    color: #999999;
    }
.noborder {
	border: none;
	}
.pointer {
	cursor: pointer;
	}
.block {
   display: block; /* Don't need <br /> */
   }
.paginate-options {
   padding: 2px 5px;
   background: #CCFF99;
}