@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,800,300);
/*@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:400,700,800,300);*/

/*----*/

a {
	color: #40b7c6;
}
a:hover {
	text-decoration: none;
}

@media screen and (max-width:400px) {
.patientname {
	margin-top: 3.5em;
	clear: both;
	float: none !important;
}
}

@media screen and (orientation:portrait) {
html tw-story {
	font-size: 16px !important;
}
.patientname:before {
	content: 'Name: ' !important;
}
.ehr .header.patientimg h4 {
	display: none !important;
}
.ehr .content strong:first-child {
	margin-top: 30px;
	display: block;
}
}

@media screen and (orientation:landscape) {
.container.completed .summary {
	margin: 6% auto 0 !Important;
}
}

@media only screen and (max-height: 600px) {
.container.case .ehr:before {
	content: none;
}
.container.completed .summary {
	font-size: 1.15em;
	margin: auto !Important;
}
}
tw-icon {
	margin: 0 .1em !important;
	display: inline;/*color: #000 !important;*/

}
tw-icon.undo {
	float: left;
}
tw-icon.redo {
	float: right;
}
tw-sidebar {
	left: 0;
	top: 0;
	z-index: 12;
	right: 0;
	width: 100% !important;
}
.yourchoice {
	padding: 0px 3em 0px 3em !important;
}

@media only screen and (max-width: 600px) {
.container {
	padding: 1em 1em 0em !important;
}
.container.case .ehr:before {
	height: 0em;
}
.navigation {
	margin: 0 -1em -7em !important;
}
.provider-dialogue:before, .nurse-dialogue:before, .manager-dialogue:before, .administrator-dialogue:before {
	right: -10px !important;
}
.pastprovider-dialogue:before, .patient-dialogue:before, .father-dialogue:before, .mother-dialogue:before, .friend-dialogue:before, .resident-dialogue:before, .counselor-dialogue:before {
	left: -10px !important;
}
[class$="-dialogue"]:before {
	width: 50px !important;
	height: 50px !important;
	bottom: 10px !important;
}
.patient-dialogue, .father-dialogue, .mother-dialogue, .pastprovider-dialogue, .friend-dialogue, .counselor-dialogue, .resident-dialogue {
	padding-left: 45px !important;
}
.provider-dialogue, .nurse-dialogue, .manager-dialogue, .administrator-dialogue {
	padding-right: 45px !important;
}
[class$="-dialogue"] p, [class$="-dialogue"] .dialogue-extended {
	width: 93% !important;
}
.yourchoice strong {
	display: none;
}
ol {
	-webkit-padding-start: 20px;
}
html tw-story {
	font-size: 13px !important;
}
}

@media only screen and (max-width: 400px) {
tw-expression, .enchantment-link, tw-link {
	display: block !important;
}
tw-expression, .enchantment-link {
	margin: .75em .5em !important;
}
}
tw-sidebar {
	width: 2em;
}
tw-icon {
	margin: .25em 0;
	/*font-size: 2em;*/

	font-size: 2.5em;
}
tw-expression {
	display: inline-flex;
	margin: .5em;
}
tw-expression + br, .continue + br, .return + br, [class$="-dialogue"] + br, .ehr .header + br, p.small + br, .overview + br, .provider-dialogue p + br, .provider-dialogue ol br, .question + br, .navigation > br:first-child, .inner > br:first-child, .inner + br, .ehr > br:first-child, .feedback > br:first-child, .dialogue-container > br:first-child, .ehr .header.patientimg + br + br, .object + br {
	display: none;
}
.summary tw-link, .report tw-link, .welcomeimg tw-link, .ehr .content .continue tw-link {
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.58);
}
.enchantment-link, tw-link {
	background-color: #f18132;
	color: #fff !important;
	padding: 7px 15px;
	box-shadow: 1px 1px 10px #000;
	transition: all .1s linear;
	-webkit-transition: all .1s linear;
	transition: background-color .01s linear;
	-webkit-transition: background-color .01s linear;
	font-size: .95em;
	text-shadow: 0px 0px 15px #df5200;
}
.visited {
/*background-color: #eb8237;*/

}
.visited:hover, .visited:focus {
/*background-color: #db5e05;*/

}
.ehr .content .object {
	display: inline-block;
	text-align: center;
}
.ehr .content .object tw-expression tw-link {
	/*box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.58);*/
}
.object tw-expression tw-link {
	background: #3b7db8;
	text-shadow: 0px 0px 15px #37667c;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.58);

}
.object tw-expression tw-link:hover, .object tw-expression tw-link:active, .object tw-expression tw-link:focus,
.ehr .content .object tw-expression tw-link:hover,
.ehr .content .object tw-expression tw-link:active,
.ehr .content .object tw-expression tw-link:focus {
	background: #1f5484;
	box-shadow: none;
	transform: scale(.99);
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.enchantment-link:hover, tw-link:hover, .enchantment-link:active, tw-link:active, .summary tw-link:hover, .summary tw-link:focus, .welcomeimg tw-link:hover, .welcomeimg tw-link:focus, .ehr .content .continue tw-link:hover, .ehr .content .continue tw-link:focus {
	background-color: #df5200;
	box-shadow: none;
	transform: scale(.99);
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.continue tw-expression tw-link:after, .return tw-expression tw-link:before {
	content: '';
	width: 40px;
	height: 37px;
	margin-top: -13px;
	margin-bottom: -13px;
	display: inline-block;
	background-size: 95% !important;
}
.continue tw-expression tw-link:after {
	margin-right: -10px;
	background: url('images/resume.png') no-repeat center center;
}
.return tw-expression tw-link:before {
	margin-left: -10px;
	background: url('images/return.png') no-repeat center center;
}
.return, .continue {
	display: inline-block;
}
.yourchoice.objective + tw-expression tw-link:hover, .yourchoice.objective + br + tw-expression tw-link:hover {
	background-color: #26557f;
	box-shadow: none;
}
.objective br, .yourchoice.objective + br {
	display: none;
}
.yourchoice.objective + tw-expression, .yourchoice.objective + br + tw-expression {
	margin: 0 !Important;
	display: inline !Important;
	color: transparent;
	position: absolute;
	top: 0;
	right: 3em;
	width: 30px;
	height: 1.5em;
	z-index: 17;
	overflow: hidden;
}
.yourchoice.objective + tw-expression tw-link, .yourchoice.objective + br + tw-expression tw-link {
	top: 0;
	bottom: -1px;
	overflow: hidden;
	background-color: rgb(47, 95, 137) !important;
	position: absolute;
	width: 26px;
	min-width: 0px;
	text-shadow: none;
	box-shadow: rgb(0, 0, 0) 0px 1px 3px;
	color: transparent !important;
	padding: 0px;
	background: url(images/objectives.png) no-repeat center center;
	background-size: 20px !important;
}

@media screen and (max-width: 400px) {
.yourchoice.objective {
	padding-right: 6em !important;
}
}
hr {
	clear: both;
}
 tw-story ::-webkit-scrollbar {
 -webkit-appearance: none;
 width: 8px;
 background: rgba(36, 49, 55, 0.65);
}
 tw-story ::-webkit-scrollbar-thumb {
 border-radius: 5px;
 background-color: rgba(255, 255, 255, .7);
 -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

@media screen and (max-width: 1500px) {
tw-story {
	margin: 0;
	width: 100%;
	max-width: none;
}
}
/*-------*/

h2 {
	font-size: 1.5em;
}
h2.title {
	text-align: center;
}
h2.title:after {
	content: '';
	display: block;
	height: 2px;
	width: 4em;
	background: #000;
	margin: 1em auto 0;
}
.yourchoice {
	top: -1.5em;
	background: rgb(255, 255, 255);
	box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
	color: #2f5e88;
	right: 0;
	left: 0;
	z-index: 11;
	padding: 0px 1em;
	text-align: center;
	font-weight: bold;
	margin-bottom: -1.5em;
	height: 1.5em;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.yourchoice strong {
	font-weight: normal;
	margin-right: 5px;
	text-transform: uppercase;
	letter-spacing: .07em;
	font-size: .9em;
}
.footer {
	background: #18252a;
	color: #fff;
	padding: .5em 1em;
	text-align: center;
	height: 3.25em;
	width: 100%;
	bottom: 0;
}
.footer:before {
	/*content: '';*/

	position: absolute;
	right: 20px;
	top: -75px;
	background: url('images/scroll.png') no-repeat center center;
	background-size: cover !important;
	display: block;
	height: 60px;
	width: 15px;
	z-index: 0;
}
.navigation:after {
	/*content: '';*/

	background: #243137;
	display: block;
	position: absolute;
	width: 40px;
	right: 0;
	bottom: 3px;
	top: 0;
	z-index: 2;
}
.navigation {
	bottom: 0;
	padding: 1.5em 1em;
	text-align: center;
	clear: both;
	background: #243137;
	color: #fff;
	margin: 0 -2.5em -7em;
	min-height: 14%;
}
.navigation + br, .navigation + br + br, .container + br {
	display: none;
}
.navigation .question {
	margin: 0em auto 1em;
	font-size: 1.1em;
	text-shadow: 0px 0px 5px #000;
	max-width: 80%;
}
.yourchoice + br + .container, .yourchoice + .container, .yourchoice + tw-expression + br + .container {
	/*max-height: 95.9%;*/

	max-height: calc(100% - 3.25em);
}
.container.case {
	max-height: 100% !important;
}
.container {
	overflow-y: scroll;
	overflow-x: hidden;
	/*max-height: 98.5%;*/

	max-height: 99%;
	height: 100%;
	margin: auto;
	padding: 1em 2.5em 0em;
	margin-top: -1.5em;
}

@media only screen and (max-width: 1500px) and (min-width: 1080px) {
.container {
	padding: 0 10%;
}
.navigation {
	margin: 0 -12.7% -7em;
	padding: 1.5em 10%;
	min-height: 100px;
}
}
.version {
	position: absolute;
	left: 1em;
	z-index: 12;
	font-weight: bold;
	top: 1em;
	padding: 0px 5px;
	/*color: #19aa7c;*/

	color: #919191;
}
.references {
	background: #fff;
	padding: 1em;
	word-break: break-word;
}
.container .report {
	background: #fff;
	box-shadow: 0px 0px 15px #000;
	padding: 1em;
	margin-top: 0 !important;
}
.options {
	padding: 1em;
	background: rgb(255, 255, 255);
	text-align: center;
	margin: 3em auto;
}
.overview {
	padding: 1em;
	margin: 2em 0 1em;
	background: #88c4a8;
	color: rgb(255, 255, 255);
	text-align: center;
	z-index: 0;
}
.note {
	/*background: #ffe1a9;*/

	background: #ffe6b7;
	padding: 1em;
	clear: both;
	min-width: 40%;
	display: inline-block;
	margin-bottom: 1em;
}
.welcomeheader + br + .container .note {
	background: transparent;
	color: gray;
	font-size: .9em;
}
.relevantliterature {
	background: #dae3e5;
	padding: 1em;
	border-radius: 5px;
	color: #364f66;
}
.relevantliterature strong {
	color: #2f5e88;
	text-transform: uppercase;
	letter-spacing: .05em;
	/*padding-right: 10px;*/

	display: block;
	padding-left: 40px;
}
.relevantliterature strong:before {
	content: '';
	background: url('images/relevantliterature.png') no-repeat center center;
	height: 2.5em;
	width: 2.5em;
	display: inline-block;
	background-size: 100% !important;
	margin: -.5em .5em -1em -3em;
	position: absolute;
	top: 0;
	bottom: 0;
}
.relevantliterature strong:after {
	content: '';
	width: 4em;
	height: 2px;
	background: #2f5e88;
	display: block;
	margin: 1.5em 0px 1.5em -2.5em;
}
.relevantliterature strong + br, .relevantliterature strong + br + br {
	display: none;
}
.discussion {
	background: #ffe6b7;
	padding: 1em;
	clear: both;
	min-width: 100%;
	display: inline-block;
	margin-bottom: 1em;
}
.ehr .options {
	border-top: 2px solid #eaeaea;
	padding: 1em 1em 2em;
	background: #f0f0f0;
	margin: 0 -1em -2em;
}
h3 {
	color: #fff;
	text-shadow: 2px 1px 10px rgba(0, 0, 0, 0.75);
	text-transform: uppercase;
	letter-spacing: .1em;
}

/*----------------------Stucture----------------------*/

@media only screen and (min-width: 961px) {
.twothirds {
	width: 64% !important;
}
}

@media only screen and (max-width: 767px) {
.third, .half, .twothirds {
	width: 100% !important;
	margin: 20px auto !important;
	float: none !important;
}
.nogap {
	margin-top: 0px !important;
}
.notextgap {
	margin-top: -10px !important;
}
.third + .clear {
	display: block !Important;
	clear: both;
}
}
.third {
	width: 30%;
	margin: 10px 2.5%;
	float: left;
}
.twothirds {
	width: 60%;
	margin: 10px;
	float: left;
}
.half {
	width: 45%;
	margin: 10px;
	float: left;
}
.third, .half, .twothirds {
	margin-top: 0px;
}
.row2 {
	margin-top: 30px !important;
}
.end {
	margin-right: 0;
	float: right;
}
.start {
	margin-left: 0;
}
.half.start, .half.end {
	width: 48.1%;
}
.half .half.end, .half .half.start, .twothirds .half.end, .twothirds .half.start {
	width: 46.73%;
}
.ten.columns .half.start, .ten.columns .half.end {
	width: 47.6%;
}
.third .half.start, .third .half.end {
	width: 45%;
}

/*-------*/



@media only screen and (min-width: 767px) {
.dialogue-container {
	max-width: 800px;
	margin: auto;
	margin-bottom: 45px;
}
}
[class$="-dialogue"] {
	clear: both;
	position: relative;
	width: 100%;
}
.provider-dialogue, .nurse-dialogue, .manager-dialogue, .administrator-dialogue {
	padding-right: 50px;
	float: left;
}
.patient-dialogue, .father-dialogue, .mother-dialogue, .pastprovider-dialogue, .counselor-dialogue, .friend-dialogue, .resident-dialogue {
	padding-left: 50px;
}
.summary [class$="-dialogue"] p, .summary [class$="-dialogue"] .dialogue-extended, .discussion [class$="-dialogue"] p, .discussion [class$="-dialogue"] .dialogue-extended {
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5)
}
[class$="-dialogue"] p, [class$="-dialogue"] .dialogue-extended {
	padding: 10px 10px 10px 15px;
	box-shadow: 0px 1px 45px rgba(0, 0, 0, 0.5);
	clear: both;
	margin: 0px 0px 15px 0px;
	/*max-width: 85%;*/

	width: 85%;
	/*min-width: 45%;*/

	display: inline-block;
	border-radius: 25px 25px 0px 25px;
}
.provider-dialogue p, .administrator-dialogue p, .nurse-dialogue p, .manager-dialogue p, .provider-dialogue .dialogue-extended, .nurse-dialogue .dialogue-extended, .administrator-dialogue .dialogue-extended, .manager-dialogue .dialogue-extended {
	background-color: #eee;
	float: right;
}
.patient-dialogue p, .father-dialogue p, .mother-dialogue p, .pastprovider-dialogue p, .friend-dialogue p, .resident-dialogue p, .patient-dialogue .dialogue-extended, .father-dialogue .dialogue-extended, .mother-dialogue .dialogue-extended, .pastprovider-dialogue .dialogue-extended, .friend-dialogue .dialogue-extended, .resident-dialogue .dialogue-extended, .counselor-dialogue p, .counselor-dialogue .dialogue-extended {
	background-color: #fff;
	border-radius: 25px 25px 25px 0px !important;
}
[class$="-dialogue"] .dialogue-extended p {
	padding: 0px;
	box-shadow: none;
	max-width: none;
	min-width: 0;
	display: block;
	border-radius: 0;
	width: 100% !important;
	float: none;
}
.provider-dialogue:before, .nurse-dialogue:before, .manager-dialogue:before, .administrator-dialogue:before {
	right: -20px;
}
.pastprovider-dialogue:before, .patient-dialogue:before, .father-dialogue:before, .mother-dialogue:before, .friend-dialogue:before, .counselor-dialogue:before, .resident-dialogue:before {
	left: -20px;
}
.provider-dialogue:before {
	background: url('images/provider.png') no-repeat;
}
.nurse-dialogue:before {
	background: url('images/nurse.png') no-repeat;
}
.manager-dialogue:before {
	background: url('images/officemanager.png') no-repeat;
}
.counselor-dialogue:before {
	background: url('images/counselor.png') no-repeat;
}
.patient-dialogue:before {
	background: #fff url('images/patient.png') no-repeat;
}
.mother-dialogue:before {
	background: #fff url('images/mother.png') no-repeat;
}
.father-dialogue:before {
	background: #fff url('images/father.png') no-repeat;
}
.friend-dialogue:before {
	background: #fff url('images/friend.png') no-repeat;
}
.pastprovider-dialogue:before {
	background: #fff url('images/pastprovider.png') no-repeat;
}
.resident-dialogue:before {
	background: url('images/resident.png') no-repeat;
}
.administrator-dialogue:before {
	background: url('images/administrator.png') no-repeat;
}
[class$="-dialogue"]:before {
	background-size: 100% !important;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, .5);
	border-radius: 50%;
	width: 65px;
	height: 65px;
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	z-index: 1;
}
.patient-dialogue p:before {
	content: 'Patient: ';
	color: #2f5e88;
}
.mother-dialogue p:before {
	content: 'Mother: ';
	color: #d95f1d;
}
.father-dialogue p:before {
	content: 'Father: ';
	color: #19aa7c;
}
.friend-dialogue p:before {
	content: 'Friend: ';
	color: #b63f26;
}
.provider-dialogue p:before {
	content: 'Provider: ';
	color: #12a97b;
}
.pastprovider-dialogue p:before {
	content: 'Past Provider: ';
	color: #1b8ea9;
}
.resident-dialogue p:before {
	content: 'Resident: ';
	color: #1b8ea9;
}
.administrator-dialogue p:before {
	content: 'Administrator: ';
	color: #aa4624;
}
.nurse-dialogue p:before {
	content: 'Nurse: ';
	color: #5B9AA9;
}
.manager-dialogue p:before {
	content: 'Office Manager: ';
	color: #1b9cac;
}
.counselor-dialogue p:before {
	content: 'Counselor: ';
	color: #515974;
}
[class$="-dialogue"] p:before {
	font-weight: bold;
}
.case-file {
	padding: 15px;
	margin: 10px 0px 25px;
	background-color: #f0f0f0;
	-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.5);
	min-height: 105px;
}
.incorrect-outcome {
	padding: 15px;
	margin: 10px 0px 25px;
	background-color: #ffffff;
	-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.5);
	min-height: 105px;
}
.bold {
	font-weight: bold;
}
.pe_even {
	border-top: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
	padding: 7px 10px;
	margin: 10px;
	margin-top: -10px;
}
.pe_odd {
	border-top: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
	background-color: #f3f3f3;
	padding: 7px 10px;
	margin: 10px;
	margin-top: -10px;
}
.wnl {
	margin-right: 5px;
}
.shadow-box {
	padding: 15px;
	border-radius: 0px;
	-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.5);
	margin: 20px 0px;
}
.shadow-box .ltblue-title {
	margin: -15px -15px 10px;
}
.ltblue-title {
	background-color: rgba(209,229,226,1);
	padding: 10px;
}
.small {
	font-size: .8em;
}
.navigation .small {
	clear: both;
	-webkit-margin-after: .5em;
	opacity: .5;
	/*margin-bottom: -15px;*/

	position: absolute;
	bottom: 2em;
}
.footer .small {
	clear: both;
	-webkit-margin-after: 0;
	-webkit-margin-before: 0;
	opacity: .5;
	text-align: left;
	top: 0em;
	position: absolute;
	display: none;
}
.footer > br {
	display: none;
}
.scale td {
	padding: 10px;
	width: 9%;
}
.ehr {
	background: #fff;
	box-shadow: 0px 0px 15px #000;
	display: inline;
}
.ehr:before {
	content: '';
	height: 1em;
	display: block;
}
.ehr .header {
	position: relative;
	width: 100%;
	background: #ffffff;
	height: 4em;
	padding: 1.5em 1em;
	z-index: 10;
	left: 0;
	right: 0;
	bottom: -2.68px;
	/*border-bottom: 2px solid #ddd;*/

	box-shadow: 0px 0px 15px #000;
}
.ehr .header:after {
	content: '';
	display: block;
	background: #ffffff;
	position: absolute;
	left: 0;
	right: 0;
	height: 10px;
	bottom: -9px;
	border-bottom: 2px solid #eee;
}
.ehr .header br {
	display: none;
}
.patient-overview {
	margin: auto;
	border: 2px solid #eee;
	padding: 1em;
	width: 100%;
	max-width: 275px;
	display: inline-block;
	text-align: center;
	float: right;
	margin-top: -2.5em;
	margin-left: 1em;
	z-index: 10;
	background: #fff;
	margin-bottom: 1em !Important;
}
.patient-overview .patientimg:before {
	border-radius: 50%;
	box-shadow: 0px 0px 0px 4px #253437;
	border: 4px solid #fff;
	margin: 0 auto 1em;
	float: none;
}
.patient-overview .name {
	font-size: 1.5em;
}
.patient-overview .name:after {
	content: '';
	display: block;
	height: 2px;
	width: 3em;
	background: #eee;
	margin: .5em auto;
}
.patient-overview .complaint {
	color: #aaa;
	font-style: italic;
	margin-top: 1em;
}
.patient-overview br {
	display: none;
}
.patientimg:before {
	float: right;
	margin: 0em 0em 1em 1em;
	/*    max-width: 150px;

        width: 40%;

        height: 150px;*/

	width: 9em;
	height: 9em;
	display: block;
	content: '';
	background-position: top center;
	background-size: cover !important;
	background: url(images/patient.png) no-repeat 0px 0px;
}
.ehr .header.patientimg:before {
	left: 0;
	right: 0;
	top: -1.5em;
	position: absolute;
	margin: 0em auto 0px;
	box-shadow: 0px 0px 0px 4px #253437;
	border: 4px solid #fff;
	border-radius: 50%;
	width: 6.5em;
	height: 6.5em;
	z-index: 10;
}
.ehr .header h4 {
	margin: 0px;
	text-transform: uppercase;
	letter-spacing: .07em;
	display: inline-block;
	margin-right: .5em;
}
.ehr .content h4 {
	text-transform: uppercase;
	letter-spacing: .05em;
}
.ehr .content .continue {
	display: block;
	text-align: center;
}
tw-story .content {
	overflow-y: scroll;
	max-height: 60%;
	padding: 1em 1em 2em;
	top: 0;
	bottom: 0;
	background: #fff;
	box-shadow: 0px 0px 15px #000;
	display: block;
}
.container .inner {
	min-height: 84%;
	padding: 0 0 2em;
	max-width: 1140px;
	margin: auto;
}
.container.case .inner {
	min-height: 582px;
}
.container.case .navigation {
	background: transparent;
}
.container.case .navigation:after {
	content: none;
}
.container .ehr .content {
	overflow: visible;
	max-height: none;
}
.container.intro {
	max-height: 100% !important;/*    position: relative;*/

}
.third + .clear {
	display: none;
}
.instructions {
	padding: 1em;
	background: #19aa7c;
	color: #fff;
	border: 5px solid #19aa7c;
	box-shadow: 0px 1px 10px #000;
	font-style: italic;
	text-align: center;
	max-width: 755px;
	margin: auto;
}
.patientname {
	float: right;
}
.patientname:before {
	content: 'Patient Name: ';
	font-weight: bold;
}
.ehr .title {
	float: left;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: .07em;
}
.ehr .title:before {
	content: 'Electronic Health Record';
}
.significant:after {
	content: 'Significant';
	background: #ffb400;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-weight: normal;
	margin-left: .5em;
}
.score {
	color: #fff;
	background: #18252a;
	display: inline-block;
	margin: 30px auto;
	padding: 2px 10px;
	float: right;
}
table, tr, td {
	border: 1px solid #ccc;
	border-collapse: collapse;
}
table td {
	padding: 5px 10px;
}
table td p {
	margin: 0px;
}

@media only screen and (max-width: 767px) {
table {
	overflow-x: scroll;
	display: inline-block;
	max-width: 100% !important;
}
table + br + p:before, table + br + div:before {
	content: '';
	background: url(images/lr-scroll.png) no-repeat center center;
	display: block;
	width: 35px;
	height: 30px;
	background-size: 100%;
	margin-right: 0;
	position: absolute;
	bottom: 10px;
	right: 8px;
}
}
/*-----Feedback------*/



.feedback {
	padding: 1em;
	background: #fff;
	box-shadow: 0px 1px 17px #000;
}
.feedback.third {
	max-width: 400px;
}
.feedback .response:before {
	content: '';
	background-size: 100% !important;
	width: 5em;
	z-index: 10;
	position: absolute;
	right: .5em;
	top: -1.5em;
	bottom: -1.5em;
}
.feedback > strong:first-child {
	color: #fff;
	display: block;
	margin: -1em;
	padding: 1em;
}
.feedback > strong:first-child em {
	color: #000;
	margin-left: 5px;
}
.feedback.correct {
	background: rgb(211, 222, 187);
}
.feedback.correct .response {
	background: #8fb240;
}
.feedback strong.correct {
	color: #a2b96f;
}
.feedback.correct .response:before {
	background: url('images/feedback_correct.png') no-repeat center center;
}
.feedback.neutral {
	background: #fcead2;
}
.feedback.neutral .response {
	background: #eda637;
}
.feedback.neutral .response:before {
	background: url('images/feedback_neutral.png') no-repeat center center;
}
.feedback.incorrect {
	background: rgb(255, 228, 212);
}
.feedback.incorrect .response {
	background: #e76748;
}
.feedback strong.incorrect {
	color: #ea785d;
}
.feedback.incorrect .response:before {
	background: url('images/feedback_wrong.png') no-repeat center center;
}
.feedback .question {
	margin: -1em -1em 0;
	background: #fff;
	padding: .5em 1em;
}
.feedback .response {
	margin: 0em -1em;
	padding: .5em 6em .5em 1em;
	font-weight: bold;
	color: #fff;
}
.summary .feedback {
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.23);
}
.feedback + br + .clear + br, .feedback + .clear + br {
	display: none;
}
.response strong {
	color: #000;
}
.decision {
	position: absolute;
	bottom: 0em;
	right: 0;
	background: rgb(14, 22, 25);
	padding: .6em 1em;
	font-size: .8em;
	z-index: 11;
	display: none;
}
.patient-dialogue + br + .results, .provider-dialogue + br + .results {
	margin: 3em 0;
}
.patient-dialogue + br + .note, .pastprovider-dialogue + br + .note, .provider-dialogue + br + .note {
	margin-top: 1em;
}
.results {
	background: #fff;
	padding: 1em;
}
.stop:before {
	content: '';
	background-size: 100% !important;
	width: 100px;
	height: 100px;
	background: url('images/stop.png') no-repeat center center;
	display: block;
	margin: auto;
}
.evaluation_points.full {
	background: #fff;
	color: #8fb240;
	font-weight: bold;
	text-align: center;
	padding: .5em 0;
	max-width: 431px;
	margin: auto;
}
.summary {
	padding: 1em;
	background: #fff;
	clear: both;
}
.provider-dialogue + br + .summary, .patient-dialogue + br + .summary {
	margin-top: 7em;
}
/*-------Progress------*/

.progress {
	height: 3px;
	background: #767676;
	position: absolute;
	bottom: 1em;
	left: 1em;
	right: 1em;
	z-index: 10;
}
.progress .inner {
	background: #6ad9bc;
	height: 3px;/*    -webkit-transition: width 1s;

    transition: width 1s;*/

}
.progress .inner:after {
	content: '';
	height: 10px;
	width: 10px;
	display: block;
	background: #6ad9bc;
	box-shadow: 0px 0px 0px 4px rgba(255, 255, 255, 0.14);
	position: absolute;
	right: -5px;
	top: -4px;
	border-radius: 50%;
}
.progress.chapter1 .inner {
	width: 0%;
}
.progress.chapter2 .inner {
	width: 16.66%;
}
.progress.chapter3 .inner {
	width: 33.33%;
}
.progress.chapter4 .inner {
	width: 50%;
}
.progress.chapter5 .inner {
	width: 66.66%;
}
.progress.chapter6 .inner {
	width: 83.33%;
}
.progress.chapter7 .inner {
	width: 100%;
}
.progress .inner.assessments {
	width: 100%;
}
.progress .inner.assessments {
	width: 100%;
}
.progress br {
	display: none;
}
.footer .progress .inner:before {
	top: -2px;
	left: -3.5px;
}
.chapter1 [class^="chaptermark"]:nth-child(1n+2):before, .chapter1 [class^="chaptermark"]:nth-child(1n+2):after,  .chapter2 [class^="chaptermark"]:nth-child(1n+3):before, .chapter2 [class^="chaptermark"]:nth-child(1n+2):after,  .chapter3 [class^="chaptermark"]:nth-child(1n+3):before, .chapter3 [class^="chaptermark"]:nth-child(1n+3):after,  .chapter4 [class^="chaptermark"]:nth-child(1n+4):before, .chapter4 [class^="chaptermark"]:nth-child(1n+3):after,  .chapter5 [class^="chaptermark"]:nth-child(1n+4):before, .chapter5 [class^="chaptermark"]:nth-child(1n+4):after,  .chapter6 [class^="chaptermark"]:nth-child(1n+5):before, .chapter6 [class^="chaptermark"]:nth-child(1n+4):after,  .chapter7 [class^="chaptermark"]:nth-child(1n+5):before, .chapter7 [class^="chaptermark"]:nth-child(1n+5):after,  .chapter8 [class^="chaptermark"]:nth-child(1n+6):before, .chapter8 [class^="chaptermark"]:nth-child(1n+5):after,  .chapter9 [class^="chaptermark"]:nth-child(1n+6):before, .chapter9 [class^="chaptermark"]:nth-child(1n+6):after,  .chapter10 [class^="chaptermark"]:nth-child(1n+7):before, .chapter10 [class^="chaptermark"]:nth-child(1n+6):after,  .chapter11 [class^="chaptermark"]:nth-child(1n+7):before, .chapter11 [class^="chaptermark"]:nth-child(1n+7):after,  .chapter12 [class^="chaptermark"]:nth-child(1n+8):before, .chapter12 [class^="chaptermark"]:nth-child(1n+7):after,  .chapter13 [class^="chaptermark"]:nth-child(1n+8):before, .chapter13 [class^="chaptermark"]:nth-child(1n+8):after,  .chapter14 [class^="chaptermark"]:nth-child(1n+9):before, .chapter14 [class^="chaptermark"]:nth-child(1n+8):after,  .chapter15 [class^="chaptermark"]:nth-child(1n+9):before, .chapter15 [class^="chaptermark"]:nth-child(1n+9):after,  .chapter16 [class^="chaptermark"]:nth-child(1n+10):before, .chapter16 [class^="chaptermark"]:nth-child(1n+9):after {
	background: #767676;
}
[class^="chaptermark"] {
	width: 33.33%;
	height: 1px;
	margin-top: 0px;
	float: left;
}
.progress .inner:before, [class^="chaptermark"]:before, [class^="chaptermark"]:after {
	/*background: #767676;*/

	background: #6ad9bc;
}
.progress .inner:before, [class^="chaptermark"]:before, [class^="chaptermark"]:after {
	content: '';
	height: 7px;
	width: 7px;
	display: block;
	position: absolute;
	top: -5px;
	border-radius: 50%;
	z-index: -1;
}
[class^="chaptermark"]:before {
	left: 50%;
	margin-left: -5px;
}
[class^="chaptermark"]:after {
	right: -5px;
}
.footer .chapter {
	clear: both;
	-webkit-margin-after: 0;
	-webkit-margin-before: 0;
	opacity: .5;
	text-align: left;
	top: 0em;
	position: absolute;
	font-size: .8em;
}
.footer .chapter strong {
	text-transform: uppercase;
	letter-spacing: .05em;
	font-size: .9em;
}
/*-----*/

html.intro {
	background: url('images/examroom-behind.jpg') no-repeat;
}
/*----Completed-----*/

.container.completed .summary:before {
	content: '';
	background: url('images/completed-icon.png') no-repeat center center;
	height: 114px;
	width: 100%;
	display: block;
	background-size: 80px !Important;
}
.container.completed .summary {
	text-align: center;
	font-size: 1.25em;
	padding: 1em 1em 2em;
	max-width: 600px;
	margin: 16% auto 0;
	box-shadow: 0px 1px 10px #000;
}
.container.completed {
	overflow: visible;
}
.container.completed .inner {
	min-height: 0;
}
.container.completed a:after {
	content: ' \203A';
}
.container.completed a {
	display: block;
	margin: 10px 0;
	color: #2f7bbd;
}
.container.completed a:hover {
	text-decoration: none;
}
.container.completed tw-expression tw-link {
	background: #bbb;
	/*color: #6e6e6e !important;*/

	text-shadow: none;
	box-shadow: 1px 0px 2px rgba(0, 0, 0, 0.45);
}
.container.completed tw-expression tw-link:hover {
	box-shadow: none;
	background-color: #9f9f9f;
}

@media only screen and (max-width: 767px) {
.img#standard-drink {
	background: url('images/standard_drink2x2.png') no-repeat !important;
	height: 200px !Important;
}
}
.img#standard-drink {
	content: '';
	background: url('images/standard_drink.png') no-repeat;
	height: 115px;
	width: 100%;
	background-size: contain !important;
	clear: both;
}
.circle {
	border: 1px solid #000000;
	border-radius: 10px;
	padding-right: 3px;
	padding-left: 3px;
}
.scale {
	/*width: 50%;*/

	max-width: 450px;
}
h4.title {
	margin: 0 0 1em 0;
	padding-bottom: .5em;
	border-bottom: 2px solid #eee;
	text-transform: uppercase;
	letter-spacing: .2em;
}
/*----Welcome--*/



.yourchoice.welcome strong:before, .welcomeheader strong:before {
	content: "";
	position: absolute;
	left: -1em;
	bottom: 0;
	top: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-left: .5em solid transparent;
}
.yourchoice.welcome strong:after, .welcomeheader strong:after {
	content: '';
	position: absolute;
	right: -1em;
	bottom: 0;
	top: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-right: .5em solid transparent;
}
.yourchoice.welcome strong:before, .yourchoice.welcome strong:after, .welcomeheader strong:before, .welcomeheader strong:after {
	border-top: 1em solid #989898;
	border-bottom: 1em solid #989898;
	width: 20px;
	z-index: -1;
}
.yourchoice.welcome strong, .welcomeheader strong {
	display: block;
	margin-bottom: 12px;
	background: #aeaeae;
	max-width: 207px;
	margin: auto auto 20px;
	font-style: normal;
	padding: .35em 10px;
	color: #fff;
	font-size: .65em;
	box-shadow: 0px -1px 4px #000;
}
.yourchoice.welcome, .welcomeheader {
	margin: auto;
	top: -1.5em;
	/*font-size: 1.5em;*/

	padding: 1.5em 1em;
	left: 0;
	border-bottom: .25em solid #243137;
	background: #38484f;
	color: #fff;
	box-shadow: none;
	height: auto;
	overflow: visible;
	white-space: normal;
	text-overflow: initial;
	text-align: center;
	font-weight: bold;
	z-index: 11;
}

@media screen and (orientation:portrait) {
}

@media screen and (orientation:landscape) {
/*    .welcomeimg {

        height: 65% !important;

    }*/

}
.welcomeimg {
	background: #fff;
	/*box-shadow: 0px 1px 15px #000;*/

	box-shadow: 0px 1px 15px rgba(0, 0, 0, 0.5);
	text-align: center;
	margin: auto;
	height: 40%;
	/*padding: 0 1em;*/

	padding: 0 1em 1em;
	background-size: 100% !important;
	width: 100%;
	max-width: 500px;
	min-height: 175px !important;
	margin: 8% auto;
}
.welcomeimg .header {
	background: #1cab7d;
	color: white;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: .05em;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	padding: 2%;
}
.welcomeimg .patientimg + br, .welcomeimg .patientinfo + br {
	display: none;
}
.welcomeimg .patientimg:before {
	border-radius: 50%;
	border: .2em solid #cecece;
	float: left;
	margin: -.5em 1em .5em 0;
	/*margin: 1em 1em .5em 0;*/

	width: 7.5em;
	height: 7.5em;
}
.welcomeimg .patientinfo {
	text-align: left;
}
.welcomeimg .patientinfo strong {
	font-size: 1.5em;
	font-weight: normal;
}
.container.welcome, .welcomeheader + br + .container {
/*    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    height: 100%;

    margin-top: 0;*/

}

@media only screen and (max-width: 767px) {
.yourchoice.welcome, .welcomeheader {
/*        margin: auto;

        top: -1.5em;

        padding: 1em 1em !Important;*/

}
}

@media only screen and (max-height: 600px) {
.welcomeimg {
/*height: 65%;*/

}
}
/*Welcome Page with 4 patients*/



.patientbox {
	float: left;
	width: 46%;
	margin: 2%;
	box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.5);
}
.patientbox.inactive .patientimg:before {
	background: url(images/patient.png) #fff no-repeat top center;
	opacity: .4;
	-webkit-filter: grayscale(100%);
}
.patientbox.inactive .patientimg.pt2:before {
	background: url(images/pt2.png) #fff no-repeat top center;
}
.patientbox.inactive .patientimg.pt3:before {
	background: url(images/pt3.png) #fff no-repeat top center;
}
.patientbox.inactive .patientimg.pt4:before {
	background: url(images/pt4.png) #fff no-repeat top center;
}
.patientbox.inactive .patientimg.alice:before {
	background: url(images/alice-lee.jpg) #fff no-repeat top center;
}
.patientbox.inactive .patientimg.marcus:before {
	background: url(images/marcus.jpg) #fff no-repeat top center;
}
.patientbox.inactive {
	background: #eee;
	color: #a6a6a6;
	opacity: .75;
	box-shadow: none;
}
.inactive .continue {
	font-weight: bold;
}
.inactive .continue div {
	background: #ccc;
	display: inline-block;
	padding: 7px 15px;
	color: rgba(255, 255, 255, 0.57);
}
.patientbox + br, .patientbox + br + br {
	display: none;
}

@media only screen and (max-width: 400px) {
.welcomeimg .patientimg:before {
	width: 5.5em;
	height: 5.5em;
}
.welcomeimg.patientbox .patientimg:before {
	width: 3.5em !important;
	height: 3.5em !important;
	border: .1em solid #cecece;
}
.welcomeimg .patientinfo strong {
	font-size: 1.25em;
}
.inactive .continue div, .welcomeimg .continue {
	display: block;
	clear: both;
}
.welcomeimg .continue {
	/*margin: .5em 0 1em !important;*/

	text-align: center;
}
.welcomeimg .continue tw-expression {
/*margin: 0 !important;*/

}
.welcomeimg.patientbox .patientinfo p {
	/*-webkit-margin-after: 1em;*/

	margin-left: 4.5em;
}
html tw-story {
/*font-size: 11px !important;*/

}
.img#standard-drink {
	height: 160px !Important;
}
}

@media only screen and (max-height: 500px) {
.welcomeheader:before {
	/*width: 200px !important;*/

	height: 27px !important;
	max-width: 200px;
	width: 60% !important;
}
.welcomeheader {
	padding: .5em 1em .5em !Important;
}
.welcomeimg {
	margin: 2% auto;
}
.patientbox {
	margin: 2%;
}
}

@media only screen and (max-width: 600px) {
.welcomeimg {
	float: none;
	width: auto;
	max-width: 400px;
	min-height: 0px !important;/*margin: 0 auto 1.5em;*/

}
.patientbox {
	margin: 0 auto 1.5em;
}
.welcomeheader:before {
	/*width: 200px !important;*/

	height: 27px !important;
	max-width: 200px;
	width: 60% !important;
}
.welcomeheader {
	padding: .5em 1em .5em !Important;
}
.info {
	margin: 1% auto !important;
	max-width: 400px;
}
.info tw-expression {
	margin: 0 !important;
	display: inline-block !important;
}
.patient-overview {
	margin: 0;
	float: none;
	max-width: none;
}
}

@media only screen and (max-width: 600px) and (min-width: 400px) {
.patient-overview {
	text-align: left;
}
.patient-overview .patientimg:before {
	float: left;
	margin-right: 2em;
}
.patient-overview .name:after {
	display: flex;
	margin: .5em 0;
}
.patient-overview .complaint {
	margin-left: 11em;
}
}

@media only screen and (min-width: 600px) {
.patientbox .continue tw-expression tw-link, .patientbox .continue div {
	min-width: 175px;
	text-align: center;
}
.welcomeimg .patientinfo p {
	font-size: .85em;
	margin-left: 7em !Important;
}
}

@media only screen and (max-width: 917px) and (min-width: 600px) {
.welcomeimg.patientbox .patientimg:before {
	width: 5em !important;
	height: 5em !important;
}
.patientbox {
	min-height: 205px !important;
}
.patientbox .patientinfo p {
	height: 80px;
}
}
.welcomeimg .patientinfo br {
	display: none;
}
.welcomeimg .continue {
/*margin: .5em 0;*/

}
.welcomeimg .continue tw-expression {
	margin: 0 !important;
}
.patientbox .continue.fakebutton {
	padding-left: 0;
}
.info {
	margin: 1%;
	position: fixed;
	bottom: .5em;
	clear: both;
}
.info tw-link:before {
	content: '';
	background: url(images/info.png) no-repeat center center;
	display: inline-block;
	width: 25px;
	height: 20px;
	margin: -4px 3px -4px -10px;
	background-size: 100%;
}
.info tw-link {
	background-color: #19aa7c;
	text-shadow: 0px 0px 15px #0b6649;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.58);
}
.info tw-link:hover {
	background-color: #0b6649;
	box-shadow: none;
}
.more {
	display: inline;
}
.more tw-link:after {
	content: '';
	background: url('images/resume.png') no-repeat center center;
	display: inline-block;
	width: 25px;
	height: 20px;
	margin: -4px -10px -4px 3px;
	background-size: 100%;
}
.more tw-link {
	background-color: #19aa7c;
	text-shadow: 0px 0px 15px #0b6649;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.58);
}
.more tw-link:hover {
	background-color: #0b6649;
	box-shadow: none;
}
.close tw-expression {
	margin: 0 !Important;
	/*padding: .5em;*/

	height: 45px;
	width: 45px;
}
.close {
	position: absolute;
	right: 0;
	top: 0;
}
.close tw-link {
	box-shadow: none;
	background: url(images/menu_close.png) no-repeat center center;
	background-size: 25px;
	height: 100%;
	padding: 1em;
	width: 100%;
}
.close tw-link:hover, .close tw-link:focus, .close tw-link:active {
	background-color: transparent;
	opacity: .5;
}
.closebox {
	box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.25);
}
.yourchoice.welcome.new:before {
/*    content: '';

    background: url(images/cealcohol-logo.png) no-repeat center center;

    background-size: 100% !important;

    width: 300px;

    height: 37px;

    display: block;

    margin: auto;*/

}
.welcomeheader#alcohol:before {
	background: url(images/cealcohol-logo.png) no-repeat center center;
}
.welcomeheader#obesity:before {
	background: url(images/ceobesity-logo.png) no-repeat center center;
}
.welcomeheader#vepatient:before {
	background: url(images/vepatient-logo.png) no-repeat center center;
}
.welcomeheader:before {
	content: '';
	background-size: 100% !important;
	width: 300px;
	height: 37px;
	display: block;
	margin: auto;
}
.container.welcome, .welcomeheader + br + .container {
	position: relative;
	height: auto;
	margin-top: 0;
	margin-top: -3em;
	padding-bottom: 5em !important;
}
.welcomeheader {
	padding: .75em 1em;
}
.container.welcome .inner > br:first-child, .container.welcome .inner > br:nth-child(2), .container.welcome > br:first-child,  .welcomeheader + br + .container .inner > br:first-child, .welcomeheader + br + .container .inner > br:nth-child(2), .welcomeheader + br + .container > br:first-child, .inner > br:first-child + br {
	display: none;
}
.welcomeimg .patientinfo p {
	-webkit-margin-before: .5em;
	-webkit-margin-after: 1em;
	color: #aaa;
	font-style: italic;
	/*font-size: .85em;*/ 

	margin-left: 6em;
}
.welcomeimg.patientbox .patientimg:before {
	/*margin: -.5em 1em .5em 0;*/

	width: 6.5em;
	height: 6.5em;
}
.patientbox:before {
	/*content: ' ';*/

	font-size: .8em;
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: .75em;
	background: #1cab7d;
}
.patientbox.inactive:before {
	background: #eee;
}
