html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
		
/* Typography
-------------------------------------------------------------- */

body { font-family: Arial, Helvetica, sans-serif; font-size: 90%; line-height: 1.3em; font-weight: 200; }

h1 { font-size: 2.0em; margin-bottom: 1em; }
h2 { font-size: 1.8em; margin-bottom: 1em; font-weight: 600; }
h3 { font-size: 1.6em; margin-bottom: 1em; font-weight: 600; }
h4 { font-size: 1.4em; margin-bottom: 1em; font-weight: 600; }
h5 { font-size: 1.2em; margin-bottom: 1em; font-weight: 600; }
h6 { font-size: 1.0em; margin-bottom: 1em; font-weight: 600; }
p { font-size: 1.0em; margin-bottom: 1em; }

a { color: #3e606f; }

ul, ol { margin-left: 1em; margin-bottom: 1em; padding-left: 1em; }
ul li, ol li { margin-bottom: 0.25em; }
ul li ul li, ol li ol li { padding-top: 0; margin-bottom: 0; }
ul { list-style-type: square; }
ol { list-style-type: decimal; }
ol li ol { list-style-type: lower-alpha; }
ol li ul { margin-top: 1em; }

strong, b { font-weight: 600; }
em, i { font-style: italic; }

sup { font-size: 0.8em; vertical-align: super; }
sub { font-size: 0.8em; vertical-align: sub; }

hr { height: 0; width: 100%; border: none; border-bottom: 1px solid #ccc; }

small { font-size: 0.9em; }

.float-right { margin-left: 1em; margin-bottom: 1em; float: right; }
.float-left { margin-right: 1em; margin-bottom: 1em; float: left; }
.no-font-style { font-style: normal; }
.clear { clear: both; }
.indent { padding-left: 2em; }

.playful { font-family: 'Annie Use Your Telescope', cursive; }
.red { color: #cc0000; }

/* Tables
-------------------------------------------------------------- */

.table { width: 100%; /*margin-bottom: 1em;*/ background-color: #fff; }
.table th, .table td { border-top: 1px solid #ddd; padding: 8px; }
.table th { font-weight: bold; }

.table-bordered { border: 1px solid #ddd; border-left: 0; border-collapse: separate; }
.table-bordered tr { border-top: 1px solid #ddd; }
.table-bordered th, .table-bordered td { border-left: 1px solid #ddd; }

.table colgroup + thead tr:first-child th, .table colgroup + thead tr:first-child td, .table thead:first-child tr:first-child th, .table thead:first-child tr:first-child td {
border-top: 0;
}

.table th.centered, .table td.centered { text-align: center; }


/* Grid
-------------------------------------------------------------- */

.container { min-width: 960px; height: 100%; position: relative; }

.header-wrapper { left: 960px; top: 0; right: 0; height: 117px; position: fixed; background: url(../images/header-bg.png) repeat-x; z-index: 500; }
.header-wrapper.module-opener { left: 0; background: url(../images/header-module-opener.png) repeat-x; }

.header { top: 0; min-width: 960px; height: 117px; position: absolute; background: url(../images/header.png) no-repeat; z-index: 600; color: #ffffff; }
/*.header.module-opener { background: url(../images/header-module-opener.png) repeat-x; }*/
.header.module-opener { background: none; }

.body {}
.body div.sidebar { 
	top: 90px; 
	bottom: 27px; 
	width: 117px; 
	position: fixed; 
	overflow-y: auto; 
	-webkit-overflow-scrolling: touch;
}

.body .main { 
	left: 117px; top: 90px; right: 0; bottom: 27px; min-width: 843px; position: fixed; background-color: #fffad5; 

	/* box shadow */
	-webkit-box-shadow: -2px 0px 5px 0px rgba(0, 0, 0, 0.25);
	-moz-box-shadow: -2px 0px 5px 0px rgba(0, 0, 0, 0.25);
	box-shadow: -2px 0px 5px 0px rgba(0, 0, 0, 0.25);
}
.body .main .mainbar { 
	height: 63px; position: relative; background-color: #04756f; color: #ffffff; z-index: 300;

	/* box shadow */
	-webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
}
.body .main .subbar { 
	border-bottom: 1px solid #cfcbad; height: 36px; position: relative; overflow: hidden; background-color: #fffad5; color: #3e606f; text-transform: uppercase; z-index: 200;

	/* box shadow */
	-webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
	box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.25);
}

.body .main .page-wrapper { 
	left: 117px; 
	top: 190px; 
	right: 0; 
	bottom: 27px; 
	position: fixed; 
	overflow-x: hidden; 
	overflow-y: scroll; 
	/*background: #fffad5 url(../images/page.gif) right repeat-y;*/ 
	-webkit-overflow-scrolling: touch;
}

.page { min-width: 843px; position: relative; overflow: hidden; background: #dbdfba; background: #fffad5 url(../images/page.gif) right repeat-y; }

.page .content { margin-right: 179px; /*border-right: 5px solid #7c9688;*/ padding: 10px 30px 10px 30px; min-height: 493px; /*background-color: #fffad5;*/ overflow: hidden; /*float: left;*/ /*background: #fffad5 url(../images/content.gif) right repeat-y;*/ }
.footer { bottom: 0; width: 100%; height: 27px; position: fixed; background: url(../images/footer.jpg); }

.content-spacer { height: 720px; }

.gutter { right: 0; top: 110px; width: 179px; margin-right: 0; position: absolute; z-index: 500; }

html.popup { background: #fffad5; }
.popup .page { background: #fffad5; }


/* Header
-------------------------------------------------------------- */

.header .logo { left: 0; top: 7px; position: absolute; }

.header h1 { 
	left: 60px; top: 5px; position: absolute; font-size: 1.4em; line-height: 1.3em;
	
	/* text shadow */
	text-shadow: 0px 1px 2px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}
.header h1.program-launch { 
	top: 3px; font-size: 1.5em; line-height: 1.8em; 
	
	/* text shadow */
	text-shadow: 2px 2px 3px #000000;
	filter: dropshadow(color=#000000, offx=2, offy=2);
}
.header h1 a { color: #ffffff; text-decoration: none; }

.header .module-opener-headline { position: absolute; left: 340px; top: 0; }

.header ul.globals { right: 110px; top: 0; margin: 0; padding: 0; position: absolute; list-style: none; font-size: 0.9em; z-index: 100; }
.header ul.globals li { margin-left: 5px; padding: 0; float: left; }
.header ul.globals li a { padding: 11px 7px 11px 30px; background: url(../images/globals-arrow-right.png) 10px no-repeat; color: #dae8f5; text-decoration: none; display: block; }
.header ul.globals li a:hover { text-decoration: underline; }
.header ul.globals li ul { 
	margin: 0; padding: 0; width: auto; position: absolute; list-style: none; background-color: #000000; display: none; z-index: 400;

	/* box shadow */
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
}
.header ul.globals li:hover ul { display: block; }
.header ul.globals li ul li { margin-left: 0; float: none; }
.header ul.globals li ul li a { padding: 5px 16px 5px 16px; display: block; background: transparent; }
.header ul.globals li:hover ul li a { text-decoration: none; }
.header ul.globals li:hover ul li:hover a { text-decoration: underline; }

.header ul.globals li a.active { background: #000000 url(../images/globals-arrow-down.png) 10px no-repeat; }

.header ul.persistence { right: 10px; top: 0; margin: 0; padding: 0; position: absolute; list-style: none; }
.header ul.persistence li { margin-left: 5px; float: left; }
.header ul.persistence li a img { width: 24px; height: 32px; }

.header ul.nav { 
	left: 125px; top: 37px; margin: 0; padding: 0; position: absolute; list-style: none; text-transform: uppercase;
	 
}
.header ul.nav li { margin-right: 10px; padding: 0; height: 46px; float: left; background: url(../images/nav-edge.gif) left no-repeat; line-height: 2em; }
.header ul.nav li a { padding: 10px 30px 0 20px; height: 36px; display: block; background: url(../images/nav-edge.gif) right no-repeat; color: #ffffff; text-decoration: none; text-align: center; }
.header ul.nav li.double-line { line-height: 1em; }
.header ul.nav li.active { background: url(../images/nav-active-left.gif) left no-repeat; }
.header ul.nav li.active a { background: url(../images/nav-active-right.gif) right no-repeat; font-weight: 600; }
.header ul.nav li a span {
	/* text shadow */
	text-shadow: 0px 1px 2px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

.header .search { left: 705px; top: 85px; position: absolute; }
.header .search input { border: 1px solid #104573; padding: 0 5px; width: 108px; height: 19px; float: left; background-color: #c8e4ff; }
.header .search button { border: 1px solid #104573; width: 23px; height: 21px; float: left; background: #104573 url(../images/search.gif) no-repeat; cursor: pointer; overflow: hidden; text-indent: -1000px; }

.header .pagination { right: 10px; bottom: 10px; height: 24px; position: absolute; font-size: 1.05em; text-transform: uppercase; }
.header .pagination a img { width: 21px; height: 24px; }
.header .pagination a { float: left; }
.header .pagination a:first-child { margin-right: 40px; }
.header .pagination span { 
	padding: 2px 5px 0 5px; float: left; display: none;

	/* text shadow */
	text-shadow: 0px 1px 2px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

.header a.chapterbox { left: 31px; top: 35px; padding: 5px 0 0 8px; width: 53px; height: 45px; position: absolute; z-index: 800; background: url(../images/chapterbox.png) no-repeat; }
.header a.modulebox { left: 25px; top: 45px; position: absolute; z-index: 800; }

.header .toc { 
	left: 32px; top: 76px; padding: 10px; position: absolute; background-color: #000000; color: #ffffff; z-index: 700; overflow: hidden; display: none; 
	
	/* box shadow */
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
}
.header .toc a { color: #ffffff; }
.header .toc h2 { font-size: 1.4em; line-height: 1.3em; font-weight: 200; }
.header .toc h2 .subtitle { font-size: 0.6em; font-weight: 200; }
.header .toc ul { margin: 0; padding: 0; width: 195px; float: left; list-style: none; }
.header .toc ul li { border-top: 2px solid #365360; }
.header .toc ul li a { color: #e88801; text-decoration: none; font-size: 0.8em; text-transform: uppercase; }
.header .toc ul li a:hover { text-decoration: underline; }
.header .toc h4 { font-size: 1em; color: #91aa9d; }
.header .toc ul li ul { margin-left: 1em; padding-left: 1em; list-style: disc; float: none; }
.header .toc ul li ul li { border: none; }
.header .toc ul li ul li a { color: #ffffff; text-transform: none; font-size: 0.9em; text-decoration: underline; }
.header .toc ul.right { padding-left: 50px; }

.header .dropdown {
	padding: 10px; position: absolute; background-color: #000000; color: #ffffff; z-index: 700; overflow: hidden; font-size: 0.8em; display: none;
		
	/* box shadow */
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
}
.header .dropdown a { color: #ffffff; }
.header .dropdown h2 { font-size: 1.4em; line-height: 1.3em; font-weight: 200; }
.header .dropdown h2 .subtitle { font-size: 0.6em; font-weight: 200; }
.header .dropdown h3 { padding-top: 0.5em; color: #e88801; font-size: 1em; margin-bottom: 0; }
.header .dropdown h4 { font-size: 1em; color: #91aa9d; margin-bottom: 0; }
.header .dropdown ul { margin: 0; padding: 0; width: 250px; float: left; list-style: none; }
.header .dropdown ul li { border-top: 2px solid #365360; }
.header .dropdown ul li a { color: #e88801; text-decoration: none; font-size: 1em; text-transform: uppercase; }
.header .dropdown ul li a:hover { text-decoration: underline; }
.header .dropdown ul li ul { /*margin-left: 1em;*/ width: auto; padding-bottom: 0.5em; padding-left: 1em; /*list-style: disc;*/ float: none; }
.header .dropdown ul li ul li { border: none; text-indent: -1em; margin-left: 1em; }
.header .dropdown ul li ul li a { color: #ffffff; text-transform: none; font-size: 1em; text-decoration: underline; }
.header .dropdown ul.right { padding-left: 50px; }
.header .form { padding-bottom: 0.5em; font-size: 1em; }
.header .form label { padding-right: 1em; text-transform: uppercase; }

.header .dropdown h4 {
	text-indent: 0;
}
/*.header .dropdown ul.left h4 { margin-left: -1em; }*/
	
#teacher-resources { left: 350px; top: 40px; }
#student-resources { left: 350px; top: 40px; }
#glossary { left: 500px; top: 40px; width: 400px; }
#glossary .glossary-content { height: 300px; overflow-y: auto; }
#glossary .glossary-space { height: 300px; }
.header .dropdown ul.glossary { width: auto; float: none; overflow: hidden; border-bottom: 2px solid #365360; }
.header .dropdown ul.glossary li { border-top: none; float: left; margin-right: 0.5em; }


/* Sidebar
-------------------------------------------------------------- */

.body div.sidebar ul { margin: 20px 0 0 0; padding: 0; list-style: none; }
.body div.sidebar ul li { margin-bottom: 15px; }
.body div.sidebar ul li a img { /*width: 95px; height: 108px;*/ }

/* Mainbar
-------------------------------------------------------------- */

.body .main .mainbar .breadcrumbs { left: 30px; top: 10px; position: absolute; z-index: 200; font-size: 0.7em; line-height: 1em; color: #a7cfcd; font-weight: 600; display: none; }
.body .main .mainbar .breadcrumbs a { color: #a7cfcd; text-decoration: none; }
.body .main .mainbar .breadcrumbs a:hover { text-decoration: underline; }

.body .main .mainbar .section { left: 30px; top: 26px; position: absolute; }

.body .main .mainbar .section ul { margin: 0; padding: 0; display: inline-block; list-style: none; font-size: 0.8em; line-height: 1.8em; }
.body .main .mainbar .section ul li { 
	padding: 8px 14px 0 14px; height: 25px; display: inline-block; text-transform: uppercase; font-weight: 600;
	
	/* gradient */
	background: #000000;
	background: -moz-linear-gradient(top,  #000000 0%, #3d5d6c 50%, #000000 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(50%,#3d5d6c), color-stop(100%,#000000));
	background: -webkit-linear-gradient(top,  #000000 0%,#3d5d6c 50%,#000000 100%);
	background: -o-linear-gradient(top,  #000000 0%,#3d5d6c 50%,#000000 100%);
	background: -ms-linear-gradient(top,  #000000 0%,#3d5d6c 50%,#000000 100%);
	background: linear-gradient(top,  #000000 0%,#3d5d6c 50%,#000000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=0 );
	
	/* border radius */
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomright: 0px;
	-moz-border-radius-bottomleft: 0px;
	-webkit-border-radius: 10px 10px 0px 0px;
	border-radius: 10px 10px 0px 0px;	
}

.body .main .mainbar .section h2 { margin-bottom: 0; padding-left: 5px; display: inline-block; font-size: 2.1em; line-height: 1em; }

.body .main .mainbar .section h2.two-lines {
	font-size: 1.6em; margin-top: -17px;
}

/* Subbar
-------------------------------------------------------------- */

.body .main .subbar ul.current-step { margin: 0; padding: 7px 0 0 30px; display: inline-block; float: left; list-style: none; font-size: 1.25em; line-height: 1em; color: #ffffff; font-weight: 600; }
.body .main .subbar ul.current-step li { 
	padding: 6px 10px 0 10px; height: 23px; display: inline-block; background-color: #91aa9d; 
	
	/* border radius */
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomright: 0px;
	-moz-border-radius-bottomleft: 0px;
	-webkit-border-radius: 10px 10px 0px 0px;
	border-radius: 10px 10px 0px 0px;		
}

.body .main .subbar span { padding-left: 5px; padding-top: 12px; display: inline-block; float: left; font-weight: 600; }

.body .main .subbar ul.steps { margin: 0; padding: 12px 0 0 0; display: inline-block; float: left; list-style: none; }
.body .main .subbar ul.steps li { padding-top: 0; padding-left: 5px; float: left; }
.body .main .subbar ul.steps li a { display: block; width: 16px; height: 24px; background: url(../images/step.gif) no-repeat; color: #ffffff; text-decoration: none; text-align: center; }


/* Search Results
-------------------------------------------------------------- */

.body.search-results .main .page-wrapper { top: 90px; }
.body.search-results .main .page-wrapper .page { background: transparent;  }
.body.search-results .main .page-wrapper .page .content { padding-top: 50px; }
#search-results { position: relative; }
#search-results h4 { position: absolute; right: 0; top: 0; }
#search-results ul { list-style: none; margin-left: 0; padding-left: 0; }
#search-results ul li { margin-bottom: 1em; }
#search-results ul li h3 { font-size: 1.2em; margin-bottom: 0.25em; font-weight: normal; }

/* Module Opener
-------------------------------------------------------------- */

.body.module-opener .main .page-wrapper { top: 90px; background: #000000 url(../images/blue-gradient.jpg) repeat-x;  }
.body.module-opener .main .page-wrapper .page { background: transparent;  }
.body.module-opener .main .page-wrapper .page .content { margin: 0; padding: 0; }

/* Module Overview
-------------------------------------------------------------- */

.body.module-overview .main .page-wrapper { top: 90px; background: #000000 url(../images/blue.jpg); }
.body.module-overview .main .page-wrapper .page { background: transparent;  }
.body.module-overview .main .page-wrapper .page .content { min-height: 600px; margin-right: 110px; border-right: none; padding-top: 0; padding-right: 64px; }

.body.module-overview .gutter { top: 35px; }

.module-title { 
	left: 0; border: 2px solid #000000; padding: 20px; width: 200px; background-color: #000000; color: #ffffff; position: absolute; font-size: 1.8em; line-height: 1.3em;

	/* border radius */
	-moz-border-radius-bottomright: 30px;
	-webkit-border-radius: 0px 0px 30px 0px;
	border-radius: 0px 0px 30px 0px;		

	/* text shadow */
	text-shadow: 0px 1px 2px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

.figure.module-overview { top: 120px; left: 67px; position: absolute; }
.figure.module-overview .caption { border: 1px solid #000000; background-color: #000000; }

/*
.module-nav-1 {}
.module-nav-2 { opacity: 0.5; }
.module-nav-3 { opacity: 0.5; }
*/

#carousel { position: relative; height: 300px; margin: 0; padding: 0; padding-top: 150px; }
#carousel li { float: left; cursor: pointer; cursor: hand; list-style: none; margin: 0; padding: 0; width: 389px; height: 270px; }
#carousel li img { height: 100%; width: 100%; } 

.marketing-material { position: absolute; left: 350px; top: 200px; width: 350px; background: #ffffff; border: 1px solid #000000; padding: 1em; display: none; z-index: 2000; }
.marketing-material .close-btn { position: absolute; right: 10px; top: 10px; width: 16px; height: 16px; background-image: url(../images/closelabel.gif); cursor: pointer; }

/* Chapter Overview
-------------------------------------------------------------- */

.body.chapter-overview .main .page-wrapper { top: 90px; background: #000000 url(../images/blue-light.jpg); }
.body.chapter-overview .main .page-wrapper .page .content { min-height: 600px; margin-right: 110px; border-right: none; padding-top: 0; padding-right: 64px; }
.body.chapter-overview .main .gutter { top: 35px; }


/* module 1 chapter overview backgrounds */
.body.module1.doing-technology .main .page-wrapper .page { background: transparent url(../images/module1/doing-technology/chapterdt-bg.png) no-repeat; /*background: transparent;*/ }
.body.module1.chapter1 .main .page-wrapper .page { background: transparent url(../images/module1/chapter1/chapter1-bg.png) no-repeat; }
.body.module1.chapter2 .main .page-wrapper .page { background: transparent url(../images/module1/chapter2/chapter2-bg.jpg) no-repeat; }
.body.module1.chapter3 .main .page-wrapper .page { background: transparent url(../images/chapter3-bg.jpg) no-repeat; }
.body.module1.chapter4 .main .page-wrapper .page { background: transparent url(../images/module1/chapter4/chapter4-bg.png) no-repeat; }

/* module 1 chapter overview figures */
.body.chapter-overview.module1.doing-technology .main .page .chapter-figure { margin-top: 330px; }
.body.chapter-overview.module1.chapter1 .main .page .chapter-figure { margin-top: 311px; }

/* module 2 chapter overview backgrounds */
.body.module2.doing-technology .main .page-wrapper .page { background: transparent url(../images/module1/doing-technology/chapterdt-bg.png) no-repeat; /*background: transparent;*/ }
.body.module2.chapter1 .main .page-wrapper .page { background: transparent url(../images/module2/chapter1/overview.jpg) no-repeat; }
.body.module2.chapter2 .main .page-wrapper .page { background: transparent url(../images/module2/chapter2/overview.jpg) no-repeat; }
.body.module2.chapter3 .main .page-wrapper .page { background: transparent url(../images/module2/chapter3/overview.jpg) no-repeat; }
.body.module2.chapter4 .main .page-wrapper .page { background: transparent url(../images/module2/chapter4/overview.jpg) no-repeat; }

/* module 3 chapter overview backgrounds */
.body.module3.doing-technology .main .page-wrapper .page { background: transparent url(../images/module1/doing-technology/chapterdt-bg.png) no-repeat; /*background: transparent;*/ }
.body.module3.chapter1 .main .page-wrapper .page { background: transparent url(../images/module3/chapter1/overview.jpg) no-repeat; }
.body.module3.chapter2 .main .page-wrapper .page { background: transparent url(../images/module3/chapter2/overview.jpg) no-repeat; }
.body.module3.chapter3 .main .page-wrapper .page { background: transparent url(../images/module3/chapter3/overview.jpg) no-repeat; }
.body.module3.chapter4 .main .page-wrapper .page { background: transparent url(../images/module3/chapter4/overview.jpg) no-repeat; }


/* Chapter Organizer
-------------------------------------------------------------- */

.body.chapter-organizer .main .page-wrapper { top: 90px; background: #000000 url(../images/blue-light.jpg); }
.body.chapter-organizer .main .page-wrapper .page { background: transparent;  }
.body.chapter-organizer .main .page-wrapper .page .content { margin: 0; padding: 0; }

.organizer { margin-left: 0; margin-top: 0; width: 843px; height: 520px; /*height: 513px;*/ position: relative; background: url(../images/organizer-arrow.png) 52px 86px no-repeat; }
.organizer img.organizer-title { left: 224px; position: absolute; }

.organizer a.organizer-hexagon { 
	padding-top: 30px; width: 145px; height: 57px; position: absolute; background: url(../images/organizer-hexagon.png) 10px 0 no-repeat; text-align: center; text-transform: uppercase; color: #ffffff; text-decoration: none; font-weight: 600; 

	/* text shadow */
	text-shadow: 0px 1px 2px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}
.organizer a.organizer-hexagon:hover { background-image: url(../images/organizer-hexagon-over.png); }
.organizer a.organizer-circle { 
	padding-top: 30px; width: 116px; height: 77px; position: absolute; background: url(../images/organizer-circle.png) 10px 0 no-repeat; text-align: center; text-transform: uppercase; color: #ffffff; text-decoration: none; font-weight: 600; 
	
	/* text shadow */
	text-shadow: 0px 1px 2px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}
.organizer a.organizer-circle:hover { background-image: url(../images/organizer-circle-over.png); }

.organizer a.organizer-hexagon.engage { left: 54px; top: 29px; }
.organizer a.organizer-hexagon.explore { left: 12px; top: 318px; }
.organizer a.organizer-hexagon.explain { left: 342px; top: 421px; }
.organizer a.organizer-hexagon.elaborate { left: 665px; top: 318px; }
.organizer a.organizer-hexagon.evaluate { left: 601px; top: 29px; }

.organizer a.organizer-circle.link-1 { left: 16px; top: 164px; }
.organizer a.organizer-circle.link-2 { left: 165px; top: 388px; }
.organizer a.organizer-circle.link-3 { left: 543px; top: 394px; }
.organizer a.organizer-circle.link-4 { left: 686px; top: 164px; }

.organizer-info { /*left: 400px; top: 200px;*/ border: 1px solid #000000; padding: 1em; width: 250px; position: absolute; display: none; background-color: #ffffff; cursor: pointer; }

.organizer .arrows { position: absolute; left: 52px; top: 86px; width: 843px; height: 513px; }
.organizer .arrow-1 { left: 0px; top: 0px; width: 92px; height: 121px; position: absolute; background: url(../images/arrow-hilite-1.png) no-repeat;  }
.organizer .arrow-2 { left: 0px; top: 129px; width: 76px; height: 151px; position: absolute; background: url(../images/arrow-hilite-2.png) no-repeat;  }
.organizer .arrow-3 { left: 28px; top: 262px; width: 151px; height: 123px; position: absolute; background: url(../images/arrow-hilite-3.png) no-repeat;  }
.organizer .arrow-4 { left: 179px; top: 333px; width: 182px; height: 72px; position: absolute; background: url(../images/arrow-hilite-4.png) no-repeat;  }
.organizer .arrow-5 { left: 373px; top: 341px; width: 182px; height: 64px; position: absolute; background: url(../images/arrow-hilite-5.png) no-repeat;  }
.organizer .arrow-6 { left: 555px; top: 262px; width: 171px; height: 123px; position: absolute; background: url(../images/arrow-hilite-6.png) no-repeat;  }
.organizer .arrow-7 { left: 658px; top: 121px; width: 68px; height: 144px; position: absolute; background: url(../images/arrow-hilite-7.png) no-repeat;  }
.organizer .arrow-8 { left: 621px; top: 32px; width: 88px; height: 97px; position: absolute; background: url(../images/arrow-hilite-8.png) no-repeat;  }

/* Major Concepts */

.major-concepts { left: 150px; top: 120px; position: absolute; text-align: center; }
.major-concepts .major-concepts-btn { margin: 0 auto; width: 277px; height: 39px; background: url(../images/major-concepts-off.png) no-repeat; cursor: pointer; }
.major-concepts .major-concepts-btn.active { background: url(../images/major-concepts-on.png) no-repeat; }
.major-concepts .major-concepts-content { width: 513px; height: 172px; border: 1px solid #000000; background-color: #ffffff; text-align: left; }
.major-concepts .major-concepts-content .major-concepts-on { display: none; }
.major-concepts .major-concepts-content ul.column-2 { padding-top: 1em; width: 220px; float: left; }
.major-concepts ul li { margin-bottom: 0.25em; }


/* Chapters
-------------------------------------------------------------- */

.body .main .page .chapter-panel { 
	margin-left: 321px; border: 2px solid #000000; border-top: none; padding: 30px 15px 15px 15px; background-color: #ffffff; 
	
	/* box shadow */
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
}

/*.body.doing-technology .main .page .chapter-panel { margin-left: 0; }*/

.body .main .page .chapter-goals { 
	margin: 0 -47px 1em 1em;  width: 225px; float: right; font-size: 0.9em; z-index: 800; 

	/* box shadow */
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
}
.body .main .page .chapter-goals.inline {
	float: none;
	width: auto;
	margin-right: 0;
}
.body .main .page .chapter-goals .goals-title { 
	padding: 5px 10px; color: #ffffff; text-transform: uppercase; 

	/* gradient */
	background: #ea7900;
	background: -moz-linear-gradient(top,  #ea7900 0%, #fe3300 50%, #ea7900 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ea7900), color-stop(50%,#fe3300), color-stop(100%,#ea7900));
	background: -webkit-linear-gradient(top,  #ea7900 0%,#fe3300 50%,#ea7900 100%);
	background: -o-linear-gradient(top,  #ea7900 0%,#fe3300 50%,#ea7900 100%);
	background: -ms-linear-gradient(top,  #ea7900 0%,#fe3300 50%,#ea7900 100%);
	background: linear-gradient(top,  #ea7900 0%,#fe3300 50%,#ea7900 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ea7900', endColorstr='#ea7900',GradientType=0 );

	/* text shadow */
	text-shadow: 0px 1px 2px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}
.body .main .page .chapter-goals .goals-content { border: 2px solid #000000; border-top: none; padding: 5px 10px; background-color: #fffad5; line-height: 1.3em; }
.chapter-goals ul li { margin-bottom: 0.25em; }

.body .main .page .chapter-figure { /*left: 0; top: 460px;*/ margin-left: -30px; margin-top: 513px; padding: 15px; width: 320px; /*position: absolute;*/ float: left; background-color: rgba(23,56,98,0.56); color: #ffffff; font-size: 0.75em; }
.body .main .page .chapter-figure a { color: #ffffff; }

.body .main .page .chapter-credit { 
	position: absolute; left: 20px; top: 290px; 
	color: #fff; font-size: 0.8em;
	text-shadow: 0px 0px 6px #000000, 0px 1px 1px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
}

.body.module3.chapter1 .main .page .chapter-credit {
	top: 490px;
}

/* Content
-------------------------------------------------------------- */

.insert { margin: 1em 80px 1em 0; border: 1px solid #1b6269; padding: 5px; overflow: visible; background-color: #ffffff; }
.insert h3 { font-size: 1.1em; color: #c93c00; }

.insert ul.images { margin: 0 -80px 0 0; padding: 0; list-style: none; float: right; }
.insert ul.images li { margin: 0; overflow: hidden; }
.insert .insert-right { margin: 0 0 1em 1em; }

/* image figures */
.figure {
	margin-bottom: 1em; 
	position: relative; 
	line-height: 0; 
	/*width: 300px;*/
	/*display: inline-block;*/
	display: table;
	
}
.figure img { 
	border: 1px solid #000000; 
	display: block;
	position: relative;
}
.figure .caption { 
	position: relative; 
	border: 1px solid #3e606f; 
	padding: 5px; 
	background-color: #3e606f; 
	color: #ffffff; 
	font-size: 0.8em; 
	line-height: 1.3em; 
	/*display: block;*/
	display: table-caption;
	caption-side: bottom;
	
}
.figure .caption a { color: #ffffff; }
.figure .caption small { display: block; line-height: 1.1em; }
.figure .caption.empty { border: none; padding: 0; }
ul.images li .figure { margin: 0 40px 1em 1em; /*border: 1px solid #3e606f;*/ float: right; }

.figure .credit-wrapper {
	display: block;
	position: relative;
}

.figure .credit { 
	position: absolute; 
	right: 10px; 
	top: -20px; 
	bottom: 0;
	color: #fff; 
	text-shadow: 0px 0px 6px #000000, 0px 1px 1px #000000;
	filter: dropshadow(color=#000000, offx=0, offy=1);
	display: block;
	font-size: 12px;
	line-height: 14px;
}
.figure .credit.black { 
	color: #000; 
	text-shadow: 0px 0px 6px #ffffff, 0px 1px 1px #ffffff;
	filter: dropshadow(color=#ffffff, offx=0, offy=1);
}
.figure .credit.left {
	left: 10px;
}
.figure .credit.two-lines {
	top: -40px;
}

.body .main .page .chapter-panel .figure.chapter-overview {
	margin: -30px -13px 1em -15px;
}
.body .main .page .chapter-panel .figure.chapter-overview img { border: none; width: 100%; }


/* a.top { font-size: 0.75em; text-transform: uppercase; } */

ol.steps li { padding-top: 1em; }
ol.steps li ol li, ol.steps li ul li { padding-top: 0; }

.bottom-pagination { font-size: 1em; text-align: center; }
.bottom-pagination a.previous { display: inline-block; height: 20px; background: url(../images/prev.png) no-repeat; padding-left: 30px; float: left; }
.bottom-pagination a.top { display: inline-block; height: 20px; }
.bottom-pagination a.next { display: inline-block; height: 20px; background: url(../images/next.png) right no-repeat; padding-right: 30px; float: right; }

.popup h2 { padding-top: 2em; }
.popup h3 { padding-top: 2em; }
.popup h4 { padding-top: 1em; }

.caution { padding-left: 32px; min-height: 28px; background: url(../images/caution.gif) left no-repeat; }

ol li.one-to-two { display: block; }
ol li.one-to-two:before { content: "1-2."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.two-to-three { display: block; }
ol li.two-to-three:before { content: "2-3."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.one-to-four { display: block; }
ol li.one-to-four:before { content: "1-4."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.two-to-four { display: block; }
ol li.two-to-four:before { content: "2-4."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.three-to-four { display: block; }
ol li.three-to-four:before { content: "3-4."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.four-to-five { display: block; }
ol li.four-to-five:before { content: "4-5."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.three-to-six { display: block; }
ol li.three-to-six:before { content: "3-6."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.five-to-six { display: block; }
ol li.five-to-six:before { content: "5-6."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.six-to-seven { display: block; }
ol li.six-to-seven:before { content: "6-7."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.six-to-eight { display: block; }
ol li.six-to-eight:before { content: "6-8."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.seven-to-eight { display: block; }
ol li.seven-to-eight:before { content: "7-8."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.five-to-nine { display: block; }
ol li.five-to-nine:before { content: "5-9."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.eight-to-nine { display: block; }
ol li.eight-to-nine:before { content: "8-9."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.three-to-ten { display: block; }
ol li.three-to-ten:before { content: "3-10."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.ten-to-eleven { display: block; }
ol li.ten-to-eleven:before { content: "10-11."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.two-to-twelve { display: block; }
ol li.two-to-twelve:before { content: "2-12."; margin-left: -2.5em; margin-right: 0.5em; }
ol li.fourteen-to-fifteen { display: block; }
ol li.fourteen-to-fifteen:before { content: "14-15."; margin-left: -2.5em; margin-right: 0.5em; }


/* Teacher Material
-------------------------------------------------------------- */

.tm-positioner { position: absolute; margin-left: 0; margin-bottom: 50px; width: 400px; margin-left: -232px; /*margin-left: -252px;*/ }

.tm-wrapper { 
	position: relative; 
}
a.tm-tab-active { 
	right: 20px; top: -33px; padding: 7px 0 0 32px; width: 134px; height: 32px; position: absolute; background: url(../images/gutter-tab-active.png) no-repeat; color: #ffffff; text-decoration: none; z-index: 300;
}
a.tm-tab { 
	right: 20px; top: 0; padding: 7px 0 0 9px; width: 134px; height: 32px; position: absolute; background: url(../images/gutter-tab.png) no-repeat; color: #ffffff; text-decoration: none;
}
.tm-sizer {
	margin-top: 33px; overflow: hidden; /*height: 100px;*/ border: 1px solid #000000; background-color: #ffffff; z-index: 200;

	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);

}
.tm-scroller {
	height: 100%; overflow-x: hidden; /*overflow-y: hidden;*/ overflow-y: auto; 
}
.teacher-material { 
	width: auto; 
}
.teacher-material h3 { 
	border: none; border-bottom: 1px solid #000000; background: #e8e0ba; text-transform: uppercase; font-size: 0.9em; line-height: 1em; font-weight: 600; 
	
	border-radius: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
}
.teacher-material h3 a { 
	padding: 9px 9px 9px 30px !important; /*min-height: 20px;*/ color: #d2232a !important; 
}
.teacher-material div.ui-accordion-content {
	border: none; /*max-height: 160px;*/ font-size: 0.85em; line-height: 1.3em; /*height: 100px;*/
	
	border-radius: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
}

.ui-resizable-sw { left: 0; bottom: 0; width: 20px; height: 20px; background: url(../images/handle.png) 2px 11px no-repeat; }
.ui-accordion .ui-accordion-header { margin-top: 0; }
.ui-accordion .ui-accordion-content { margin-top: 0; }

.teacher-material div h3 { border-bottom: none; background: transparent; text-transform: none; padding: none; min-height: 0; color: #000000; }

.teacher-material .ui-widget-content a { color: #3e606f; }
.teacher-material .ui-widget-content a.hint { color: #ffffff; }
.teacher-material { font-family: Arial, Helvetica, sans-serif; }

/* Hint
-------------------------------------------------------------- */

a.hint { 
	padding: 2px 5px; background-color: #3e606f; color: #ffffff; text-transform: uppercase; text-decoration: none; font-size: 0.7em; 
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.hint-bubble { 
	border: 1px solid #a7a37e; 
	padding: 10px 20px; 
	width: 200px; 
	position: absolute; 
	background-color: #ffffff; 
	display: none; 
	cursor: pointer; 
	z-index: 1;
	

	/* border radius */
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;

	/* box shadow */
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
}

/* Task
-------------------------------------------------------------- */

a.task { 
	padding: 2px 5px; background-color: #C93C00; color: #ffffff; text-transform: uppercase; text-decoration: none; font-size: 0.7em; 
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.task-bubble { 
	border: 1px solid #a7a37e; padding: 10px 20px; width: 200px; position: absolute; background-color: #ffffff; display: none; cursor: pointer; z-index: 1;

	/* border radius */
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;

	/* box shadow */
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
}

/* Lightbox
-------------------------------------------------------------- */

.lightbox-wrapper { left: 0; top: 0; width: 100%; position: absolute;  display: none; z-index: 1000; }
.lightbox-wrapper .overlay { left: 0; top: 0; width: 100%; position: absolute; z-index: 1100; background-color: #000000; opacity: 0.8;  }
.lightbox-wrapper .lightbox-inner { left: 0; width: 100%; text-align: center; position: absolute; z-index: 1200; }
.lightbox-wrapper .lightbox-inner .lightbox { 
	margin: 0 auto; padding: 15px 30px; display: inline-block; position: relative; background-color: #ffffff; text-align: left; 

	/* border radius */
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;	

	/* box shadow */
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	-moz-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
	box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, .25);
}
.lightbox-wrapper .lightbox-inner .lightbox-nav { margin: 0 auto; position: relative; }
.lightbox-wrapper .lightbox-inner .lightbox-nav a { right: -24px; top: 15px; width: 16px; height: 16px; position: absolute; background: url(../images/closelabel.gif) no-repeat; overflow: hidden; text-indent: -1000px; z-index: 1300; }

a.play-video { left: 15px; top: 15px;width: 58px; height: 22px; position: absolute; overflow: hidden; text-indent: -1000px; background: url(../images/play-video.png) no-repeat; }

/* Sidebar Button
-------------------------------------------------------------- */

a.sidebar { 
	padding: 2px 5px; background-color: #91aad3; color: #ffffff; text-transform: uppercase; text-decoration: none; font-size: 0.7em; 

	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.sidebar-content { padding: 20px; width: 600px; max-height: 400px; overflow-y: auto; background-color: #fffad5;  }


/* Material Button
-------------------------------------------------------------- */
.material {
	padding: 2px 5px; background-color: #e88800; color: #ffffff; text-transform: uppercase; text-decoration: none; font-size: 0.7em; 


	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/* Persistence
-------------------------------------------------------------- */

.highlightable.yellow, 
.highlightable.green, 
.highlightable.blue, 
.highlightable.red,
.highlightable.magenta,
.highlightable.delete,
.highlightable.hiliter-active {
	cursor: url(../images/highlighter.png), pointer;	
}
.header ul.persistence .hilites {
	margin-left: 0;
	background: transparent url(../images/hilight.png) 5px 0 no-repeat;
	width: 34px; height: 40px;
	cursor: pointer;
}
.header ul.persistence .hilites.expanded {
	background: #000 url(../images/hilight-white.png) 5px 0 no-repeat;
}
.header ul.persistence .hilites.active {
	background: transparent url(../images/hilight-orange.png) 5px 0 no-repeat;
}
.header ul.persistence .hilites.expanded.active {
	background: #000 url(../images/hilight-orange.png) 5px 0 no-repeat;
}

#hilites {
	position: absolute;
	left: 777px;
	top: 40px;
	/*width: 100px;*/
	width: 150px; 
	height: 20px;
	background-color: #000;	
	font-size: 0.8em;
	z-index: 300;
	padding: 10px;
	display: none;
}
#hilites .hilite-btn { 
	cursor: pointer; 
	text-decoration: underline; 
	display: block; 
	float: left;
	border: 1px solid #202020;
	margin: 0 2px; 
	width: 20px;
	height: 20px;
	cursor: pointer; 
	overflow: hidden;
	text-indent: -9999px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	z-index: 2;
	position: absolute;
	top: 10px;
}
#hilites #yellow {
	left: 10px;
	background: #f8f4d0;
	background: -moz-linear-gradient(top,  #f8f4d0 0%, #ede382 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8f4d0), color-stop(100%,#ede382));
	background: -webkit-linear-gradient(top,  #f8f4d0 0%,#ede382 100%);
	background: -o-linear-gradient(top,  #f8f4d0 0%,#ede382 100%);
	background: -ms-linear-gradient(top,  #f8f4d0 0%,#ede382 100%);
	background: linear-gradient(top,  #f8f4d0 0%,#ede382 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f4d0', endColorstr='#ede382',GradientType=0 );	
}
#hilites #green {
	left: 35px;
	background: #f1fcd8;
	background: -moz-linear-gradient(top,  #f1fcd8 0%, #d1f683 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f1fcd8), color-stop(100%,#d1f683));
	background: -webkit-linear-gradient(top,  #f1fcd8 0%,#d1f683 100%);
	background: -o-linear-gradient(top,  #f1fcd8 0%,#d1f683 100%);
	background: -ms-linear-gradient(top,  #f1fcd8 0%,#d1f683 100%);
	background: linear-gradient(top,  #f1fcd8 0%,#d1f683 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1fcd8', endColorstr='#d1f683',GradientType=0 );	
}
#hilites #blue {
	left: 60px;
	background: #c7ddf9;
	background: -moz-linear-gradient(top,  #c7ddf9 0%, #9ac0f9 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c7ddf9), color-stop(100%,#9ac0f9));
	background: -webkit-linear-gradient(top,  #c7ddf9 0%,#9ac0f9 100%);
	background: -o-linear-gradient(top,  #c7ddf9 0%,#9ac0f9 100%);
	background: -ms-linear-gradient(top,  #c7ddf9 0%,#9ac0f9 100%);
	background: linear-gradient(top,  #c7ddf9 0%,#9ac0f9 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c7ddf9', endColorstr='#9ac0f9',GradientType=0 );
}
#hilites #red {
	left: 85px;
	background: #fed1e8;
	background: -moz-linear-gradient(top,  #fed1e8 0%, #ffa4cf 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fed1e8), color-stop(100%,#ffa4cf));
	background: -webkit-linear-gradient(top,  #fed1e8 0%,#ffa4cf 100%);
	background: -o-linear-gradient(top,  #fed1e8 0%,#ffa4cf 100%);
	background: -ms-linear-gradient(top,  #fed1e8 0%,#ffa4cf 100%);
	background: linear-gradient(top,  #fed1e8 0%,#ffa4cf 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fed1e8', endColorstr='#ffa4cf',GradientType=0 );
}
#hilites #magenta {
	left: 110px;
	background: #ecd4f8;
	background: -moz-linear-gradient(top,  #ecd4f8 0%, #d6aaea 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ecd4f8), color-stop(100%,#d6aaea));
	background: -webkit-linear-gradient(top,  #ecd4f8 0%,#d6aaea 100%);
	background: -o-linear-gradient(top,  #ecd4f8 0%,#d6aaea 100%);
	background: -ms-linear-gradient(top,  #ecd4f8 0%,#d6aaea 100%);
	background: linear-gradient(top,  #ecd4f8 0%,#d6aaea 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ecd4f8', endColorstr='#d6aaea',GradientType=0 );
}
#hilites #delete {
	left: 135px;
	/*
	background: #ffffff;
	background: -moz-linear-gradient(top,  #ffffff 0%, #e7e7e7 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e7e7e7));
	background: -webkit-linear-gradient(top,  #ffffff 0%,#e7e7e7 100%);
	background: -o-linear-gradient(top,  #ffffff 0%,#e7e7e7 100%);
	background: -ms-linear-gradient(top,  #ffffff 0%,#e7e7e7 100%);
	background: linear-gradient(top,  #ffffff 0%,#e7e7e7 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e7e7e7',GradientType=0 );
	*/
	background: #fff url(../images/delete-hilite.png) no-repeat;
	
	font-family: sans-serif;
	font-size: 22px;
	font-weight: bold;
	color: #d83636;
	line-height: 30px;
}

/*
#hilites.yellow #yellow { background-color: #f7ea96; color: #000; }
#hilites.green #green { background-color: #cdf175; color: #000; }
#hilites.blue #blue { background-color: #b9d1f6; color: #000; }
#hilites.red #red { background-color: #f3a9ce; color: #000; }
#hilites.magenta #magenta { background-color: #e0beef; color: #000; }
#hilites.delete #delete { background-color: #fff; color: #000; }
*/

#hilites .hilite-bg {
	background-color: #000;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
}

#hilites.yellow #yellow, 
#hilites.green #green, 
#hilites.blue #blue,
#hilites.red #red,
#hilites.magenta #magenta,
#hilites.delete #delete {
	border: 3px solid #fff; /*#fcd356;*/
	width: 16px;
	height: 16px;
}


.hilite { position: relative; display: inline; }
.hilite .hilite-content { display: inline; }
.hilite.yellow .hilite-content { background-color: #f7ea96; border-bottom: none; }
.hilite.green .hilite-content { background-color: #cdf175; border-bottom: none; }
.hilite.blue .hilite-content { background-color: #b9d1f6; border-bottom: none; }
.hilite.red .hilite-content { background-color: #f3a9ce; border-bottom: none; }
.hilite.magenta .hilite-content { background-color: #e0beef; border-bottom: none; }

.highlightable.yellow .hilite,
.highlightable.green .hilite,
.highlightable.blue .hilite,
.highlightable.red .hilite,
.highlightable.magenta .hilite,
.highlightable.delete .hilite
{ cursor: pointer; }

.header ul.persistence .notes {
	margin-left: 0;
	background: transparent url(../images/note.png) 5px 0 no-repeat;
	width: 34px; height: 40px;
	cursor: pointer;
}
.header ul.persistence .notes.expanded {
	background: #000 url(../images/note-white.png) 5px 0 no-repeat;
}
.header ul.persistence .notes.active {
	background: transparent url(../images/note-orange.png) 5px 0 no-repeat;
}
.header ul.persistence .notes.expanded.active {
	background: #000 url(../images/note-orange.png) 5px 0 no-repeat;
}


#notes {
	position: absolute;
	left: 376px;
	top: 40px;
	width: 520px;
	background-color: #000;	
	font-size: 0.8em;
	z-index: 300;
	padding: 10px;
	display: none;
}
#notes ul { list-style: none; padding-left: 0; margin-left: 0; }
#notes a { color: #fff; }
#notes h3 a { font-family: Arial, Helvetica, sans-serif; color: #E88801; }
#notes h3 a .notes-count { color: #fff; }
#notes #new-note { cursor: pointer; text-decoration: underline; }
#notes #select-all-notes-wrapper { position: absolute; right: 100px; top: 10px; }
#notes #select-all-notes-wrapper label { cursor: pointer; }
#notes #select-all-notes-wrapper label input { cursor: pointer; }
#notes #print-all-notes { cursor: pointer; position: absolute; right: 20px; top: 10px; text-decoration: underline; }
#notes #create-note { display: none; }
#notes #create-note #note-content { font-size: 1em; font-family: Arial, Helvetica, sans-serif; width: 200px; height: 80px; display: block; margin-bottom: 5px; }
#notes #create-note #save-note { font-size: 1em; font-family: Arial, Helvetica, sans-serif; }
#notes hr { border-bottom: 1px solid #666; }
#notes #notes-list { border-top: 1px solid #666; max-height: 300px; overflow-x: hidden; overflow-y: auto; }
#notes .note { font-family: Arial, Helvetica, sans-serif; width: 460px; border-bottom: 1px solid #666; overflow: hidden; }
#notes .note .display { color: #fff; }
#notes .editing .note .display { display: none; }
#notes .note .display .note-title { float: left; width: 240px; cursor: pointer; }
#notes .note .display .note-visit { float: left; cursor: pointer; }
#notes .note .display .note-destroy { float: left; cursor: pointer; margin-left: 2em; }
#notes .note .display #note-print { float: left; cursor: pointer; margin-left: 2em; }
#notes .note .edit { display: none; }
#notes .editing .note .edit { display: block; }
#notes .note .edit .note-content { font-family: Arial, Helvetica, sans-serif; width: 200px; height: 80px; display: block; margin-bottom: 5px; }
#notes .note .edit .save-note { font-family: Arial, Helvetica, sans-serif; }

#notes-list .ui-accordion-header {
	border: none;
	background: transparent;
}
#notes-list .ui-accordion-content {
	border: none;
	padding: 0 0 0 2em;
	background: transparent;
}
#notes-list .ui-accordion-content h3 a { color: #999; }
#notes-list .ui-state-focus .ui-icon {
	background-image: url(http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/images/ui-icons_888888_256x240.png);
}

.print body { padding: 20px; }
#printable-notes .notes-list {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}
#printable-notes .notes-list li {
	padding-bottom: 1em;
}
#printable-notes-list h3 {
	font-size: 1.4em;
}
#printable-notes-list div {
	padding-left: 1em;
}
#printable-notes-list div h3 {
	font-size: 1.2em;
}
#printable-notes-list ul {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}
#printable-notes-list li {
	padding-bottom: 1em;
}

.print-btn { 
	display: inline-block; 
	margin-bottom: 1em;
	text-decoration: none;

	padding: 4px 10px 4px;
	font-size: 13px;
	line-height: 18px;
	text-align: center;
	vertical-align: middle;
	border: 1px solid #CCC;

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	
	cursor: pointer;

	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	color: white;
	
	background-color: #0074CC;
	background-image: -moz-linear-gradient(top, #08C, #05C);
	background-image: -ms-linear-gradient(top, #08C, #05C);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#08C), to(#05C));
	background-image: -webkit-linear-gradient(top, #08C, #05C);
	background-image: -o-linear-gradient(top, #08C, #05C);
	background-image: linear-gradient(top, #08C, #05C);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#08C', endColorstr='#05C', GradientType=0);
	
	border-color: #05C #05C #003580;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	filter: progid:dximagetransform.microsoft.gradient(enabled=false);
}

.print-btn:hover {
  background-position: 0 -15px;
  background-color: #0055cc;
    
  -webkit-transition: background-position 0.1s linear;
  -moz-transition: background-position 0.1s linear;
  -ms-transition: background-position 0.1s linear;
  -o-transition: background-position 0.1s linear;
  transition: background-position 0.1s linear;
 }

.header ul.persistence .bookmarks {
	margin-left: 0;
	background: transparent url(../images/bookmark.png) 5px 0 no-repeat;
	width: 34px; height: 40px;
	cursor: pointer;
}
.header ul.persistence .bookmarks.expanded {
	background: #000 url(../images/bookmark-white.png) 5px 0 no-repeat;
}
.header ul.persistence .bookmarks.active {
	background: transparent url(../images/bookmark-orange.png) 5px 0 no-repeat;
}
.header ul.persistence .bookmarks.expanded.active {
	background: #000 url(../images/bookmark-orange.png) 5px 0 no-repeat;
}
#bookmarks {
	position: absolute;
	left: 650px;
	top: 40px;
	width: 280px;
	background-color: #000;	
	font-size: 0.8em;
	z-index: 300;
	padding: 10px;
	display: none;
}
#bookmarks ul { list-style: none; padding-left: 0; margin-left: 0; }
#bookmarks .bookmark { border-bottom: 1px solid #666; overflow: hidden; cursor: pointer; color: #E88801; text-decoration: underline; }
#bookmarks #create { cursor: pointer; color: #fff; text-decoration: underline; }
#bookmarks #destroy { display: none; cursor: pointer; color: #fff; text-decoration: underline; }

/* Alerts
-------------------------------------------------------------- */
.alert-wrapper {
	position: absolute;
	top: 120px;
	width: 100%;
	text-align: center;
	z-index: 5000;
}
.alert {
	margin: 0 auto 18px auto;
	width: 320px;
	text-align: center;	
	padding: 8px 35px 8px 14px;
	color: #C09853;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
	background-color: #FCF8E3;
	border: 1px solid #FBEED5;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;	
	
	color: #B94A48;
	background-color: #F2DEDE;
	border-color: #EED3D7;		
}

/* Write-on-lines
-------------------------------------------------------------- */
.write-on-line {
	padding: 0 40px;
	border-bottom: 1px solid #000;
	font-style: italic;
}

/* Login form (test)
-------------------------------------------------------------- */

.login-wrapper {
	text-align: center;
}

form#login {
	margin: 100px auto;
	width: 300px;
	border: 1px solid #ccc;
	padding: 30px;
	text-align: left;
}

/* Style Guide
-------------------------------------------------------------- */
.body.style-guide .main { top: 0; left: 0; bottom: 0; background: transparent; }
.body.style-guide .main .page-wrapper { top: 0; left: 0; bottom: 0; }
.body.style-guide .page { background: transparent; }
.body.style-guide .page .content { margin-right: 0; }
.body.style-guide hr { border: none; border-bottom: 1px solid #ddd; margin-bottom: 1em; }
.body.style-guide header { padding-top: 2em; }
.body.style-guide header h1 { font-size: 3em; font-weight: bold; }
.body.style-guide section { padding-top: 2em; }
.body.style-guide table { border: 1px solid #ddd; border-left: 0; border-collapse: separate; width: 100%; margin-bottom: 2em; }
.body.style-guide table th { border-left: 1px solid #ddd; padding: 8px; font-weight: bold; text-align: left; }
.body.style-guide table td { border-left: 1px solid #ddd; border-top: 1px solid #ddd; padding: 8px; text-align: left; }
.body.style-guide code { padding: 2px 4px; color: #c00; background-color: #f7f7f7; border: 1px solid #e1e1e1; }
.body.style-guide code, .body.style-guide pre { font-family: Menlo, Monaco, "Courier New", monospace; font-size: 12px; }
.prettyprint.linenums {
	-webkit-box-shadow: inset 40px 0 0 #FBFBFC, inset 41px 0 0 #ECECF0;
	-moz-box-shadow: inset 40px 0 0 #FBFBFC, inset 41px 0 0 #ECECF0;
	box-shadow: inset 40px 0 0 #FBFBFC, inset 41px 0 0 #ECECF0;
}
pre.prettyprint { margin-bottom: 2em; padding: 8px; }
.prettyprint { padding: 8px; background-color: #f7f7f7; border: 1px solid #e1e1e1; }
ol.linenums { margin: 0 0 0 33px; padding-left: 0; }
ol.linenums li { padding-left: 12px; color: #bebebe; }
li.L0, li.L1, li.L2, li.L3, li.L5, li.L6, li.L7, li.L8 { list-style-type: decimal; }
li.L1, li.L3, li.L5, li.L7, li.L9 { background: transparent; }