﻿/* ================================
 * RestEd
 * Master CSS Theme
 *
 * @author Elbert Bakker <code@elbert.ca>
 * @author Handcraft Creative <code@handcraftcreative.com>
 */

/* ================================ */
/* !Fonts */

@font-face {
	font-family:'dearjoe6';
	src:url('fonts/dearjoe_6/dearjoe_6-webfont.eot');
	src:url('fonts/dearjoe_6/dearjoe_6-webfont.eot?#iefix') format('embedded-opentype'),
	url('fonts/dearjoe_6/dearjoe_6-webfont.woff2') format('woff2'),
	url('fonts/dearjoe_6/dearjoe_6-webfont.woff') format('woff'),
	url('fonts/dearjoe_6/dearjoe_6.ttf') format('truetype'),
	url('fonts/dearjoe_6/dearjoe_6-webfont.svg#fonts/dearjoe_6/dearjoe_6regular') format('svg');
	font-weight:normal;
	font-style:normal;
}
.handwritten {
	font-family:'dearjoe6',cursive;
}

/* ================================ */
/* Eric Meyer Reset v2.0 | 20110126 <http://meyerweb.com/eric/tools/css/reset/> */
/* With some tweaks */

* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
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; border:0; padding:0;
	font:inherit; font-size:100%;
	vertical-align:baseline;
}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
	display:block;
}
blockquote,q {
	quotes:none;
}
caption,th { text-align:left; }
blockquote:before,blockquote:after,
q:before,q:after {
	content:''; content:none;
}
img,video,iframe,embed,audio {
	max-width:100% !important;
}
video,iframe,embed,audio {
	display:block;
	width:100%;
}
#content audio {
	margin:1.6em 0;
	margin-right:6.25%;
	width:93.75%;
}

/* ================================ */
/* Typography */

html {
	background:#00387e; /* Old browsers */
}
body {
	font-family:'Helvetica',Arial,sans-serif;
	line-height:1.6;
	/* Gradient at http://www.colorzilla.com/gradient-editor/#0a1847+0,00387e+100;Custom */
	background:#00387e; /* Old browsers */
	background:-moz-linear-gradient(top,#0a1847 0%,#00387e 100%); /* FF3.6+ */
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#0a1847),color-stop(100%,#00387e)); /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top,#0a1847 0%,#00387e 100%); /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top,#0a1847 0%,#00387e 100%); /* Opera 11.10+ */
	background:-ms-linear-gradient(top,#0a1847 0%,#00387e 100%); /* IE10+ */
	background:linear-gradient(to bottom,#0a1847 0%,#00387e 100%); /* W3C */
}

h1,h2,h3 {
	position:relative;
	font-weight:bold; font-weight:300;
	font-family:'Oswald',sans-serif;
	font-family:'Raleway','Helvetica Neue',Helvetica,'Open Sans',sans-serif;
	line-height:1.3;
}
h1 {
	clear:both;
	font-size:2.00em;
	font-size:3em; line-height:1;
	font-size:2.5em; line-height:48px;
}
span.caps,
h1 span {
	display:block;
	position:absolute; top:-1.6em;
	font-size:12px; line-height:24px;
	text-transform:uppercase;
	font-family:Helvetica,sans-serif;
	font-weight:bold; font-weight:500;
	color:#273656;
	color:#999;
}
h1 .spacer { display:none; }

p.pull,
h2 {
	clear:both; font-size:1.66em; margin:1.6em 0 .5em 0; max-width:25em;
	color:#358F31;
	color:#2F73C7;
}

h3 { font-size:1.33em; margin:0.5em 0; }

p {
	margin:1.6em 0;
	padding:0;
	max-width:36em;
}

li { margin-left:20px; }

hr { display:block; margin:1.6em auto; border:0; border-top:1px solid #ccc; max-width:40%; }

strong { font-weight:bolder; }
em { font-style:italic; }
a {
	color:#1791d0;
	background:inherit;
	text-decoration:none;
}

a:hover {
	color:#5db3e0;
	background:inherit;
	cursor:pointer;
}

blockquote {
	position:relative;
	padding:2em;
	border-left:1px solid #2F73C8;
	color:#666;
	font-family:Georgia,serif;
	font-style:italic;
	font-size:0.9em;
}
blockquote p { margin:0 0 1em 0; }
blockquote p:last-of-type { margin-bottom:0; }

blockquote.pull {
	background:#fffdeb url(img/ribbon.png) repeat left top;
	border:0;
	background:none;
	text-align:center;
}
blockquote.pull span {
	font-family:Helvetica,sans-serif;
	font-style:normal;
	color:#777;
}
blockquote.pull strong {
	display:block;
	margin:.25em 0;
	font-family:'Raleway','Helvetica Neue',Helvetica,'Open Sans',sans-serif;
	font-size:2.5em; line-height:1.4;
	color:#2B6AB6;
	font-weight:normal;
}

blockquote.callout {
	overflow:hidden;
	margin-right:6.5%;
	margin-bottom:.75em;
	border:1px solid #eee; border-bottom-color:#ddd; padding:0;
	background:#fafafa url(img/ribbon.png) repeat left top;
}
blockquote.callout p { margin:0; border:1px solid #eee; border-bottom-color:#ddd; padding:2em 6.5%; max-width:100%; }

blockquote.callout div { margin:0; padding:1em 6.5%; max-width:100%; }
blockquote.callout div:first-child { padding-top:2em; }
blockquote.callout div:last-child { padding-bottom:2em; }
blockquote.callout div { padding-left:120px; }
blockquote.callout div strong { display:block; float:left; margin-left:-100px; width:100px; font-family:sans-serif; }
blockquote.callout div.auto strong { color:#E89842; }
blockquote.callout div.coping strong { color:#2F73C8; }

blockquote.callout a { text-decoration:none; }

blockquote.callout.links p { padding:0; }
blockquote.callout.links a { display:block; padding:2em 6.5%; }

blockquote.callout strong { color:#333; font-style:normal; }
blockquote.callout a:hover strong { color:#5db3e0; }
blockquote.callout em { color:#999; }
blockquote.callout span,
blockquote.callout cite { color:#999; font-size:12px; font-style:normal; font-family:sans-serif; }
blockquote.callout span.date { display:none; }
blockquote.callout .right {
	margin:0 0 1.6em 1.6em;
	max-width:120px !important; max-height:80px;
	opacity:0.3;
}
blockquote.callout a:hover .right {
	opacity:1;
}

dl {
	overflow:hidden;
	display:block; margin:1.6em 0;
	border-collapse:collapse; border-spacing:0;
	font-size:12px;
}
dt {
	border-top:4px solid #999;
	padding:.5em;
	padding:8px;
	background:transparent;
	vertical-align:bottom; text-align:left;
	font-size:12px; line-height:16px;
	font-weight:bold;
}
dd {
	border-top:1px solid #999;
	padding:.5em;
	padding:11px 8px 8px 8px;
}

dt.automatic { color:#E89842; }
dt.coping { color:#2F73C8; }

table {
	display:block; margin:1.6em 0;
	border-collapse:collapse; border-spacing:0;
	font-size:12px;
}
th {
	border-bottom:2px solid #999;
	padding:.5em; background:transparent;
	vertical-align:bottom; text-align:left;
	font-size:12px; line-height:16px;
	font-weight:bold;
}
tfoot td {
	border-top:2px solid #999;
	padding:.5em;
	vertical-align:top; text-align:left;
	font-size:12px;
	background:#F2F7FA;
}
td {
	border-bottom:1px solid #ccc;
	padding:.5em;
	vertical-align:top;
}
tr:hover td {
	background:#f4f4f4;
}

th.number,
td.number { text-align:right; }
td.center { text-align:center; }

/* ================================ */
/* Common Classes*/

.clear,
.clearfix {
	display:block; clear:both;
}

.help,
.meta { color:#999; font-size:12px; }

.caption { float:right; margin:2em; min-width:160px; color:#999; font-size:12px; text-align:right; }
.caption span { display:block; }

.message {
	margin:0 0 1em 0; padding:1em 6.25%; background:#ffffcc; box-shadow:0 1px 0 #ddd,0 -1px 0 #ddd;
	background:#fbfbfb url(img/ribbon.png) repeat left top;
}
.message.success { background:#FAFFE6; }
.message.error { background:#ffffcc; }
.message.review { background:#FAFFE6; }

.messages li { border-bottom:1px solid #eee; padding:10px 0; }
.messages li:last-child { border-bottom:0; padding-bottom:0; }

.needs-js { display:none; }
.has-js .needs-js { display:block; }

.print-only { display:none; }

.left { float:left; }
.right { float:right; }
img.left { margin:0 24px 24px 0; }
img.right { margin:0 0 24px 24px; }

.mobileOnly { display:block; }
.notMobile { display:none; }

/* ================================ */
/* Structure and Layout */

body {
	min-width:320px; min-height:100vh;
	min-width:768px;
	min-width:720px;
/* 	height:100%; */
}

#wrapper {
	position:relative; z-index:10;
	margin:0 auto;
	max-width:1280px;
	max-width:1024px;
	background:#fff;
	background:#F2F7FA;
}

#hero {
	overflow:hidden;
	position:relative; z-index:100;
	padding:3.125% 6.25%;
	min-height:1em;
	background:#2F73C8;
	background:#fff;
}
#hero h1 {
	position:relative;
	z-index:100;
}
#hero * { margin:0; }
#hero img {
	display:block;
	margin:0 auto;
	max-height:140px;
}
#hero #tagline {
	font-size:18px;
}
#color-bar {
	min-height:1em;
	background:#2F73C8;
	background:-moz-linear-gradient(top, #2f73c8 0%, #2863a7 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#2f73c8), color-stop(100%,#2863a7));
	background:-webkit-linear-gradient(top, #2f73c8 0%,#2863a7 100%);
	background:-o-linear-gradient(top, #2f73c8 0%,#2863a7 100%);
	background:-ms-linear-gradient(top, #2f73c8 0%,#2863a7 100%);
	background:linear-gradient(to bottom, #2f73c8 0%,#2863a7 100%);
}

.module {
	clear:both; margin:0 0 1.6em 0;
}
.module h2 span { color:#192D68; color:#333; }
.module .column img {
	margin:0 auto;
	max-width:300px; max-height:120px;
}

/* .module.success h2 { color:#31782F; } */

.module .heading {
	text-align:center;
}
.column {
	margin:0 0 1.6em 0;
}

#sidebar {
	position:relative; z-index:100;
	padding-bottom:64px;
	min-height:100vh;
	background:#f2f7fa;
}
#sidebar #copyright { position:absolute; left:0; bottom:0; padding:2em; font-size:12px; color:#999; }
#sidebar #copyright a { color:#333; }

#site-logo,
#site-logo-placeholder {
	display:block;
	margin:0 auto;
	padding:1em;
	min-height:48px;
}
#sidebar #site_logo {
	display:block;
	margin:0;
	width:130px; height:30px;
	width:180px; height:48px;
	background:url(img/rest-ed-logo.png) no-repeat left top;
	background-size:100%;
	white-space:pre;
	text-indent:100%;
	overflow:hidden;
	line-height:48px;
}
#site-logo img {
	margin:0;
}

#user-nav {
	margin:2em 0;
	padding:0 0 1.6em 0;
}
#user-nav { overflow:hidden; clear:both; margin:0 0 1px 0; }
#user-nav a {
	position:relative; display:block; padding:0 0 0 60px; line-height:28px; min-height:44px; color:#999; text-decoration:none;
	font-size:14px;
}
#user-nav span { display:block; border-top:1px solid #ddd; padding:8px 8px 8px 0; }
#user-nav:first-child div:first-child span { margin-top:-1px; }

#user-nav i {
	position:absolute; left:16px; top:6px;
	width:32px; height:32px;
	opacity:.7;
	background-image:url(../../public/icon-sprite-32.png);
	background-size:400px;
	background-position:left top;
}
#user-nav .icon-course { background-position:0px 0px; }
#user-nav .icon-notepad { background-position:-40px 0px; }
#user-nav .icon-chart { background-position:-80px 0px; }
#user-nav .icon-calculator { background-position:-120px 0px; }
#user-nav .icon-user { background-position:-160px 0px; }
#user-nav .icon-signout { background:none; }

#user-nav a.current .icon-course,
#user-nav a:hover .icon-course { background-position:0px -40px; }
#user-nav a.current .icon-notepad,
#user-nav a:hover .icon-notepad { background-position:-40px -40px; }
#user-nav a.current .icon-chart,
#user-nav a:hover .icon-chart { background-position:-80px -40px; }
#user-nav a.current .icon-calculator,
#user-nav a:hover .icon-calculator { background-position:-120px -40px; }
#user-nav a.current .icon-user,
#user-nav a:hover .icon-user { background-position:-160px -40px; }

#user-nav a.current,
#user-nav a:hover {
	background:#e6ecf0;
	box-shadow:inset 0 1px 0 #ddd,0 1px 0 #ddd;
}
#user-nav a:hover { color:#2F73C8; }
#user-nav a.current i,
#user-nav a:hover i { opacity:1; }

#sidebar .module {
	padding:0 2em;
}
#sidebar .toc { margin:.5em auto; }

#sidebar .message {
	margin:.5em 0;
	border:1px solid #ccc;
	box-shadow:0 1px 0 rgba(0,0,0,0.2);
	font-size:12px;
}

#sidebar form,
#login_form {
	margin:0;
	padding:1.6em;
	border-color:#273656;
}
#sidebar form h2,
#sidebar h2,
#login_form h2 {
	margin:0 0 .5em 0;
	font-weight:normal; font-weight:100;
	font-style:italic;
	font-size:2em;
	color:#9dbcd4;
}
#sidebar form p {
	display:block; margin:1em 0;
	color:#999;
	font-size:12px;
}
#sidebar form .field {
	border:0; padding:0;
}
#sidebar form label span,
#login_form label span {
	display:block;
	color:#999;
	text-transform:uppercase;
	font-size:12px;
}
#login_form label input {
	display:block;
	margin:0 0 .5em 0; width:100%;
	font-size:16px;
}
#sidebar form button {
	margin-bottom:.5em;
}

.button,
button {
	display:inline-block;
	border:0; padding:.5em .75em;
/* 	width:100%; */
	background:#5f96c1; color:#fff;
	background:#2F73C8;
	font-size:16px;
	border-radius:4px;
	text-align:center;
	cursor:pointer;
}
.button:hover,
button:hover {
	background:#2A4999;
}

.button.secondary,
button.secondary { background:#ccc; color:#999; }
.button.secondary:hover,
button.secondary:hover { background:#bbb; color:#000; }

button.remove { background:#ccc; color:#999; }
button.remove:hover { background:#bbb; color:#000; }

.button.delete,
button.delete { border:1px solid red; background:#ffffcc; color:red; }
.button.delete:hover,
button.delete:hover { background:#bbb; color:red; }

button.confirm { border:1px solid #22751b; background:#3F9338; }
button.confirm:hover { background:#22751b; }

#login_form hr {
	margin:1em auto;
}

input {
	font-size:1em;
}
input.large {
	font-size:1.75em;
	padding:.25em .5em !important;
}

#content {
	position:relative; z-index:100;
	clear:both; overflow:hidden;
	min-height:99vh;
	background:#fff;
}
#content_header {
	position:relative;
	margin-left:6.25%; border-bottom:1px solid #ddd; padding:2em 6.25% 3.125% 0;
}
/* #content_header * { margin:0; } */
#content_header h1 { float:left; }
#content_header button { float:right; }

#banner {
	padding:2em 0 3.125% 6.25%;
}
#banner .mediawrapper { margin:1em 0 0 0; border-bottom:1px solid #333; }
.mediawrapper img,
#banner img { display:block; vertical-align:middle; margin:0; }

#content table {
	margin-right:6.25%;
}

.mediawrapper {
	position:relative;
	margin:1.6em 0;
}
.mediawrapper.ratio-full-width {}

.mediawrapper .media {
	background:#000;
}
.mediawrapper .play {
	display:block; position:absolute; left:50%; top:50%;
	margin:-44px 0 0 -44px; width:88px; height:88px;
	background:url(img/play-button.png) no-repeat left top;
	background-size:88px;
	opacity:.8;
	display:none;
}
.mediawrapper:hover .play,
.mediawrapper .play:hover { opacity:1; transform:scale(1.1,1.1); }

aside,
.mediawrapper.aside {
	float:right; margin:1em 2em 2em 2em;
	max-width:30%;
}

.media {
	display:block;
	position:relative;
}
.media.ratio-1-1 { padding:0 0 56.25% 0; height:0; }
.media.ratio-16-9 { padding:0 0 56.25% 0; height:0; }
.media img,
.media iframe {
	position:absolute; left:0; top:0; right:0; bottom:0;
	margin:0; border:0; padding:0; width:100%; height:100%;
}

.mediawrapper.ratio-full-width { position:relative; padding:0; height:auto; }
.mediawrapper.ratio-full-width img,
.mediawrapper.ratio-full-width iframe { position:relative; left:auto; top:auto; right:auto; bottom:auto; padding:0; height:auto; }
.mediawrapper.ratio-full-width img { width:100%; }

.mediawrapper.dark {
	/* Gradient at http://www.colorzilla.com/gradient-editor/#0a1847+0,00387e+100;Custom */
	background:#0a1847; /* Old browsers */
	background:-moz-linear-gradient(top,#0a1847 0%,#00387e 100%); /* FF3.6+ */
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#0a1847),color-stop(100%,#00387e)); /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top,#0a1847 0%,#00387e 100%); /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top,#0a1847 0%,#00387e 100%); /* Opera 11.10+ */
	background:-ms-linear-gradient(top,#0a1847 0%,#00387e 100%); /* IE10+ */
	background:linear-gradient(to bottom,#0a1847 0%,#00387e 100%); /* W3C */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#0a1847',endColorstr='#00387e',GradientType=0 ); /* IE6-9 */
	background:#275186;
}

.mediawrapper.dark img {
	opacity:0.5;
}

#content_body {
	position:relative;
	padding:3.125% 0 6.25% 6.25%;
	padding:3.125% 6.25% 6.25% 6.25%;
	min-height:60vh;
}
#content_body h1:first-child { margin-top:0; }
#content_body h2:first-child { margin-top:0; }
#content_body p:first-child { margin-top:0; }

ul,ol {
	margin:1.6em 0;
	max-width:40em;
}
ul { list-style:disc outside; }
ol { list-style:decimal outside; }
li {
	margin:0 0 0 2em; padding:0;
}

footer {
	position:relative; z-index:100;
	overflow:hidden; clear:both;
	border-top:1px solid #ddd;
	padding:1em 6.25%;
	background:#f2f7fa; background:#fff;
	font-size:12px;
}
#copyright { float:left; }
#credits { float:right; }

/* ================================ */
/* TEMPORARY */

legend {
	display:block; margin:0; padding:.5em 3.125%; width:100%;
	background:#e4e4e4; color:#333; font-size:14px; font-weight:bold;
}

fieldset:only-of-type { border:0; padding:0; }

select:focus option.option_message { display:none; }

label.radio,
label.checkbox { cursor:pointer; padding:0 1em; }
label.radio:hover,
label.checkbox:hover { background:#ddd; }

fieldset span.required { float:right; font-size:10px; }

#form_error { margin:15px 0; padding:15px 0; }
#form_error legend { background:#1665bb; color:#fff; }
#form_error label {
	padding-left:40px;
	background:url(/theme/telpay/img/arrow.png) no-repeat 22px 2px;
	cursor:pointer;
}
form.validate .required,
#form_error strong { color:#1665bb; }
form dt.error { background:#ffffcc; }

label.checkbox { position:relative; display:block; padding:4px 8px; padding-left:28px; cursor:pointer; font-size:0.875em; }
label.checkbox .spacer { display:none; }
label.checkbox input { position:absolute; left:8px; top:6px; }
label.checkbox:hover { background:#eee; }

#account-settings .field { margin:0 0 -1px 0; border:0; padding:0; }
#account-settings label.checkbox { margin:0; border:1px solid #ddd; padding:16px 24px 16px 64px; }
#account-settings label.checkbox .target { position:absolute; left:0; top:0; bottom:0; border-right:1px solid #ddd; width:48px; }
#account-settings label.checkbox input { left:50%; top:50%; margin:-8px 0 0 -8px; }
#account-settings .actions { margin:1.4em 0; }

input.other { clear:both; margin-top:8px; }

.placeholder {
	margin:1em 0; border:1px solid #ddd; padding:2em;
	max-width:100%;
	text-align:center; font-weight:bold; color:#999; color:rgba(0,0,0,0.3); border-radius:4px;
}
#content .placeholder { margin-right:6.25%; max-width:93.75%; }
.placeholder strong { display:block; font-size:1.5em; }

.index,
.index li { margin:0; padding:0; list-style:none; }
.index { border:1px solid #ddd; }
.index li { border-bottom:1px solid #ddd; padding:0.5em 1em; }
.index .email { color:#999; }
.index img { display:inline; float:right; margin:0 0 0 16px; }
.index .date { float:right; color:#999; }
.index .reminder { float:right; color:#999; }

.index li { border-bottom:1px solid #ddd; padding:0.5em 1em; }

/* ================================ */
/* TEMPORARY */

span.heading,
strong.heading,
.toc strong {
	display:block;
	text-transform:uppercase;
	color:#999; font-size:12px; line-height:20px;
}

.diary-summary-week,
.toc,
ul.links {
	clear:both; margin:1.6em 0; padding:0;
	min-width:160px;
	max-width:100%; max-width:400px;
	background:#fff;
}
ul.diary-summary-week,
ul.links,
ul.toc,
.toc ul { margin:.5em 0; padding:0; }
ul.diary-summary-week li,
ul.links li,
.toc li { position:relative; top:0; margin:-1px 0 0 0; padding:0; list-style:none; }
ul.diary-summary-week li ul,
ul.links li ul,
.toc li ul { margin:0 0 0 1em; }
ul.diary-summary-week a,
ul.links a,
.toc a {
	position:relative; display:block;
	border:1px solid #ccc;
	padding:0.5em 1em;
	line-height:1.2;
	color:#555; color:#1F3882; color:#1E94D1;
	vertical-align:middle;
	font-size:14px;
	text-decoration:none;
}
ul.diary-summary-week a:hover,
ul.links a:hover,
.toc a:hover {
	background:#F2F7FA;
	color:#000 !important;
}

.toc a { padding-left:2.5em; }
.toc span {
	position:absolute; left:0; top:0; bottom:0;
	display:block;
	border-right:1px dashed #ccc;
	width:2em;
	line-height:2;
	text-align:center;
	vertical-align:middle;
}
.toc .success a {
	color:#999; color:rgba(0,0,0,0.5);
}
.toc .success span { color:#3F9338; color:#999; }
.toc .fail a,
.toc .fail span { color:red; }
.toc .todo span { color:#999; }

.toc i {
	overflow:hidden;
	display:block;
	position:absolute; left:6px; top:8px;
	width:16px; height:16px;
	background-repeat:no-repeat;
	background-size:200px;
	background-image:url(../../public/icon-sprite-16.png);
	background-position:-220px top;
	white-space:pre;
	text-indent:100%;
}
.toc i { background-position:-140px 0px; }
.toc .success i { background-position:-160px 0px; }

/* ================================ */
/* TEMPORARY */

#sitemap { clear:both; margin:1em 0; padding:0;
	background:#fff;
}
#sitemap ul { margin:0; padding:0; }
#sitemap li { position:relative; top:0; margin:-1px 0 0 0; padding:0; list-style:none; }
#sitemap li ul { margin:0 0 0 1em; }
#sitemap a {
	position:relative; display:block; border:1px solid #273656; padding:0.5em 1em;
	line-height:1.1;
	color:#273656;
/* 	background:#273656; color:#fff; */
}

#sitemap .status {
	position:absolute; right:.5em; top:.5em;
	float:right; text-transform:uppercase; font-size:12px;
	display:none;
}
#sitemap .status-hidden { color:#999; }
#sitemap .status-preview { color:#999; }
#sitemap .status-published { color:green; }
#sitemap .status-draft { color:red; }

/*
.box {
	display:block; clear:both;
	margin:0 0 1em 0;
	padding:1.6em 2em;
	border-color:#273656;
	background:#fff;
	border-radius:5px;
}
*/
.darkened {
	display:block; clear:both;
	padding:1em;
	border-color:#273656;
	background:#273656;
	background:rgba(39,54,86,0.8);
}
.darkened * {
	margin:0;
}

.wl-calendar-grid {
	overflow:hidden;
	margin:0 6.25% 0 0;
	margin-right:6.25%;
}
.wl-calendar-grid.rowOf2 .wl-calendar {
	float:left; margin:0 2% 2em 0; width:48%;
}
.wl-calendar-grid.rowOf2 .wl-calendar:nth-of-type(odd) { margin-right:4%; }
.wl-calendar-grid.rowOf2 .wl-calendar:nth-of-type(even) { margin-right:0; }

.wl-calendar {
	overflow:hidden; display:block; clear:both;
	margin:0 0 1em 0; border:1px solid #ccc; border-top:1px solid #ddd; border-left:1px solid #ddd;
	border:0;
	background:#fff;
	border-radius:4px;
}

.wl-cal-body {
	border:1px solid #ccc; border-bottom:1px solid #ddd;
}

.wl-calendar .week { display:block; overflow:hidden; border-bottom:1px solid #e4e4e4; background:#fff; }

.wl-calendar .day {
	display:block; float:left; width:14%;
	text-align:left; color:#666;
	border-left:1px solid #eee;
	text-align:right;
}
.wl-calendar .day:first-child { border-left:0; width:15%; }
.wl-calendar .day:last-child { float:right; width:15%; }
.wl-calendar .day:hover { background-color:#ffffcc; }

.wl-calendar .week.heading {
	position:relative; border:0; background:#fff;
/* 	background:#fafafa url(img/ribbon.png) repeat left top; */
	border-radius:0;
}
.wl-calendar .week.heading:first-of-type { border-radius:4px 4px 0 0; }
.wl-calendar .week.heading .prev { position:absolute; left:4px; top:4px; padding:4px; opacity:0.3; }
.wl-calendar .week.heading .next { position:absolute; right:4px; top:4px; padding:4px; opacity:0.3; }
.wl-calendar .week.heading .prev:hover,
.wl-calendar .week.heading .next:hover { background:#ffffcc; opacity:1; }
.wl-calendar .week.heading * { margin:0; border:0; text-align:center; }
.wl-calendar .week.heading h1 { font-size:1.6em; line-height:2; }
.wl-calendar .week.heading .day { margin:0; border:0; padding:0 .25em; text-align:center; }
.wl-calendar .week.heading .day { font-size:0.75em; line-height:2; min-height:2em; font-weight:bold; color:#999; color:rgba(0,0,0,0.3); }
.wl-calendar .week.heading .day:hover { background:none; }

.wl-calendar span.day,
.wl-calendar span.day.inactive,
.wl-calendar a {
	position:relative; display:block; padding:1em;
	min-height:2.5em; line-height:1; font-size:14px; line-height:20px;
	font-family:Andale, monospace;
	text-align:right;
}
.wl-calendar a span { color:#1791d0; }
.wl-calendar a:hover span { border-color:#000; color:#000; }

.wl-calendar span.day.inactive { background-color:#eee; }
.wl-calendar span.day.disabled { color:#ddd; }

.wl-calendar .day.current,
.wl-calendar .day.current:hover { background-color:#f2f7fa; color:#000; }
.wl-calendar .day.current span { color:#000; font-weight:bold; }

.wl-calendar .todo .button,
.wl-calendar .todo.current .button {
display:inline-block; float:left; 
padding:0 .5em; width:auto;
background:#eee; color:#000;
font-family:Helvetica,sans-serif;
font-size:12px; line-height:20px;
text-transform:uppercase;
text-align:center;
}
.wl-calendar .todo .button { background:#E69741; color:#F2F7FA; }
.wl-calendar .todo.current .button { background:#2F73C8; color:#F2F7FA; }

.wl-calendar .todo span { color:#E69741; }

.wl-calendar .todo.current,
.wl-calendar .todo.current span { background:#F2F7FA; color:#2F73C8; font-weight:bold; }

.wl-calendar .success span { color:#ddd; color:#3C9838; }
.wl-calendar .current.success,
.wl-calendar .success {
	background-image:url(img/accept.png);
	background-repeat:no-repeat; background-position:12px center; background-size:16px;
	background-color:#FAFFE6;
	}

.wl-calendar .success i { float:left; }
.wl-calendar .success i { background:red; }
.wl-calendar i,
.wl-calendar .todo i { display:none; }

.rowOf4 li {
	display:block; float:left; clear:none; margin:0 0 1em 0; width:25%; text-align:center;
	font-size:14px;
}
.rowOf4 a {
	display:block;
	padding:1em;
}
.rowOf4 span { display:block; margin:0 auto 1em auto; border:2px solid #eee; width:3em; height:3em; border-radius:4em; }
.rowOf4 i { margin:0 auto 1em auto; }
.rowOf4 img {
	display:block; margin:0 auto 1em auto;
}

#bg {
	background:none;
}

.stars {
	background-image:url(img/stars-bg.png);
	background-repeat:no-repeat;
	background-position:center top;
	background-attachment:fixed;
	background-size:100%;
/* 	background-size:cover; */
}

#stars-1,
#stars-2 {
	position:fixed; left:0; top:0; right:0; z-index:0;
	margin:0;
	width:100%;
	max-width:1000% !important;
}

#stars-2 {
	-webkit-animation-name:fade;
 -webkit-animation-duration:10000ms;
 -webkit-animation-iteration-count:infinite;
 -webkit-animation-timing-function:linear;

 animation-name:fade;
 animation-duration:10000ms;
 animation-iteration-count:infinite;
 animation-timing-function:linear;
}

@-webkit-keyframes fade {
	0% { opacity:1; }
	50% { opacity:0.7; }
	100% { opacity:1; }
}
@keyframes fade {
	0% { opacity:1; }
	50% { opacity:0.7; }
	100% { opacity:1; }
}

.phone_number {
	display:inline-block;
}

i {
	display:block; margin:0 auto;
	width:48px; height:48px;
	background-repeat:no-repeat;
	background-position:48px 48px;
	background-image:url(../../public/icon-sprite-48.png);
	background-size:400px;
}
.icon-next { background-position:-300px -100px; }
.icon-reminder { background-position:-350px -100px; }

/*
.actions {
	float:right; margin:0 0 1em 1em; padding:6.25%; min-width:160px;
	background:#9dbcd4;
	border:1px solid #eee; border-width:1px 0 1px 0;
	background:#f4f4f4 url(img/icon-paper.png) no-repeat 20px 20px;
	background:#fafafa url(img/ribbon.png) repeat left top;
}
.actions span { display:block; }
*/

.user-timeline-calendar {
	overflow:hidden;
	margin:6.25%;
}
.user-timeline-calendar span {
	display:block; float:left;
	margin:0 3px 3px 0;
	width:2em; height:2em;
	background:#eee;
}
.user-timeline-calendar span:nth-child(3n),
.user-timeline-calendar span:nth-child(2n) {
	background-color:green;
}
.user-timeline-calendar span:nth-child(14n) {
	background-color:red;
}

#section_nav { padding:6.25% 6.25% 3.125% 0; }
#section_nav a {
	display:block;
	margin:0 auto; border:0; padding:1em;
	max-width:320px;
	width:100%;
	background:#5f96c1; color:#fff;
	background:#273656;
	font-size:16px;
	border-radius:4px;
	cursor:pointer;
	text-align:center;
}

#content #page_view_confirm_form { overflow:hidden; margin-bottom:0; }
#page_view_confirm_form .rowOf2 { float:right; padding:1.6em 1.6em 0 1.6em; }
#page_view_confirm_form button {
	position:relative;
	margin:0 0 1em 0;
	border:1px solid #bbb;
	padding:.5em 12px .5em 72px;
	width:100%; height:64px;
}
#page_view_confirm_form button span {
	display:block;
	position:absolute; left:0; top:0; bottom:0;
	width:64px; height:auto;
	border-right:1px solid #bbb;
}
#page_view_confirm_form button.confirm { border:2px solid #35892e; padding:.5em 72px .5em 12px; }
#page_view_confirm_form button.confirm span { left:auto; right:0; border:0; border-left:2px solid #35892e; }
#page_view_confirm_form button.confirm:hover,
#page_view_confirm_form button.confirm:hover span { border-color:#21721a; }

#page_view_confirm_form button i {
	display:block;
	position:absolute; left:50%; top:50%; bottom:auto;
	margin:-24px 0 0 -24px;
	width:48px; height:48px;
}

#content_body form {
	margin:1.6em 6.25% 1.6em 0;
}

/* #content form */
#sleep_diary_form {
	position:relative;
	margin-right:6.5%;
	border:1px solid #ddd; border-bottom-color:#ccc;
	padding:3.125%;
	border:0; padding:0;
}
#overlay #sleep_diary_form { margin-right:0; }

#sleep_diary_form h1,
#sleep_diary_form h2 { float:left; margin: 0 0 .5em 0; font-size:2em; }
#sleep_diary_form fieldset { clear:both; }
#sleep_diary_form .button,
#sleep_diary_form button { padding:.5em .75em; max-width:100px; color:#fff; }
#sleep_diary_form button,
#sleep_diary_form .button,
#overlay #sleep_diary_form button { float:right; margin:0 0 .5em 0; }

#sleep_diary_form p { clear:both; }
#sleep_diary_form label {
		color:#999;
}
#sleep_diary_form u { font-weight:bold; text-decoration:none; border-bottom:2px solid #ddd; }

.diary_field {
	overflow:hidden;
	position:relative; clear:both;
	margin:0 0 .5em 0; padding: 0 0 2px 0;
}
.diary_field:first-of-type { border-top:0px solid #ccc; }
.diary_field label {
	float:right;
	margin:0;
	border-top:0px solid #ccc;
	border-left:0px dotted #ccc;
	padding:.5em .75em;
	width:70%;
}
.diary_field label span {
	position:absolute; bottom:.5em;
}
.diary_field a,
.diary_field span {
	display:block; float:left;
	padding:.5em;
}
.diary_field input.large {
	font-size:1.75em;
	padding:.325em .5em !important;
}
.diary_field select {
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance: none;

	text-align:left;
text-indent:0.01px;
text-overflow:'';

	display:block;
	position:absolute;
	right:70%; top:0;
	margin:0;
	padding:0 0.5em;
	border:2px solid #000;
	width:72px; min-height:42px;
	font-size:14px; 
	border-radius:6px;

}
.diary_field select option {
	display:block;
	text-align:left;
	margin:0; padding:.25em .5em;
	min-height:38px; line-height:38px;
}
.diary_field select.time_list,
.diary_field select.time {
	width:30%;
	background: url(img/select-time-bg.png) no-repeat right center;
	font-size:16px;
}

.diary_field input[type='text'],
.diary_field input[type='email'],
.diary_field input[type='password'],
.diary_field input[type='number'],
.diary_field input[type='date'],
.diary_field input[type='time'],
.diary_field .contents {
	float:right;
	margin:0; border:0; padding:.5em .75em;
	border:2px solid #333; bbborder-width:1px 2px;
	border-radius:0;
	outline:0;
	width:160px; width:30%;
	min-height:42px;
	letter-spacing:1px;
	font-weight:bold;
	border-radius:6px;
}
.diary_field ::-webkit-input-placeholder {
	color:#ccc;
	font-weight:100;
	letter-spacing:1px;
}
.diary_field ::-moz-placeholder,
.diary_field ::-ms-input-placeholder,
.diary_field :placeholder-shown {
	color:orange;
}

.diary_field .contents input {
	padding:0 !important;
}
.diary_field input[type='date'],
.diary_field input[type='time'] { float:left; width:auto; }

.diary_field input:focus {
	background:#E7F3FA; color:#2F73C8;
}

.diary_field u {
	color:#000;
}

.diary_field .help {
	clear:both;
}

.diary_field_rate { margin:1em 0; }

.radio-options.scale {
	overflow:hidden; margin:0.5em 0; border:0px solid #ccc; border-bottom:0;
	border:2px solid #000; border-radius:6px;
}
.radio-options.scale label {
	position:relative;
	display:block; float:left;
	padding:.75em;
	text-align:center;
	z-index:1;
	box-shadow: 1px 0 0 #ccc;
}
.radio-options.scale.rowOf5 label { width:20%; }

.radio-options.scale label.checked { z-index:10; }
.radio-options.scale label.checked span,
.radio-options.scale label.checked em { font-weight:bold; color:#000; }
.has-js .radio-options.scale label:nth-child(1).checked { box-shadow: -1px 0 0 #D22424, 1px 0 0 #D22424; border-color:#D22424; background:#FFDFDF; }
.has-js .radio-options.scale label:nth-child(2).checked { box-shadow: -1px 0 0 #E89842, 1px 0 0 #E89842; border-color:#E89842; background:#F9E1C7; }
.has-js .radio-options.scale label:nth-child(3).checked { box-shadow: -1px 0 0 #EBD9BB, 1px 0 0 #EBD9BB; border-color:#EBD9BB; background:#FAF0E0; }
.has-js .radio-options.scale label:nth-child(4).checked { box-shadow: -1px 0 0 #7FDB30, 1px 0 0 #7FDB30; border-color:#7FDB30; background:#EAFADC; }
.has-js .radio-options.scale label:nth-child(5).checked { box-shadow: -1px 0 0 #2F73C8, 1px 0 0 #2F73C8; border-color:#2F73C8; background:#E6F1FF; }


.radio-options.scale span {
	display:block; margin:0;
	font-size:1.6em; color:#999; font-weight:100;
	line-height:1;
}
.radio-options.scale input {
	position:absolute; left:50%; bottom:-8px;
	margin:-8px 0 0 -8px;
}

.radio-options.scale label em { font-size:12px; }
.radio-options.scale label:hover { background:#eee; border-style:solid; box-shadow:1px 0 0 #ccc; }
.radio-options.scale label:hover span { color:#333; }

.radio-options.scale label:nth-child(1) { border-bottom:1em solid #D22424; }
.radio-options.scale label:nth-child(2) { border-bottom:1em solid #E89842; }
.radio-options.scale label:nth-child(3) { border-bottom:1em solid #EBD9BB; }
.radio-options.scale label:nth-child(4) { border-bottom:1em solid #7FDB30; }
.radio-options.scale label:nth-child(5) { border-bottom:1em solid #2F73C8; }

.options { overflow:hidden; margin:0.5em 0; text-align:center; }
.options.checkbox { padding: 1px 0 0 0;}
.options.checkbox label {
	overflow:visible;
	position:relative;
	display:block;
	margin-top:-1px;
	border:1px solid #ccc; border-right:1px solid #ccc; border-left:1em solid #ddd;
	padding:.75em; padding-left:44px;
	min-width:100%;
	text-align:left;
}
.options.checkbox label input { left:22px; top:50%; margin-top:-8px; }

.options.radio label {
	overflow:visible;
	position:relative;
	display:block; float:left;
	margin-right:-1px;
	border:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1em solid #ddd;
	padding:.75em;
	max-width:120px; min-width:10%;
	text-align:center;
}
.options label.current,
.options label:hover { border-color:#2F73C8; border-bottom-color:#2F73C8; background:#F2F7FA; color:#2F73C7; color:#000; z-index:100; }
.options.count-2 label { width:50%; }
.options.count-3 label { width:33.333%; }
.options.count-4 label { width:25%; }
.options.count-5 label { width:20%; }
.options.count-6 label { width:20%; }
.options.count-7 label { width:14.2%; }
.options.count-8 label { width:12.5%; }
.options.count-9 label { width:11%; }
.options label span.spacer { display:none; }
.options label span {
	display:block; margin:0;
	font-size:1.6em; color:#999; font-weight:100;
	line-height:1;
}
.options label input {
	position:absolute; left:50%; bottom:-8px;
	margin:-8px 0 0 -8px;
}

.field .description { color:#999; font-size:12px; }

.mediawrapper img,
.mediawrapper iframe,
.mediawrapper .play,
.radio-options.scale label {
	-webkit-transition:all 0.25s;
	-ms-transition:all 0.25s;
	-o-transition:all 0.25s;
	-moz-transition:all 0.25s;
	transition:all 0.25s;
}

#sleep_diary_form_today { float:right; margin-bottom:1em; width:140px; }

.rowOf2 { float:left; width:50%; }

#content_header span.heading { display:block; clear:both; }

#content_body #diary-summary { margin:1.6em 6.25% 3.2em 0; }
#content_body #diary-summary ul { max-width:100%; }
#content_body #diary-summary li { float:left; margin:0 0 0 -1px; width:14.4%; }
#content_body #diary-summary a {
	display:block; padding:4em 1em .5em 1em;
	text-align:center; min-height:6em;
	line-height:1.6;
}
#content_body #diary-summary .dayname {
	position:absolute; left:0; top:0; right:0;
	background:#eee; background:rgba(0,0,0,0.1);
	border-bottom:1px solid #ccc;
	text-align:center;
	color:#777;
}
#content_body #diary-summary strong {
	font-weight:normal;
}
#content_body #diary-summary i {
	overflow:hidden;
	display:block;
	position:absolute; left:50%; top:3em;
	margin:-8px 0 0 -8px;
	width:16px; height:16px;
	background-repeat:no-repeat;
	background-size:200px;
	background-image:url(../../public/icon-sprite-16.png);
	background-position:-220px top;
	white-space:pre;
	text-indent:100%;
}
#content_body #diary-summary i { background-position:-140px 0px; }
#content_body #diary-summary .success,
#content_body #diary-summary .success strong { background:#FAFFE6; }
#content_body #diary-summary .success i { background-position:-160px 0px; }

.overlay { display:none; }
#overlayBg {
	display:none; opacity:0;
	position:fixed; left:0; top:0; right:0; bottom:0;
	background:rgba(0,0,0,0.4);
	z-index:0;
	cursor:pointer;
}
#overlay {
	display:none; opacity:0;
	position:fixed; left:0; top:0; right:0;
	z-index:20000;
	overflow:scroll;
	height:auto; min-height:200px;
	border-radius:4px;
	background:#fff;
	box-shadow:0 0 48px #000;
	z-index:0;
	text-align:left;
}
#overlay.active { display:block; opacity:1; z-index:20000; }
#overlayBg.active { display:block; opacity:1; z-index:11000; }
#overlayDismiss {
	position:absolute; left:0; top:0; margin:-12px 0 0 -12px; border:1px solid #000; width:24px; height:24px;
	background:#000; color:#fff;
	border-radius:2em;
	text-align:center;
	line-height:24px;
	font-size:20px;
	vertical-align:middle;
	z-index:100;
	cursor:pointer;
}
#overlayDismiss:hover { background:red; }

#sleep-hours {
	position:relative; overflow:visible;
	margin:2em 0; margin-right:6.25%; border:1px solid #eee;
}
#sleep-hours .hour {
	position:absolute; left:0; top:0; bottom:0;
	border-left:1px solid #eee; width:10%;
}
#sleep-hours .hour:nth-of-type(1) { border-left:0; }
#sleep-hours .hour:nth-of-type(2) { left:10%; }
#sleep-hours .hour:nth-of-type(3) { left:20%; }
#sleep-hours .hour:nth-of-type(4) { left:30%; }
#sleep-hours .hour:nth-of-type(5) { left:40%; }
#sleep-hours .hour:nth-of-type(6) { left:50%; }
#sleep-hours .hour:nth-of-type(7) { left:60%; }
#sleep-hours .hour:nth-of-type(8) { left:70%; }
#sleep-hours .hour:nth-of-type(9) { left:80%; }
#sleep-hours .hour:nth-of-type(10) { left:90%; }

#sleep-hours .hour-target {
	display:block;
	margin:1px; height:1em;
	background:#2F73C8;
	opacity:0.5;
	transition:all .5s;
	-webkit-animation-iteration-count:infinite;
	animation-iteration-count:infinite;
}

#sleep-hours .hour-target-4 {
	width:42%;
	-webkit-animation-name:hour-target-4-keyframe;
	-webkit-animation-duration:5s;
	animation-name:hour-target-4-keyframe;
	animation-duration:5s;
}
@-webkit-keyframes hour-target-4-keyframe {
	0% { width:42% }
	50% { width:44%; }
	100% { width:42% }
}
@keyframes hour-target-4-keyframe {
	0% { width:42% }
	50% { width:44%; }
	100% { width:42% }
}

#sleep-hours .hour-target-8 {
	width:82%;
	-webkit-animation-name:hour-target-8-keyframe;
	-webkit-animation-duration:7s;
	animation-name:hour-target-8-keyframe;
	animation-duration:7s;
}
@-webkit-keyframes hour-target-8-keyframe {
	0% { width:74% }
	50% { width:76%; }
	100% { width:72%; }
}
@keyframes hour-target-8-keyframe {
	0% { width:74% }
	50% { width:76%; }
	100% { width:74% }
}

#sleep-hours .hour-target-12 {
	width:93%;
	-webkit-animation-name:hour-target-12-keyframe;
	-webkit-animation-duration:6s;
	animation-name:hour-target-12-keyframe;
	animation-duration:6s;
}
@-webkit-keyframes hour-target-12-keyframe {
	0% { width:93% }
	50% { width:91%; }
	100% { width:93% }
}
@keyframes hour-target-12-keyframe {
	0% { width:93% }
	50% { width:91%; }
	100% { width:93% }
}
.hour-target-8-line {
	position:absolute; left:80%; top:0; bottom:-20%;
	width:1px;
	background:#E88321;
}
.hour-target-8-label {
	position:absolute; left:80%; top:105%;
	margin-left:.5em;
	color:#E88321;
	font-size:11px;
	text-transform:uppercase;
}

#cbt-diagram strong { position:absolute; font-size:1.5em; font-weight:100; color:#B6C9DF; }
#cbt-diagram strong:nth-of-type(1) { right:80%; top:75%; text-align:right; }
#cbt-diagram strong:nth-of-type(2) { right:77%; top:15%; text-align:right; }
#cbt-diagram strong:nth-of-type(3) { left:77%; top:15%; }
#cbt-diagram strong:nth-of-type(4) { left:85%; top:75%; }

#thoughts-diagram {
	margin-right:6.25%;
	text-align:left;
}
#thoughts-diagram .rowOf4 {
	float:left; padding:1em 0; width:25%;
}
#thoughts-diagram h3 {
	text-align:center;
	margin:0 0 .5em 0;
}
#thoughts-diagram ul {
	margin:0;
	border-top:1px solid #ddd;
}
#thoughts-diagram li {
	display:block; float:none; margin:0; border-bottom:1px solid #ddd; padding:.5em 1em; width:100%;
	text-align:left;
	line-height:1.2;
	box-shadow:inset -1px 0 0 #ddd, -1px 0 0 #ddd
}
#thoughts-diagram .rowOf4.active {
	color:orange;
}

#cbt-diagram {}
#cbt-diagram strong.active { color:#E89842; }

#calculatorSummary { margin: 0 0 1em 0; }
.calculatorSummaryRow { clear:both; display:block; clear:both; }
#calculatorSummary h3 { overflow:hidden; clear:left; margin:0;
	vertical-align:middle;
	line-height:2;
}
#calculatorSummary span.title { display:inline-block; ffffloat:left; font-size:1em; line-height:2; margin: 0 1em 0 0; min-width:160px; text-align:right; color:#000; }
#calculatorSummary strong { display:inline-block; font-size:1.5em; line-height:1; vertical-align:middle; }

#calculatorCurrentGoal #calculatorEditLink.button {
	margin: 0 1em; padding:0 1em;
	font-size:14px; min-width:auto;
	color:#fff;
}
#calculatorCurrentGoal:hover #calculatorEditLink.button,
#calculatorCurrentGoal #calculatorEditLink.button:hover {
	background:#2A4999; color:#fff;
}

#calculatorChangeForm {
	position:relative; overflow:visible;
	clear:both;
	margin-right:6.25%;
	border:1px solid #E2ECF2;
	padding:3.125%;
	background:#F2F7FA;
}
#calculatorChangeForm.edit {
	border-top:2px solid #2F73C8;
}
#calculatorChangeForm.edit::before {
	content:" ";
	position:absolute; left:23%; top:-20px;
	border:10px solid #F2F7FA; border-color:transparent transparent #F2F7FA transparent;
	width:0; height:0;
	z-index:10;
}
#calculatorChangeForm.edit::after {
	content:" ";
	position:absolute; left:23%; top:-26px;
	margin:0 0 0 -3px;
	border:13px solid #2F73C8; border-color:transparent transparent #2F73C8 transparent;
	width:0; height:0;
	z-index:5;
}
#calculatorChangeForm h3 { margin-top:0; text-align:center; }
#calculatorChangeForm p { margin:1em 0 0 0; }
#calculatorChangeForm .field {
	position:relative;
	margin:1em auto; border:0; padding:0;
	max-width:260px;
}
#calculatorChangeForm input {
	border:1px solid #ccc;
	padding:.5em; padding-right:40%; width:100%;
	border-radius:4px 0 0 4px;
	font-size:18px;
}
#calculatorChangeForm button {
	position:absolute; left:auto; top:0; right:0; bottom:0;
	width:40%;
	border-radius:0 4px 4px 0;
}

pre {
	padding:1em 6.125% 1em 1em;
	font-family:Andale, monospace;
	background:#fafafa url(img/ribbon.png) repeat left top;
	font-size:12px;
}
code {
	font-family:Andale, monospace;
	background:#fafafa url(img/ribbon.png) repeat left top;
}

#sleep_stats {}
#sleep_stats .red { font-style:italic; color:#999; }
#sleep_stats .bedtime-day,
#sleep_stats .asleep-day { color:red; font-style:italic; }
#sleep_stats .bedtime-late .bedtime,
#sleep_stats .asleep-late .asleep_time { color:blue; }

.message form {
	position:relative;
}
.message fieldset {
	position:relative;
	border:1px solid #B9C782;
	background:#fff;
}
.message legend {
	display:none;
	border:1px solid #ddd;
	border-bottom:1px solid #ddd;
	background:#fff;
	text-align:center;
}
.field {
	position:relative;
}
form .field,
.message .field {
	border-bottom:1px solid #ddd;
	padding:1em 3.125%;
}

.message label {
	font-size:14px;
}

.message button { float:right; margin:1em 3.125%; width:auto; }

#content form {
	clear:both;
}
#content form span.required {
	position:absolute; right:1em; top:1em;
	font-size:12px;
}

#stat-summary { clear:both; margin:1em 6.25% 1em 0; }
.stat { float:left; width:25%; text-align:center; }
.stat strong {
	display:block; margin:0 auto; font-size:2em;
	font-weight:100;
}
.stat span {
	font-size:12px; color:#999;
}

.kvp {}
.kvp strong { display:inline-block; padding-right:1em; min-width:25%; }
.kvp strong { text-align:right; }

.todo {
	color:red;
	font-family:monospace;
}

.item {
	position:relative;
	clear:both;
	padding:1em 0 0 0;
}

body.sleep-stats #content_header { border-bottom:0; }
body.sleep-stats #content_body { padding-top:0; }

#insomnia-screener-quiz_form .message br { display:none; }

#insomnia-screener-quiz_form legend { display:none; }
#insomnia-screener-quiz_form .field { overflow:hidden; padding:.5em 0; }
#insomnia-screener-quiz_form label { display:block; }
#insomnia-screener-quiz_form .options { min-width:200px; }
#insomnia-screener-quiz_form .required { display:none; }

#pagination {
	position:absolute; right:16px; bottom:0;
}
#pagination a {
	display:block; float:left; width:44px; height:44px;
	text-align:center;
	line-height:44px;
}
body.page-138 #pagination { display:none; }

.features {
	position:relative;
	margin:.5em 6.25% .5em 0; border-top:1px solid #ddd; padding: 1em 1em 1em 88px; min-height:72px; max-width:100%;
}
.features img {
	position:absolute; left:0; width:72px; 
}
.features strong { font-size:16px; }
.features .meta {
	display:block; margin-right:6.25%;
}

#course_help {
	position:relative;
/* 	margin:0 6.25% 1em 6.25%; */
	background-color:#F2F7FA;
}
#course_help h3 {
	margin-right:20%;
}
#course_help ul,
#course_help p,
#course_help .features { display:none; }
#course_help.open ul,
#course_help.open p,
#course_help.open .features { display:block; }
#course_help_toggle { float:right;
	position:absolute; right:1em; top:1em;
margin:1em;border:1px solid #ccc; padding:.5em;
color:#999;
border-radius:4px;
line-height:1;
font-size:12px;
text-transform:uppercase;
background:none;
	border-color:#1E367C;
	background-color:#2B6AB6; color:#fff;
}
#course_help_toggle:hover { 
	border-color:#1E367C;
	background-color:#2B6AB6; color:#fff;
}

#custom_pre {}
#custom_pre p {
	margin:1.4em 3.125% 1.4em 6.25%;
}
#custom_pre .field {
	padding:.75em 3.125% .75em 6.25%;
}

#custom_pre .actions {
	margin:0 0 2em 0;
	padding:1.4em 3.125%;
}
#custom_pre .actions button {
	float:right; width:auto;
}

#content_body form:first-child { margin-top:0; }
#content_body form .field:first-child { border-top:0; }

#content_body .box {
	overflow:hidden;
	margin:1em 6.25% 1em 0;
	border:1px solid #eee; border-bottom-color:#ddd;
	background:#F7FBFC url(img/ribbon.png) repeat left top;
}
#content_body .box legend,
#content_body .box h2 {
	display:none;
}
#content_body .box p {
	margin:0;
	padding:1em 3.125%;
}
#content_body .box label span {
	display:inline-block;
	min-width:100px;
}
#content_body .box input {
	min-width:50%;
}
#content_body .box .actions {
	overflow:hidden;
	padding:1em 3.125%;
}

#content_body .box input,
form#forgot input,
#reset_form input {
	display:block;
	border:1px solid #ddd;
	padding:.75em;
	width:100%;
	font-size:1.25em;
}

/* ================================ */
/* Reponsive */

@media screen and (min-width:720px) {

	/* Layout */
	
	.mobileOnly { display:none; }
	.notMobile { display:block; }

	/* Typography */

	blockquote.pull strong { font-size:1.5em; }

	/* Layout */

	#content_wrapper.with_sidebar {
		float:right; clear:none; width:75%;
		min-height:100vh;
		box-shadow:inset 1px 0 0 #ddd;
	}
	#sidebar {
		float:left; clear:none; padding-left:1px; width:25%;
		min-height:100vh;
		box-shadow:1px 0 0 #ddd;
	}

	.column { float:left; padding-right:6.25%; width:50%; }

	#user-nav { background:none; }

	#overlay {
		position:fixed; left:50%; top:auto; right:auto; bottom:auto;
		margin:0 0 0 -25%; border:1px solid #000;
		width:50%; min-width:600px; height:auto; min-height:200px;
	}

}

@media screen and (min-width:800px) {

	#site-logo { padding:2em; }

	#user-nav a { padding-left:80px; }
	#user-nav i { left:32px; }
	
	.desktop-lift { margin-top:-3em !important; }

}

dt { float:left; clear:both; width:25%; }
dd { float:right; width:75%; }

.week-image-summary { position:relative; }
.week-image-summary img { position:relative; float:left; margin:0 -1em -1em 0; width:40%; }
.week-image-summary img.item-1 { z-index:5; }
.week-image-summary img.item-2 { z-index:4; }
.week-image-summary img.item-3 { z-index:3; }
.week-image-summary img.item-4 { z-index:2; }

.message form p:empty { display:none; }

#curve_chart {
	background:#fafafa url(img/ribbon.png) repeat left top;
}

.stats-sleep-efficiency-calculated { color:#6bc5e7; }
.stats-sleep-efficiency-predicted { color:#ce25f8; }
.stats-sleep-quality { color:#84d361; }


select:focus option.prompt {
/* 	display:none !important; */
	color:#ccc;
	text-align:center;
}
select:invalid { color:#ccc; }
select:focus { color:black; }

select option[disabled],
select option:disabled {
	color:#ccc;
}
option.hidden {}

datalist {
	display:none;
}

.current-week {
	margin: 0 0 6.25% 0;
	border-bottom: 1px solid #ccc;
	padding: 0 0 3.125% 0;
}

.center {
	text-align:center;
}


div.dev-only {
	margin:1.5em auto;
	border:1px solid red;
	padding:1.5em;
}
.dev-only p {
	margin: 0 0 1.5em 0;
}
span.dev-only {
	color:red;
}
html.dev-bar #color-bar {
/* 	background:orange; */
}


