@font-face 
{
    font-family: 'CreteRoundItalic';
    src: url('fonts/creteround/CreteRound-Italic-webfont.eot');
    src: url('fonts/creteround/CreteRound-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/creteround/CreteRound-Italic-webfont.woff') format('woff'),
         url('fonts/creteround/CreteRound-Italic-webfont.ttf') format('truetype'),
         url('fonts/creteround/CreteRound-Italic-webfont.svg#CreteRoundItalic') format('svg');
		 
	
    font-weight: normal;
    font-style: normal;
}

@font-face 
{
    font-family: 'UbuntuMedium';
    src: url('fonts/ubuntu/Ubuntu-M-webfont.eot');
    src: url('fonts/ubuntu/Ubuntu-M-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ubuntu/Ubuntu-M-webfont.woff') format('woff'),
         url('fonts/ubuntu/Ubuntu-M-webfont.ttf') format('truetype'),
         url('fonts/ubuntu/Ubuntu-M-webfont.svg#UbuntuCondensedRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face 
{
    font-family: 'UbuntuRegular';
    src: url('fonts/ubuntu/Ubuntu-R-webfont.eot');
    src: url('fonts/ubuntu/Ubuntu-R-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ubuntu/Ubuntu-R-webfont.woff') format('woff'),
         url('fonts/ubuntu/Ubuntu-R-webfont.ttf') format('truetype'),
         url('fonts/ubuntu/Ubuntu-R-webfont.svg#UbuntuCondensedRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face 
{
    font-family: 'UbuntuBold';
    src: url('fonts/ubuntu/Ubuntu-B-webfont.eot');
    src: url('fonts/ubuntu/Ubuntu-B-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/ubuntu/Ubuntu-B-webfont.woff') format('woff'),
         url('fonts/ubuntu/Ubuntu-B-webfont.ttf') format('truetype'),
         url('fonts/ubuntu/Ubuntu-B-webfont.svg#UbuntuCondensedRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}


body
{
	background: #FFF;
	font-size: 0.8em;
	font-family: Helvetica, Arial, sans-serif;
}

p
{
	clear: both;
	padding: 2px;
	max-width: 532px;
	color: #000;
}

a
{
	color: #000;
	outline: 0;
	cursor: pointer;
}

h4
{
	color: #333333;
	font-family: 'CreteRoundItalic', Trebuchet MS, Trebuchet MS, sans-serif;
	
	font-weight: 300;
	font-size: 1.3em;
	line-height: 1.3em;
	margin-top: 14px;
	margin-bottom: -12px;
	
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
	
}

.acc
{
	display: none;
}


/* REUSABLE CLASSES */

.clear
{
	clear: both;
}

/* GLOBAL */

/* no shadow - remove? */
.pyramid, .tabbing li.ui-tabs-selected a:hover, .reflection li.ui-tabs-selected
{
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

/* generic background */
.checklist, .checklisttac, .checklisttacquiz, .classificationaaa, .classificationcar, .mcq, .diagnostic, .mcq_le, .paraseq, .paraseqaaa, .process, .process1, .relcon, .tabbing, .application
{
	background: url('../images/genericbg.png')/* !important */;
}

/* unordered lists */
ul
{
	list-style-type: none;
	margin-left: -28px;
}

/* EXCEPT PLUGINS i.e tabbing, reflection */
.checklisttac ul li, .checklisttacquiz ul li, .ctvm ul li, .flashcards ul li, .feedbackpanel ul li, 
.labelledgraphic ul li, .laddersteps ul li, .mcq ul li, .notemaking ul li, .pyramid ul li, .process ul li, .process1 ul li, 
/*.reflection ul li,*/ .relcon ul li, .slider ul li, /*.tabbing ul li,*/ .textentry ul li, .bespoke ul li, .application ul li, .acc ul li
{
	background: url('../images/page_graphics/bulletpointorange.png');
	background-position: 0px 3px; 
	background-repeat: no-repeat;
	margin-bottom: 12px;
	padding-left: 14px;
}

/* START ACTIVITY BUTTON/IMAGE */

.start
{
	background: url('../images/loaders/startbutton.png');
	background-size: cover;
	color: transparent;
	width: 160px;
	height: 70px;
	position: absolute;
	margin: 80px 0 0 185px;
	display: table-cell;
	cursor: pointer;
	vertical-align: middle;
	text-align: center;	
}

.start:hover
{
	background: url('../images/loaders/startbuttonhover.png');
	background-size: cover;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.start:hover
	{
		background: url('../images/loaders/startbutton.png')
	}
}

.start:active
{
	background: url('../images/loaders/startbuttonhover.png');
	background-size: cover;
}

.startimage, .mcq .startimage, .diagnostic .startimage, .mcq_le .startimage, .checklisttacquiz .startimage, .process .startimage, .process1 .startimage
{
	background: url('../images/loaders/loader1.png');
	background-size: cover;
}

.checklist .startimage, .classificationcar .startimage, .checklisttac .startimage
{
	background: url('../images/loaders/loader2.png');
	background-size: cover;
}

.classificationaaa .startimage, .bespoke .startimage
{
	background: url('../images/loaders/loader3.png');
	background-size: cover;
}

/* NAV */

.nav
{
	width: 100%;
	height: 28px;
	float: left;
	margin: 0 !important;
}

/* BUTTON GRADIENT */
.back, .next, .print, .summary, .viewfb, .viewtrans, .copy, .restart, .checkanswers, .ctvm .morebtn, .bespoke .check, .application .check, .quiz
{
	background: #278251;
	/*filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#43B57E", endColorStr="#278251");*/ /* IE9 */ 
	background-image: -ms-linear-gradient(top, #43B57E 0%, #278251 100%); /* IE10 Consumer Preview */ 
	background-image: linear-gradient(to bottom, #43B57E 0%, #278251 100%); /* W3C Markup, IE10 Release Preview */ 
	background-image: -moz-linear-gradient(top, #43B57E 0%, #278251 100%); /* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #43B57E 0%, #278251 100%); /* Opera */ 
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #43B57E), color-stop(1, #278251)); /* Webkit (Safari/Chrome 10) */ 
	background-image: -webkit-linear-gradient(top, #43B57E 0%, #278251 100%); /* Webkit (Chrome 11+) */
}

/* HOVER GRADIENT */
button:enabled:hover, .columnbodyhover, .seesaw-rightitem-hover, .slicebar .bar .slice, .quiz:hover
{
	background: #F15A24;
	/*filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#FF8631", endColorStr="#F15A24");*/ /* IE9 */ 
	background-image: -ms-linear-gradient(top, #FF8631 0%, #F15A24 100%); /* IE10 Consumer Preview */ 
	background-image: linear-gradient(to bottom, #FF8631 0%, #F15A24 100%); /* W3C Markup, IE10 Release Preview */
	background-image: -moz-linear-gradient(top, #FF8631 0%, #F15A24 100%); /* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #FF8631 0%, #F15A24 100%); /* Opera */
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FF8631), color-stop(1, #F15A24)); /* Webkit (Safari/Chrome 10) */
	background-image: -webkit-linear-gradient(top, #FF8631 0%, #F15A24 100%); /* Webkit (Chrome 11+) */ 
}

button:enabled:active, .back:active, .next:active, .print:active, .summary:active, .viewfb:active, .viewtrans:active, .copy:active, .restart:active, .checkanswers:active, .ctvm .morebtn:active. .bespoke .check:active, .application .check:active, .quiz:active
{
	background: #F15A24;
	/*filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#FF8631", endColorStr="#F15A24");*/ /* IE9 */ 
	background-image: -ms-linear-gradient(top, #FF8631 0%, #F15A24 100%); /* IE10 Consumer Preview */ 
	background-image: linear-gradient(to bottom, #FF8631 0%, #F15A24 100%); /* W3C Markup, IE10 Release Preview */
	background-image: -moz-linear-gradient(top, #FF8631 0%, #F15A24 100%); /* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #FF8631 0%, #F15A24 100%); /* Opera */
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FF8631), color-stop(1, #F15A24)); /* Webkit (Safari/Chrome 10) */
	background-image: -webkit-linear-gradient(top, #FF8631 0%, #F15A24 100%); /* Webkit (Chrome 11+) */ 
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.back:hover, .next:hover, .print:hover, .viewfb:hover, .viewtrans:hover, .copy:hover, .restart:hover, .checkanswers:hover, .ctvm .morebtn:hover, .bespoke .check:hover, .application .check:hover, .quiz:hover
	{
		background: #278251;
		/*filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#43B57E", endColorStr="#278251");*/ /* IE9 */ 
		background-image: -ms-linear-gradient(top, #43B57E 0%, #278251 100%); /* IE10 Consumer Preview */ 
		background-image: linear-gradient(to bottom, #43B57E 0%, #278251 100%); /* W3C Markup, IE10 Release Preview */ 
		background-image: -moz-linear-gradient(top, #43B57E 0%, #278251 100%); /* Mozilla Firefox */ 
		background-image: -o-linear-gradient(top, #43B57E 0%, #278251 100%); /* Opera */ 
		background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #43B57E), color-stop(1, #278251)); /* Webkit (Safari/Chrome 10) */ 
		background-image: -webkit-linear-gradient(top, #43B57E 0%, #278251 100%); /* Webkit (Chrome 11+) */
	}
}

/* ALT GRADIENT */
.slicebar, .nav
{	
	filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#036648", endColorStr="#005445");	/* IE9 */ 
	background-image: -ms-linear-gradient(top, #036648 0%, #005445 100%); /* IE10 Consumer Preview */ 
	background-image: linear-gradient(to bottom, #036648 0%, #005445 100%); /* W3C Markup, IE10 Release Preview */
	background-image: -moz-linear-gradient(top, #036648 0%, #005445 100%); /* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #036648 0%, #005445 100%); /* Opera */
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #036648), color-stop(1, #005445)); /* Webkit (Safari/Chrome 10) */
	background-image: -webkit-linear-gradient(top, #036648 0%, #005445 100%); /* Webkit (Chrome 11+) */ 
}

button
{
	color: #FFF;
	font-family: 'UbuntuBold', Lucida Sans Unicode, Lucida Grande, sans-serif !important;
	font-size: 1em;
	/*font-weight: bold !important;*/
	text-transform: uppercase;
	letter-spacing: 0.023em;
}

button:enabled
{
	cursor: pointer;
}

button:disabled
{
	opacity: 0.6;
}

.nav .next, .nav .back, .nav .print, .nav .summary
{	
	border-left: 1px solid #FFF;
	float: right;
	margin: 0;
}

.nav .restart, button.copy
{	
	border: 0;
	border-right: 1px solid #FFF;
	float: left;
	height: 28px;
	margin: 0;
}

button.btn, button.back, button.next, button.restart, button.checkanswers, button.viewfb, button.viewtrans, button.print, button.summary, button.quiz
{	
	border: 0px solid #000;
	max-width: 500px;
	height: 28px;
}

/* disable grey flash on tap !!!IMPORTANT FOR TOUCH SCREEN!!! */
a, button, .start, .startimage, .checklist, .checklisttac, .checklisttacquiz, .classificationaaa, .classificationcar, .ctvm, .flashcards, .feedbackpanel, .labelledgraphic, .point, .laddersteps, .matching, .mcq, .diagnostic, .mcq_le, .notemaking, .opinions, .paraseq, .paraseqaaa, .pyramid, .relcon, .process, .process1, .reflection, .slider, .seesaw, .tabbing, .textentry, .bespoke .viewfb, .feedback, .bespoke, .application, .comicbook
{
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.viewfb, .viewtrans
{
	border: 1px solid #FFF !important;
	height: auto !important;
	margin-bottom: 6px;
	margin-left: 204px;
	padding: 7px;
	/*padding-bottom: 7px;*/
	padding-left: 11px;
	padding-right: 11px;
	
	border-radius: 18px;
	-moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    -khtml-border-radius: 18px;

	box-shadow: 0px 1px 1px 1px #999;
	-moz-box-shadow: 0px 1px 1px 1px #999;
	-webkit-box-shadow: 0px 1px 1px 1px #999;
}

/*.viewfb:after
{
	content:'';
	background: url('../images/page_graphics/fbicon.png');
	background-size: cover;
	height: 38px;
	width: 40px;
	padding: 0px;
	position: relative;
	margin-left: 4px;
	margin-right: -10px;
	margin-top: -20px;
	float: right;
	z-index: 4;
	
}*/

.feedback, .checklisttac .feedbackpanel, .checklisttacquiz .feedbackpanel
{
	background: #F5EDE1;
	border: 1px solid #C8C1B8;
	border-top: none;
	clear: both;
	
	box-shadow: inset 0 7px 6px -6px #999;
	-moz-box-shadow: inset 0 7px 6px -6px #999;
	-webkit-box-shadow: inset 0 7px 6px -6px #999;
}

.feedback
{
	padding: 14px 12px 0px 12px;
	/* max-width: 100%; */
}

/* activity widths + margin */
.checklist, .checklisttac, .checklisttacquiz, .classificationaaa, .classificationcar, .ctvm, .flashcards, .feedbackpanel, .vidtrans, .audtrans, .labelledgraphic, .laddersteps, .matching, .mcq, .diagnostic, .mcq_le, .notemaking, .opinions, .paraseq, .paraseqaaa, .pyramid, .relcon, .process, .process1, .reflection, .slider, .seesaw, .tabbing, .textentry, .bespoke, .application
{
	width: 540px !important;
	margin: 20px 0;
	/* margin-bottom: 20px; */
	
	box-shadow: 0 7px 6px -6px #333;
	-moz-box-shadow: 0 7px 6px -6px #333;
	-webkit-box-shadow: 0 7px 6px -6px #333;
}


.feedbackpanel, .vidtrans, .audtrans /* same as regular feedback but with margin top */
{
	background: #F5EDE1;
	border: 1px solid #C8C1B8;
	/* margin-top: 10px; */
	padding: 8px 12px 12px 12px;
	width: 514px !important;
	min-height: 28px;
	clear: both;
	
	/* padding-bottom: 32px; */
	/* float: left; */
	/* margin-bottom: 20px; */
}

.feedbackpanel .text, .audtrans .text, .vidtrans .text
{
	/* background: #F5EDE1;
	height: 100%;
	padding: 16px 14px 14px 14px;
	box-shadow: inset 0 7px 6px -6px #666;
	-moz-box-shadow: inset 0 7px 6px -6px #666;
	-webkit-box-shadow: inset 0 7px 6px -6px #666; */
	/* 	float: left; */
	height: 100%;
	position: relative;
	top: 8px;
}

/* top margin bug for some activities */
.checklist .nav, .checklisttac .nav, .checklisttacquiz .nav, .classificationaaa .nav, .classificationcar .nav, .paraseq .nav, .paraseqaaa .nav, .textentry .nav
{
	margin-bottom: 10px !important;
}

/* generic item box styling */
.enditem, .item, .correct, .incorrect, .intro
{
	background: #FFF;
	border-bottom: 1px solid #6EBBA3;
	position: relative;
	margin: 10px;
	margin-bottom: -2px;
	padding: 8px;
}

.item
{
	display: block;
	clear: both;
	overflow: hidden;
}

.item p
{
	width: 80%;
}

.selected, .selected:hover
{
	background: #E0CCFF;
	border-bottom: 1px solid #A082DB;
}

/* corner peel for notemaking and ctvm */
.ctvm .cornerimg, .notemaking .cornerimg, .application .cornerimg
{
	float: right;
}

/* -------------------- */
/* CHECKLIST */
/* -------------------- */

.checklist .item
{
	padding: 8px;
}

.checklist .item .text
{
	width: 70%;
	position: relative;
	padding-right: 50px;
}

.checklist ul
{
	list-style-type: none;
	margin: 0;
	margin-left: -40px;
}

.checklist ul li
{
	background: url('../images/page_graphics/bulletpointorange.png') no-repeat;
	background-position: 0px 3px; 
	padding-left: 12px;
}

/* -------------------- */
/* CHECKLIST TAC */
/* -------------------- */

.checklisttac .item .text, .checklisttacquiz .item .text
{
	width: 85%;
	float: left;
	padding: 4px;
	padding-top: 6px;
	padding-bottom: 6px;
}

.checklisttac .item .btns, .checklisttacquiz  .item .btns
{
	float: right;
	margin: 1px;
	margin-left: 1px;
}

.checklisttac .feedback, .checklisttacquiz .feedback
{
	margin-top: 34px !important;
	padding-bottom: 10px;
}

button.tick, button.cross
{
	border: 0px solid #000;
	max-width: 500px;
	width: 26px;
	height: 26px;
	margin: 2px;
	padding-top: 0px;
	padding-bottom: 10px;
}

button.tick
{
	background: url('../images/checklist_tac/tick_available.png');	
}

button.cross
{
	background: url('../images/checklist_tac/cross_available.png');	
}

button.tick:enabled:hover
{
	background: url('../images/checklist_tac/tick_hover.png') !important;
	filter: none;
}

button.tick.selected:enabled /* replaces focus */
{
	background: url('../images/checklist_tac/tick.png');
}

button.tick.selected:enabled:hover /* replaces focus */
{
	background: url('../images/checklist_tac/tick.png') !important;
	border: none !important;
	cursor: default !important;
}

button.tick.selected:enabled:active /* replaces focus */ /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: url('../images/checklist_tac/tick.png') !important;
	border: none !important;
	cursor: default !important;
}

button.cross:enabled:hover
{
	background: url('../images/checklist_tac/cross_hover.png');
	filter: none;
}

button.cross.selected:enabled /* replaces focus */
{
	background: url('../images/checklist_tac/cross.png');
}

button.cross.selected:enabled:hover /* replaces focus */
{
	background: url('../images/checklist_tac/cross.png') !important;
	border: none !important;
	cursor: default !important;
}

/* -------------------- */
/* CLASSIFICATION AAA */
/* -------------------- */

.classificationaaa
{
	height: 100%;
}

.classificationaaa .items
{
	margin: 12px;
}

.classificationaaa .item
{
	margin: 0px;
	margin-bottom: 4px;
	cursor: pointer;
}

.classificationaaa .item:hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.classificationaaa .item:hover
	{
		background: #FFFFFF;
		border-bottom: 1px solid #6EBBA3;
	}
}

.classificationaaa .item.selected:hover /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #E0CCFF;
	border-bottom: 1px solid #A082DB;
}

.classificationaaa .item:active /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

.classificationaaa .heads
{
	margin: 12px;
}

.classificationaaa .bodies
{
	min-height: 0px;
	height: 300px;
	margin: 12px;
}

.columnhead
{
	background: #DAF5E7;
	border-top: none;
	border-left: 1px solid #6EBBA3;
	height: 50px;
	float: left;
	margin: 0px;
	padding: 8px;
}

.columnbody
{
	border-right: 1px solid #036648;
	border-bottom: 1px solid #036648;
	position: relative;
	width: 50%;
	min-height: 0px;
	height: 300px;
	float: left;
	margin: 0;
	padding: 6px;
	
	box-shadow: inset 0 7px 6px -6px #2C5666;
	-moz-box-shadow: inset 0 7px 6px -6px #2C5666;
	-webkit-box-shadow: inset 0 7px 6px -6px #2C5666;
}

.columnbody:first-of-type
{
	border-left: 1px solid #036648;
}


.columnbody .item, .columnbody .docked
{
	height: 28px;
}

.docked
{
	background: #FFF;
	border-bottom: 1px solid #6EBBA3;
	position: relative;
	margin-bottom: 6px;
	padding: 8px;
}

.addbtn, .addbtnhover
{
	width: 21px;
	height: 21px;
	float: right;
}

.addbtn
{
	background: url('../images/classification/addbtn.png');
}

.addbtnhover
{
	background: url('../images/classification/addbtn_hover.png');
}

/* -------------------- */
/* CLASSIFICATION CAR */
/* -------------------- */

.classificationcar .items
{
	margin: 12px;
}

.classificationcar .item
{
	margin: 0px;
	margin-bottom: 4px;
	cursor: pointer;
}

.classificationcar .item:hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.classificationcar .item:hover
	{
		background: #FFFFFF;
		border-bottom: 1px solid #6EBBA3;
	}
}

.classificationcar .item.selected:hover /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #E0CCFF;
	border-bottom: 1px solid #A082DB;
}

.classificationcar .item:active /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

.classificationcar .heads
{
	margin: 12px;
}

.classificationcar .bodies
{
	min-height: 0px;
	height: 300px;
	margin: 12px;
}

.classificationcar .columnbody .docked,
{
	cursor: default;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{	
	.columnbody:hover
	{
		background: none;
	}
	
	.columnbody:active
	{
		background: #F15A24;
	}
}

/* -------------------- */
/* CTVM */
/* -------------------- */

.ctvm
{
	background: url('../images/ctvm/notemakingbg.png'); /*#0A4358*/
}

.ctvm p 
{
	margin: 0;
	padding: 0;
}

.ctvm .intro
{
	background: #DAF5E7;
	border-right: 1px solid #6EBBA3;
	border-left: 1px solid #6EBBA3;
	clear: both;
	margin: 0;
	padding: 12px;
}

.ctvm .more
{
	background: #F5EDE1; /* #CCFFC4 */
	border-right: 1px solid #6EBBA3;
	border-left: 1px solid #6EBBA3;
	color: #000;
	clear: both;
	max-width: 100%;
	max-height: 170px;
	min-height: 100px;
	overflow-y: auto;
	
	/* border: 1px solid #C8C1B8; */
	padding: 12px;
	padding-bottom: 4px !important;
	/* padding-bottom: 20px; */
	float: left;
	/* position: relative; */
	/* top: 8px; */
	/* margin-bottom: 30px; */
	width: 514px;
	
	box-shadow: inset 0 7px 6px -6px #999;
	-moz-box-shadow: inset 0 7px 6px -6px #999;
	-webkit-box-shadow: inset 0 7px 6px -6px #999;
}

/*
.ctvm .feedback
{
	border: 1px solid #C8C1B8;
	padding: 0;
	padding-bottom: 32px;
	float: left;
	position: relative;
	top: 8px;
	margin-bottom: 30px;
}
*/

.ctvm .more .text
{
	padding: 0px 12px 11px 12px;
	/* border-left: 1px solid #4EB840; */
	border-right: 1px solid #4EB840;
	position: relative;
	top: 8px;
	/* background: #F5EDE1; */
	height: 100%;
	margin-bottom: 10px;
	/* padding: 16px 14px 14px 14px; */
	/* box-shadow: inset 0 7px 6px -6px #666; */
	/* -moz-box-shadow: inset 0 7px 6px -6px #666; */
	/* -webkit-box-shadow: inset 0 7px 6px -6px #666; */
	/* float: left; */
	/* height: 100%; */
	/* width: 100%; */
}

.ctvm .morebtn
{
	border: 1px solid #FFF;
	position: relative;
	left: 50%;
	margin-left: -82px;
	padding: 7px;
	/* padding-bottom: 7px;*/
	padding-left: 9px;
	padding-right: 9px;
	
	border-radius: 18px;
	-moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    -khtml-border-radius: 18px;
	
	box-shadow: 0px 1px 1px 2px #013829;
	-moz-box-shadow: 0px 1px 1px 2px #013829;
	-webkit-box-shadow: 0px 1px 1px 2px #013829;
}

/*.ctvm .morebtn:after
{
	content:'';
	background: url(../images/ctvm/ctvmicon.png) no-repeat;
	background-size: cover;
	height: 28px;
	width: 28px;
	padding: 0px;
	position: relative;
	margin-left: 3px;
	margin-right: -7px;
	margin-top: -7px;
	margin-bottom: -6px;
	float: right;
}*/

/*.ctvm .arrowimg
{
	margin: 0 auto;
}*/

/* -------------------- */
/* FLASHCARDS */
/* -------------------- */

.flashcards
{
	background: url('../images/flashcards/woodbg.png');
	height: 100%;
	padding-top: 4px;
	padding-bottom: 6px;
	
	-webkit-perspective: 800;
  	-moz-perspective: 800;
}

.flashcards .cards
{
	width: 506px;
	margin: 0;
	margin-left: 17px;
}

.flashcards .card
{
  	width: 158px;
  	height: 202px;
  	float: left;
  	margin: 5px;
	
	-webkit-transform-style: preserve-3d;
  	-webkit-transition: 0.5s;
  	-moz-transform-style: preserve-3d;
  	-moz-transition-duration: 0.5s;
	
	box-shadow: 0px 2px 2px 1px #A9805F;
	-moz-box-shadow: 0px 2px 2px 1px #A9805F;
	-webkit-box-shadow: 0px 2px 2px 1px #A9805F;
}

.flashcards .card span
{
	display: table-cell;
  	vertical-align: middle;
  	padding: 0 10px;
}

.flashcards .card.flipped
{
	margin: 5px;
  	
	-webkit-transform: rotateY(-180deg);
  	-moz-transform: rotateY(-180deg);
  	-webkit-transform-style: preserve-3d;
}

.flashcards .card .face
{
  	font-family: Helvetica, Arial, sans-serif;
	font-size: small;
    text-align: left;
	line-height: 15px;
	display: table;
	position: absolute;
	width: 158px;
  	height: 202px;
	z-index: 3;
  	
	-webkit-backface-visibility: hidden;
  	-moz-backface-visibility: hidden;
  	-webkit-transform-style: preserve-3d;
  	-moz-transform-style: preserve-3d;
}

.flashcards .card .front
{
	background: url('../images/flashcards/flashcard_front.png');
	color: #000;
  	position: absolute;
    cursor: pointer;
	z-index: 2;
	
	-webkit-transform: rotateY(0deg);
  	-moz-transform: rotateY(0deg);
  	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

.flashcards .card .front span
{
	text-align: center;
}

.flashcards .card .back
{
	
  	background: url('../images/flashcards/flashcard_back.png');
	color: #000;
    cursor: pointer;
	z-index: 1;
	
	-webkit-transform: rotateY(-180deg);
  	-moz-transform: rotateY(-180deg);
  	-webkit-transform-style: preserve-3d;
	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

/* -------------------- */
/* LABELED GRAPHIC */
/* -------------------- */

.labelledgraphic
{
	position: relative;
	width: 100%;
}

.labelledgraphic img
{	
	border: 1px solid #CCC;
	border-bottom: none;
	width: 538px;
}

.labelledgraphic span
{
	margin-top: 20px;
}

.labelledgraphic .active
{
	background: url('../images/labelled_graphic/pinpoint_active.png') !important;
	background-size: cover !important;
}

.point
{
	background: url('../images/labelled_graphic/pinpoint.png');
	background-size: cover;
	position: absolute;
	width: 30px;
	height: 38px;
	cursor: pointer;
}

.point:hover
{
	background: url('../images/labelled_graphic/pinpoint_hover.png');
	background-size: cover;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.point, .point:hover, .labelledgraphic .active
	{
		width: 60px !important;
		height: 76px !important;
		margin-left: 0px !important;
		margin-top: 0px !important;
	}
}

.labelledgraphic .feedback
{
	background: #F5EDE1;
	border: 1px solid #C8C1B8;
	border-top: none;
	width: 538px !important;
	padding: 0;
	padding-bottom: 2px;
	/* float: left; */
	/* position: relative; */
	/* top: 20px; */
	margin-bottom: 20px;
}

.labelledgraphic .feedback .text
{
	background: #F5EDE1;
	height: 100%;
	padding: 15px 14px 14px 14px;
	float: left;
	
	box-shadow: inset 0 7px 6px -6px #666;
	-moz-box-shadow: inset 0 7px 6px -6px #666;
	-webkit-box-shadow: inset 0 7px 6px -6px #666;
}

/* -------------------- */
/* LADDER-STEPS */
/* -------------------- */

.laddersteps
{
	background: url('../images/ladder_steps/ladderstepsbg.png');
}

.labels, .numbers
{
	/* height: 100px; */
	float: left;
}

.labels
{
	/* background: yellow; */
	width: 166px;
}

.numbers
{
	/* background: green; */
	margin-left: 14px;
	width: 92px;
}

.number
{
	border: 2px solid #FFF;
	color: #FFF;
	font: 32pt bolder;
	font-weight: bold;
	font-family: 'UbuntuBold', Lucida Sans Unicode, Lucida Grande, sans-serif !important;
	text-align: center;
	display: inline-block;
	width: 68px;
	height: 47px;
	margin-left: 9px !important;
	/* margin-right: 20px; */
	padding: 13px 0 12px 0;
	/* padding-left: 10px; */
	/* margin-bottom: 1px; */
	float: left;
	clear: both;
}

.numberactive 
{
	background: url('../images/ladder_steps/step_active.png') !important;
}

.numberhover
{
	background: url('../images/ladder_steps/step_hover.png') !important;
}

.numberbg
{
	width: 90px;
	background: url('../images/ladder_steps/uparrows_empty.png');
	/* background-position: right; */
	background-repeat: no-repeat;
	/* width: 100px; */
	/* margin-left: 9px; */
	height: 76px;
	float: left;
	/* padding-bottom: -2px; */
}

.numberbg-available
{
	background: url('../images/ladder_steps/uparrows_available.png');
}

.numberbg-hover
{
	background: url('../images/ladder_steps/uparrows_hover.png');
}

.numberbg-active
{
	background: url('../images/ladder_steps/uparrows_active.png');
}

.laddersteps .label
{ 
	background: #DAF5E7;
	border-bottom: 1px solid #6EBBA3;
	border-left: 1px solid #6EBBA3;
	font: 13px bold;
	font-family: Helvetica, Arial, sans-serif !important;
	/* position: absolute; */
	display: table;
	width: 166px;
	height: 75px;
	float: left;
	margin-right: 10px;
	/* margin-right: 109px; */
	padding-left: 12px;
	/* margin-bottom: 1px; */
}

.laddersteps .label span
{
	display: table-cell;
	vertical-align: middle;
	text-align: left;
	/* line-height: 10px; */
}

.laddersteps .active
{
	background: #E0CCFF !important;
}

.laddersteps .available
{
	background: #DAF5E7;
	cursor: pointer;
}

.laddersteps .availablehover
{
	background: #FFF1A8;
}

.stepfb
{
	/* background-color: #FFF; */
	/* border: 1px solid #CCC; */
	background: #F5EDE1;
	border: 1px solid #C8C1B8;
	/* border-left: 1px solid #FFF; */
	width: 226px !important;
	float: right;
	padding: 20px 20px 2px 20px;
	overflow-y: auto;
	
	box-shadow: inset 7px 0 6px -6px #B3B3B3;
	-moz-box-shadow: inset 7px 0 6px -6px #B3B3B3;
	-webkit-box-shadow: inset 7px 0 6px -6px #B3B3B3;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{	
	.laddersteps .label
	{
		height: 75px !important;
	}
	
	.numberactive 
	{
		background: url('../images/ladder_steps/step_hover.png') !important;
	}
	
	.numberbg-active
	{
		background: url('../images/ladder_steps/uparrows_hover.png');
	}
	
	.laddersteps .active
	{
		background: #FFF1A8;
	}
}

/* -------------------- */
/* MATCHING */
/* -------------------- */

.matching
{
	background: url('../images/matching/matchingbg.png');
}

.matching .nav
{
	margin-bottom: 6px !important;
}

.column
{
	width: 50%;
	float: left;
	margin-left: 0px;
}

.matching .column .item
{
	width: 224px;
	height: 50px;
	margin: 8px 0px 12px 12px;
	cursor: pointer;
}

.matching .item-hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.matching .item-hover
	{
		background: #FFFFFF;
		border-bottom: 1px solid #6EBBA3;
	}
}

.matching .selected, .matching .selected:hover
{
	background: #E0CCFF;
	border-bottom: 1px solid #A082DB;
}

.locked, .locked-ie, .locked2, .locked2-ie
{
	background: #CCFFC4;
	border-bottom: 1px solid #4EB840 !important;
}

.locked, .locked2
{
	border-style: solid;
	background-clip: padding-box;
}

.locked
{
	left: 10px;
	border-width: 0px 8px 0px 0px;
	border-image: url('../images/matching/matchmarkers.png') 0 15 0 0 repeat;
	-moz-border-image: url('../images/matching/matchmarkers.png') 0 15 0 0 repeat;
	-webkit-border-image: url('../images/matching/matchmarkers.png') 0 15 0 0 repeat;
	-o-border-image: url('../images/matching/matchmarkers.png') 0 10 0 0;
}

.locked-ie
{
	left: 10px;
}

.locked2
{
	right: 18px;
	border-width: 0px 0px 0px 8px;
	border-image: url('../images/matching/matchmarkers.png') 0 0 0 15 repeat;
	-moz-border-image: url('../images/matching/matchmarkers.png') 0 0 0 15 repeat;
	-webkit-border-image: url('../images/matching/matchmarkers.png') 0 0 0 15 repeat;
	-o-border-image: url('../images/matching/matchmarkers.png') 0 0 0 10;
}

.locked2-ie
{
	right: 10px;
}

/* -------------------- */
/* MCQ */
/* -------------------- */

.mcq, .mcq_le, .diagnostic
{
	overflow: hidden;
}

.mcq .nav, .mcq_le .nav, .diagnostic .nav
{
	margin-bottom: 13px !important;
}

.mcq .score
{
	color: #278251;
	font-family: 'CreteRoundItalic', Trebuchet MS, Trebuchet MS, sans-serif;
	
	font-size: 19px;
	text-transform: capitalise;
	display: block;
	float: right;
	margin: 0;
	padding: 0 14px 0 0;
	
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
}

.mcq .ques, .mcq_le .ques, .diagnostic .ques
{
	background: #DAF5E7;
	border: 1px solid #6EBBA3;
	border-top: none;
	color: #000;
	padding: 6px 12px 0px 6px;
}

.mcq .quesnum, .mcq_le .quesnum, .diagnostic .quesnum
{
	color: #278251;
	font-family: 'CreteRoundItalic', Trebuchet MS, Trebuchet MS, sans-serif;
	
	font-size: 19px;
	text-transform: capitalise;
	margin-left: 7px;
	
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
}

.mcq .questext, .mcq_le .questext, .diagnostic .questext
{
	width: 450px;
	margin: 0;
}

.mcq .questext p, .mcq_le .questext p, .diagnostic .questext p
{
	margin-top: 5px;
}

.mcq .ans, .application .ans, .mcq_le .ans, .diagnostic .ans
{
	background: #FFF;
	border-bottom: 1px solid #6EBBA3;
	color: #000;
	margin: 10px;
	padding: 8px;
	cursor: pointer;
}

.mcq .ans .text, .application .ans .text, .mcq .active .text
{
	padding-right: 110px;
}

/* .mcq_le .ans .text, */

.mcq .ans span, .mcq_le .ans span, .application .ans span
{
	height: 100px;
}

.mcq .ans:hover, .application .ans:hover, .mcq_le .ans:hover, .diagnostic .ans:hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.mcq .ans:hover, .mcq_le .ans:hover, .application .ans:hover
	{
		background: #FFFFFF;
		border-bottom: 1px solid #6EBBA3;
	}
}

.mcq .ans:active, .mcq_le .ans:active, .application .ans:active, .diagnostic .ans:active
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

.mcq .ansdisabled, .mcq_le .ansdisabled, .diagnostic .ansdisabled
{
	background: #FFF;
	border-bottom: #6EBBA3 1px solid;
	margin: 10px;
	padding: 8px;
	cursor: pointer;
}

.mcq .active, .mcq_le .active, .diagnostic .active
{
	background: #E0CCFF;
	border-bottom: 1px solid #A082DB;
	color: #000;
	margin: 10px;
	padding: 8px;
	cursor: pointer;
}

.mcq .ans.active:hover, .mcq_le .ans.active:hover, .diagnostic .ans.active:hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

.mcq .check, .application .check
{
	background: url('../images/mcq/checkanswer.png') no-repeat;
	background-size: cover;
	width: 125px;
	height: 53px;
	float: right;
	margin: -18px -17px 0 0;
	cursor: pointer;
}

.mcq .check:hover, .application .check:hover
{
    background: url('../images/mcq/checkanswer_hover.png');
	background-size: cover;
}

.mcq .check:active, .application .check:active
{
    background: url('../images/mcq/checkanswer_hover.png');
	background-size: cover;
}

.diagnostic .summaryscreen
{
/* 	background: #FFF; */
/* 	border-bottom: 1px solid #6EBBA3; */
	width: 540px;
/* 	margin-left: 10px; */
/* 	margin-right: 10px; */
/* 	margin-bottom: 10px; */
/* 	padding: 8px; */
	position: relative;
}

.diagnostic .summaryscreen .item
{
	margin-top: -3px;
}

.diagnostic .heads
{
	margin: 12px;
}

.diagnostic .bodies
{
	min-height: 0px;
	height: 300px;
	margin: 12px;
}

.diagnostic .columnhead
{
	background: #DAF5E7;
	border-top: none;
	border-left: 1px solid #6EBBA3;
	height: 20px;
	float: left;
	margin: 0px;
	padding: 8px;
}

.diagnostic .columnbody
{
	border-right: 1px solid #036648;
	border-bottom: 1px solid #036648;
	position: relative;
	width: 50%;
	min-height: 0px;
	height: 238px;
	float: left;
/* 	margin: 10px; */
	padding: 6px;
	overflow-y: auto;
	box-shadow: inset 0 7px 6px -6px #2C5666;
	-moz-box-shadow: inset 0 7px 6px -6px #2C5666;
	-webkit-box-shadow: inset 0 7px 6px -6px #2C5666;
}

.diagnostic .ques
{
	height: 110px;
}

.diagnostic .answers
{
	height: 280px;
}

.diagnostic
{
	height: 416px;
}

/* -------------------- */
/* NOTEMAKING */
/* -------------------- */

.notemaking
{
	background: url('../images/notemaking/notemakingbg.png'); /*0A4358*/
}

.notemaking .nav
{
	margin-bottom: 7px !important;
}

.notemaking button.viewfb
{
	border: 1px solid #FFF;
	position: relative;
	height: auto !important;
	left: 50%;
	margin-left: -68px !important;
	padding: 7px;
	/* padding-bottom: 7px; */
	padding-left: 11px;
	padding-right: 11px;
	
	border-radius: 18px;
	-moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    -khtml-border-radius: 18px;
	
	box-shadow: 0px 1px 1px 2px #013829;
	-moz-box-shadow: 0px 1px 1px 2px #013829;
	-webkit-box-shadow: 0px 1px 1px 2px #013829;
}

.notemaking .quesnum
{
	color: #278251;
	font-family: 'CreteRoundItalic', Trebuchet MS, Trebuchet MS, sans-serif;
	font-size: 19px;
	text-transform: capitalise;
	margin: 0 0 -16px 0px;
		
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;  
}

.notemaking .question, .content .question
{
	background: #DAF5E7;
	border-right: 1px solid #6EBBA3;
	border-left: 1px solid #6EBBA3;
	padding: 14px;
}

.notemaking textarea
{
	border: 1px solid #6EBBA3;
	border-bottom: none;
	font-size: 13px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	width: 526px;
	max-height: 100px;
	margin: 0;
	padding: 6px;
	resize: none;
	
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	-khtml-border-radius: 0px;
}

.notemaking .summ
{
	background: #FFF;
	border: 1px solid #6EBBA3;
	color: #000;
	padding: 6px;
	overflow-y: auto;
}

.notemaking .more
{
	background: #F5EDE1;
	border: 1px solid #C8C1B8;
	color: #000;
	max-width: 100%;
	max-height: 260px;
	min-height: 100px;
	padding: 12px;
	padding-bottom: 11px;
	clear: both;
	overflow-y: auto;
	
	box-shadow: inset 0 7px 6px -6px #999;
	-moz-box-shadow: inset 0 7px 6px -6px #999;
	-webkit-box-shadow: inset 0 7px 6px -6px #999;
}

/* -------------------- */
/* OPINIONS */
/* -------------------- */

.opinions
{
	background: url('../images/opinions/opinionsbg.png');
	overflow: hidden;
}

.opi
{
	display: inline-block;
}

.opi img
{
	border: 1px solid transparent; /*#BBB*/
	cursor: pointer;
}

.opi .opihover, .opi .opiactive
{
	position: absolute;
	opacity: 0;
	
}

.opinions .item
{
	border: 1px solid #6EBBA3;
	margin: 12px 12px 0 12px;
	padding: 12px;
	
	border-radius: 6px;
	-moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -khtml-border-radius: 6px;
}

.opinions .spike
{
	background: url('../images/opinions/speech_tail_minwidth.png') no-repeat;
	background-size: cover;
	position: relative;
	top: -3px;
	left: 50%;
	width: 19px;
	height: 28px;
	margin-left: -14px;
	z-index: 2;
}

/* -------------------- */
/* PARASEQ */
/* -------------------- */

.paraseq .checkanswers
{
	border-left: 1px solid #FFF !important;
	float: right;
	margin: 0;
}

.paraseq .item
{
	margin-top: 10px!important 0 -4px!important 0;
	cursor: pointer;
}

.paraseq .item:hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.paraseq .item:hover
	{
		background: #FFFFFF;
		border-bottom: 1px solid #6EBBA3;
	}
}

.paraseq .item .selected:hover /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #E0CCFF;
	border-bottom: 1px solid #A082DB;
}

.paraseq .item:active /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}


.correct
{
	background: #CCFFC4;
}

.incorrect
{
	background: #FFC9D3;
}

/* -------------------- */
/* PARASEQ */
/* -------------------- */

.paraseqaaa .item
{
	margin: 10px 0 -4px !important 0;
	cursor: pointer;
}

/*.paraseqaaa .item:hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}*/

.paraseqaaa .item .selected:hover /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #E0CCFF;
	border-bottom: 1px solid #A082DB;
}

.paraseqaaa .item:active /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}


.paraseq .item
{
	margin: 10px 0 -4px !important 0;
	cursor: pointer;
}

/*.paraseq .item:hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}*/

.paraseq .item .selected:hover /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #E0CCFF;
	border-bottom: 1px solid #A082DB;
}

.paraseq .item:active /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
}


/* -------------------- */
/* PROCESS */
/* -------------------- */

.process, .process1
{
	overflow: hidden;
}

.process .item, .process1 .item
{
	background: #FFF;
	border-right: 1px solid #6EBBA3;
	border-bottom: none;
	border-left: 1px solid #6EBBA3;
	margin: 0;
	padding: 20px !important;	
	
	box-shadow: inset 0 7px 6px -6px #B3B3B3;
	-moz-box-shadow: inset 0 7px 6px -6px #B3B3B3;
	-webkit-box-shadow: inset 0 7px 6px -6px #B3B3B3;
}

/* -------------------- */
/* PYRAMID */
/* -------------------- */

.pyramid
{
	background: url('../images/pyramid/pyramidbg.png') no-repeat;
	padding: 0;
	overflow: hidden;
}

.pyramid .step
{
	display: table;
	text-align: center;
	vertical-align: middle;
	height: 101px;
	margin: auto;
	cursor: pointer;
}

.step31, .step32
{
	height: 101px;
/* 	height: auto; */
}

.step41, .step42, .step43
{
	height: 75px;
}

.step51, .step52, .step53, .step54
{
	height: 63px;
}

.step61, .step62, .step63, .step64, .step65
{
	height: 54px;
}

.step30, .step31, .step32, .step40, .step41, .step42, .step43, .step50, .step51, .step52, .step53, .step54, .step60, .step61, .step62, .step63, .step64, .step65
{
	width: 442px;
	background-size: cover;
}

.step30
{
	background: url('../images/pyramid/3step/step1.png');
	height: 140px !important;
	margin-top: 16px !important;
}

.step30hover
{
	background: url('../images/pyramid/3step/step1hover.png');
}

.step30down
{
	background: url('../images/pyramid/3step/step1active.png');
}

.step31
{
	background: url('../images/pyramid/3step/step2.png');
}

.step31hover
{
	background: url('../images/pyramid/3step/step2hover.png');
}

.step31down
{
	background: url('../images/pyramid/3step/step2active.png');
}

.step32
{
	background: url('../images/pyramid/3step/step3.png');
	margin-bottom: 30px !important;
}

.step32hover
{
	background: url('../images/pyramid/3step/step3hover.png');
}

.step32down
{
	background: url('../images/pyramid/3step/step3active.png');
}

/* //// */

.step40
{
	background: url('../images/pyramid/4step/step1.png');
	height: 119px !important;
	margin-top: 12px !important;
}

.step40hover
{
	background: url('../images/pyramid/4step/step1hover.png');
}

.step40down
{
	background: url('../images/pyramid/4step/step1active.png');
}

.step41
{
	background: url('../images/pyramid/4step/step2.png');
}

.step41hover
{
	background: url('../images/pyramid/4step/step2hover.png');
}

.step41down
{
	background: url('../images/pyramid/4step/step2active.png');
}

.step42
{
	background: url('../images/pyramid/4step/step3.png');
	height: 76px;
}

.step42hover
{
	background: url('../images/pyramid/4step/step3hover.png');
}

.step42down
{
	background: url('../images/pyramid/4step/step3active.png');
}

.step43
{
	background: url('../images/pyramid/4step/step4.png');
	margin-bottom: 30px !important;
}

.step43hover
{
	background: url('../images/pyramid/4step/step4hover.png');
}

.step43down
{
	background: url('../images/pyramid/4step/step4active.png');
}

.step41, .step43
	{
		height: 75px !important;
	}
	
	.step42
	{
		height: 76px !important;
	}
	
/* //// */

.step50
{
	background: url('../images/pyramid/5step/step1.png');
	height: 91px !important;
	margin-top: 16px !important;
}

.step50hover
{
	background: url('../images/pyramid/5step/step1hover.png');
}

.step50down
{
	background: url('../images/pyramid/5step/step1active.png');
}

.step51
{
	background: url('../images/pyramid/5step/step2.png');
}

.step51hover
{
	background: url('../images/pyramid/5step/step2hover.png');
}

.step51down
{
	background: url('../images/pyramid/5step/step2active.png');
}

.step52
{
	background: url('../images/pyramid/5step/step3.png');
}

.step52hover
{
	background: url('../images/pyramid/5step/step3hover.png');
}

.step52down
{
	background: url('../images/pyramid/5step/step3active.png');
}

.step53
{
	background: url('../images/pyramid/5step/step4.png');
	height: 62px;
}

.step53hover
{
	background: url('../images/pyramid/5step/step4hover.png');
}

.step53down
{
	background: url('../images/pyramid/5step/step4active.png');
}

.step54
{
	background: url('../images/pyramid/5step/step5.png');
	margin-bottom: 30px !important;
	height: 62px;
}

.step54hover
{
	background: url('../images/pyramid/5step/step5hover.png');
}

.step54down
{
	background: url('../images/pyramid/5step/step5active.png');
}

/* //// */

.step60
{
	background: url('../images/pyramid/6step/step1.png');
	height: 68px !important;
	margin-top: 16px !important;
}

.step60hover
{
	background: url('../images/pyramid/6step/step1hover.png');
}

.step60down
{
	background: url('../images/pyramid/6step/step1active.png');
}

.step61
{
	background: url('../images/pyramid/6step/step2.png');
}

.step61hover
{
	background: url('../images/pyramid/6step/step2hover.png');
}

.step61down
{
	background: url('../images/pyramid/6step/step2active.png');
}

.step62
{
	background: url('../images/pyramid/6step/step3.png');
	height: 55px;
}

.step62hover
{
	background: url('../images/pyramid/6step/step3hover.png');
}

.step62down
{
	background: url('../images/pyramid/6step/step3active.png');
}

.step63
{
	background: url('../images/pyramid/6step/step4.png');
}

.step63hover
{
	background: url('../images/pyramid/6step/step4hover.png');
}

.step63down
{
	background: url('../images/pyramid/6step/step4active.png');
}

.step64
{
	background: url('../images/pyramid/6step/step5.png');
	height: 55px;
}

.step64hover
{
	background: url('../images/pyramid/6step/step5hover.png');
}

.step64down
{
	background: url('../images/pyramid/6step/step5active.png');
}

.step65
{
	background: url('../images/pyramid/6step/step6.png');
	margin-bottom: 30px !important;
}

.step65hover
{
	background: url('../images/pyramid/6step/step6hover.png');
}

.step65down
{
	background: url('../images/pyramid/6step/step6active.png');
}


@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	
		
	.step30down
	{
		background: url('../images/pyramid/3step/step1hover.png');
	}
	
	.step31down
	{
		background: url('../images/pyramid/3step/step2hover.png');
	}
	
	.step32down
	{
		background: url('../images/pyramid/3step/step3hover.png');
	}
	
	.step40down
	{
		background: url('../images/pyramid/4step/step1hover.png');
	}
	
	.step41down
	{
		background: url('../images/pyramid/4step/step2hover.png');
	}
	
	.step42down
	{
		background: url('../images/pyramid/4step/step3hover.png');
	}
	
	.step43down
	{
		background: url('../images/pyramid/4step/step4hover.png');
	}
	
	.step50down
	{
		background: url('../images/pyramid/5step/step1hover.png');
	}
	
	.step51down
	{
		background: url('../images/pyramid/5step/step2hover.png');
	}
	.step52down
	{
		background: url('../images/pyramid/5step/step3hover.png');
	}
	
	.step53down
	{
		background: url('../images/pyramid/5step/step4hover.png');
	}
	
	.step54down
	{
		background: url('../images/pyramid/5step/step5hover.png');
	}
	.step60down
	{
		background: url('../images/pyramid/6step/step1hover.png');
	}
	
	.step61down
	{
		background: url('../images/pyramid/6step/step2hover.png');
	}
	
	.step62down
	{
		background: url('../images/pyramid/6step/step3hover.png');
	}
	.step63down
	{
		background: url('../images/pyramid/6step/step4hover.png');
	}
	
	.step64down
	{
		background: url('../images/pyramid/6step/step5hover.png');
	}
	
	.step65down
	{
		background: url('../images/pyramid/6step/step6hover.png');
	}

}

.pyramid img
{
	position: relative;
	display: block;
}

.step31 span, .step32 span
{
	margin: -4px auto;
}

.step41 span, .step42 span, .step43 span
{
	margin: -7px auto;
}

.step51 span, .step52 span, .step53 span, .step54 span
{
	margin: -7px auto;
}

.step61 span, .step62 span, .step63 span, .step64 span, .step65 span
{
	margin: -8px auto;
}

.pyramid span
{
	background: #FFF;
	color: #000;
	position: relative;	
	display: inline-table;
	text-align: center;
	
	padding: 8px;
	z-index: 2;
	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

.pyramid p
{
	background: #FFF;
	width: 35%;
	margin: 0 auto;
	padding: 6px;
}

/*
.pyramid .feedback
{
	background: url('../images/pyramid/pyramidfbpanel.png');
	background-repeat:no-repeat;
	border-bottom: 32px solid #C8C1B8 !important;
	padding: 0;
}

.pyramid .feedback .text
{
	background: #F5EDE1;
	border-bottom: 1px solid #C8C1B8;
	border-top: 1px solid #AA7D57;
	
	height: 100%;
	padding: 16px 14px 14px 14px;
	box-shadow: inset 0 7px 6px -6px #666;
	-moz-box-shadow: inset 0 7px 6px -6px #666;
	-webkit-box-shadow: inset 0 7px 6px -6px #666;
}
*/

.pyramid .feedback
{
	background: #F5EDE1;
	border: 1px solid #C8C1B8;
	border-top: none;
	padding: 0;
	float: left;
	clear: both;
	
	box-shadow: inset 0 7px 6px -6px #666;
	-moz-box-shadow: inset 0 7px 6px -6px #666;
	-webkit-box-shadow: inset 0 7px 6px -6px #666;
	
	/* 	padding-bottom: 32px; */
	/* 	position: relative; */
	/* top: 20px; */
	/* margin-bottom: 20px; */
}

.pyramid .feedback .text
{
	border-top: 1px solid #AA7D57;
	height: 100%;
	padding: 15px 14px 14px 14px;
	float: left;
}

/* -------------------- */
/* REFLECTION */
/* -------------------- */

.reflection
{
	background: url('../images/reflection/reflectionbg.png');
	/* margin: 0; */
	padding: 0;
	
	/* box-shadow: inset 0 29px 0px 0px #FFF;
	-moz-box-shadow: inset 0 29px 0px 0px #FFF;
	-webkit-box-shadow: inset 0 29px 0px 0px #FFF; */
}

.qtab, .htab, .fbtab
{
	background: #DAF5E7; /* Old browsers */
	background: -moz-linear-gradient(top,  #DAF5E7 0%, #DAF5E7 9%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#DAF5E7), color-stop(9%,#DAF5E7)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #DAF5E7 0%,#DAF5E7 9%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #DAF5E7 0%,#DAF5E7 9%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #DAF5E7 0%,#DAF5E7 9%); /* IE10+ */
	background: linear-gradient(to bottom,  #DAF5E7 0%,#DAF5E7 9%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#DAF5E7', endColorstr='#DAF5E7',GradientType=0 );  IE6-9 */

	border: 1px solid #6EBBA3;
	border-top: none;
	
	border-bottom-left-radius: 3px;
	-moz-border-bottom-left-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -khtml-border-bottom-left-radius: 3px;
	
	border-bottom-right-radius: 3px;
	-moz-border-bottom-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -khtml-border-bottom-right-radius: 3px;
}

.qtab
{
	border-left: 1px solid #6EBBA3;
	border-right: none;
}

.qtab a:before
{
	content:'';
	background: url('../images/reflection/qtabicon.png');
	background-size: cover;
	height: 26px;
	width: 26px;
	position: relative;
	margin-left: -4px;
	margin-right: 2px;
	margin-top: -3px;
	margin-bottom: -6px;
	float: left;
}

.fbtab
{
	border-right: 1px solid #6EBBA3;
	float: right !important;
}

.fbtab a:before
{
	content:'';
	background: url('../images/reflection/fbtabicon.png');
	background-size: cover;
	height: 26px;
	width: 26px;
	position: relative;
	margin-left: -2px;
	margin-right: 4px;
	margin-top: -4px;
	margin-bottom: -5px;
	float: left;
}

.htab a:before
{
	content:'';
	background: url('../images/reflection/htabicon.png');
	background-size: cover;
	height: 26px;
	width: 26px;
	position: relative;
	margin-left: -4px;
	margin-right: 2px;
	margin-top: -4px;
	margin-bottom: -5px;
	float: left;
}

/* -------------------- */
/* RELATED CONCEPTS */
/* -------------------- */

.relcon
{
	height: 442px !important;
	background: url('../images/related_concepts/woodbg.png');
	/* margin-bottom: 20px; */
}

.concepts
{
	width: 402px;
	margin: 0 auto 20px auto;
	padding: 20px 0 20px 0;
}

.concept, .conceptnull
{
	position: relative;
	width: 134px;
	height: 134px;
	float: left;
	clear: none;	
	cursor: default;
}

.concept
{
	background: url('../images/related_concepts/circle.png');
	cursor: pointer;
}

.conceptnull
{
	background-color: transparent;
}

.conceptcentral
{
	background: url('../images/related_concepts/central.png');
	position: relative;
	width: 200px;
	height: 200px;
	top: 161px;
	left: 50%;
	margin: -100px 0 0 -100px;
	z-index: 2;
}

.conceptcentralhover
{
	background: url('../images/related_concepts/central_hover.png');
	z-index: 2;
	cursor: pointer;
}

.conceptcentraldown
{
	background: url('../images/related_concepts/central_active.png');
	z-index: 2;
}

.concepthover, .concepthover:active
{
	background-color: #F15A24;
}

.conceptdown
{
	background-color: #A06EC7;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.conceptdown
	{
		background-color: #F15A24;
	}
	
	.conceptcentraldown
	{
		background: url('../images/related_concepts/central_hover.png');
	}
}

.relcon span
{
	color: #000;
	display: block;
	text-align: center;
	position: absolute;
	top: 50%;
	width: 100%;
	z-index: 2;
}

.relcon .feedback
{
	border: 1px solid #C8C1B8;
	border-top: 1px solid #C38E63;
	padding: 0;
	/* padding-bottom: 12px; */
	float: left;
	position: relative;
	top: 20px;
	margin-bottom: 30px;
	
	box-shadow: 0 7px 6px -6px #333;
	-moz-box-shadow: 0 7px 6px -6px #333;
	-webkit-box-shadow: 0 7px 6px -6px #333;
	
}

.relcon .feedback .text
{
	background: #F5EDE1;
	width: 510px;
	height: 100%;
	padding: 15px 14px 14px 14px;
	float: left;
	
	box-shadow: inset 0 7px 6px -6px #999;
	-moz-box-shadow: inset 0 7px 6px -6px #999;
	-webkit-box-shadow: inset 0 7px 6px -6px #999;

	/* border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px; */
}

/* -------------------- */
/* SEESAW */
/* -------------------- */

.seesaw
{
	background: url('../images/seesaw/seesawbg.png') !important;
}

.seesaw .summary
{
	background: url('../images/genericbg.png') !important;
}

.seesaw .item, .seesaw .useditem, .seesaw .summary
{
	border-bottom: 1px solid #6EBBA3;
}

.seesaw .leftitem, .seesaw .dockeditem, .seesaw .summary .leftright .rightitem
{
	border-top: 1px solid #6EBBA3;
	border-bottom: 1px solid #6EBBA3;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
}

.seesaw .item
{
	display: inline-block;
	width: 485px !important;
	margin: 22px 20px -13px 20px;
	padding: 7px;	
}

.seesaw .item:hover
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
	cursor: pointer;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.seesaw .item:hover
	{
		background: #FFFFFF;
		border-bottom: 1px solid #6EBBA3;
	}
}

.seesaw .item:active /*&& TOUCH SCREEN ACTIVE STATE &&*/
{
	background: #FFF1A8;
	border-bottom: 1px solid #DE8658;
	cursor: pointer;
}

.seesaw .useditem
{
	background: #FFF;
	display: inline-block;
	width: 485px !important;
	margin: 20px;
	margin-top: 22px;
	margin-bottom: -13px;
	padding: 7px;
}

.seesaw .leftitem
{
 	background: #DAF5E7;
	display: inline-block;
	width: 236px;
	height: 64px;
	margin: 12px 0px 0px 12px;
	padding: 7px;
	z-index: 7;
}
/*
.seesaw .leftitem:before
{
	content:'';
	display: block;
	position: relative;
	float: right;
	top: 15px;
	left: 41px;
	width: 0;
	height: 0;
	border-color: transparent transparent transparent #DAF5E7; /*FFFFFF*//*F15A24*/
	/* border-width: 9px;
	border-style: solid;
	z-index: 4;
}
*/
.seesaw .leftitem:before
{
	content:'';
	background: url('../images/seesaw/seesawicon.png') no-repeat;
	background-size: cover;
	height: 28px;
	width: 28px;
	padding: 0px;
	position: relative;
	left: 27px;
	top: 21px;
	float: right;
	z-index: 8;
}

.seesaw .rightitem, .seesaw .dockeditem
{
	display: inline-block;
	height: 64px;
	float: right;
	margin: 12px 12px 0 0;
	padding: 7px;
}

.seesaw .rightitem
{
 	background-color: transparent;
	border: 2px dashed #FFF;
	width: 236px;
	height: 62px;
	
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-khtml-border-radius: 4px;
}

.seesaw .dockeditem
{
 	background: #FFF;
	width: 240px !important;
	height: 64px;
}

.seesaw .summary
{
	width: 100%;
	height: 100%;
	overflow-y: auto;
}

.seesaw .summary .leftright .leftitem, .seesaw .summary .leftright .rightitem
{
	width: 229px;
	margin-top: -5px !important;
}

.seesaw .summary .leftright .rightitem
{
	background: #FFF;
	border-left: none;
	border-right: none;
}

.seesaw .summary .rightitem
{
	height: 64px;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
.seesaw .summary .rightitem:before
	{
		content:'';
		background: url('../images/seesaw/seesawicon2.png') no-repeat;
		background-size: cover;
		height: 28px;
		width: 45px;
		padding: 0px;
		position: relative;
		left: -229px;
		top: 21px;
		float: right;
		z-index: 8;
	}
}

.ui-effects-transfer 
{
	border: 2px dashed #FFF; 
	z-index: 2;
	
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
}

/* -------------------- */
/* SLIDER */
/* -------------------- */

.slider
{
	background: url('../images/slider/sliderbackground.png');
}

.slider p
{
	margin: 0;
	padding: 8px 6px 0 6px;
}

.section
{
	background: #FFF;
 	border-bottom: 1px solid #6EBBA3;
	border-left: 1px solid #6EBBA3;
	text-align: center;
	position: relative;
	left: 16px;
	height: 50px;
	float: left;
	margin-top: 16px;
	cursor: pointer;
	
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
}

.section:hover
{
	background: #FFF1A8;
}

.section:after
{ 	
	content:'';
	display: block;
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -6px;
	width: 0;
	height: 0;
	border-color: #FFF transparent transparent transparent;
	border-width: 7px;
	border-style: solid;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.section:after
	{ 	
		margin-top: -1px;
	}
}

.section:before
{
	content:'';
	display: block;
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -6px;
	width: 0;
	height: 0;
	border-color: #99CDE1 transparent transparent transparent; /*#588999 */
	border-width: 7px;
	border-style: solid;
}

.section:hover:after
{
	content:'';
	display: block;
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -6px;
	width: 0;
	height: 0;
	border-color: #FFF1A8 transparent transparent transparent;
	border-width: 7px;
	border-style: solid;
}

/*
.slider .feedback
{
	width: 514px;
	float: right;
	margin: 9px 0 9px 0;
}
*/

.slider .feedback
{
	border: 1px solid #C8C1B8;
	border-top: none;
	position: relative;
	top: 8px;
	padding: 0;
	/* padding-bottom: 32px; */
	float: left;
	margin-bottom: 30px;
	
	box-shadow: 0 7px 6px -6px #333;
	-moz-box-shadow: 0 7px 6px -6px #333;
	-webkit-box-shadow: 0 7px 6px -6px #333;
	
}

.slider .feedback .text
{
	background: #F5EDE1;
	width: 510px;
	height: 100%;
	padding: 15px 14px 14px 14px;
	float: left;
	
	box-shadow: inset 0 7px 6px -6px #666;
	-moz-box-shadow: inset 0 7px 6px -6px #666;
	-webkit-box-shadow: inset 0 7px 6px -6px #666;	
}

/* -------------------- */
/* TABBING */
/* -------------------- */

.tabbing
{
	border-top: 1px solid #6EBBA3;
}

.tabbing ul
{
	margin: 0;
	padding: 0;
}

.tabbing .tabs
{
	display: inline;
	float: left;
}

.tabbing .tabs li
{
	position: relative;
	display: block;
	width: 60px;
	height: 50px !important;
 	margin: 0;
	padding: 0;
	float: left;
	cursor: pointer;
}

/* -------------------- */
/* TEXT ENTRY */
/* -------------------- */

.textentry textarea
{
	border: 1px solid #6EBBA3;
	font-size: 13px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	max-width: 540px;
	width: 526px;
	max-height: 200px;
	margin: 0;
	padding: 6px;
	resize: none;
	
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	-khtml-border-radius: 0px;
}

.textentry .question
{
	background: #DAF5E7;
	border-right: 1px solid #6EBBA3;
	border-left: 1px solid #6EBBA3;
	padding: 10px;
}

.textentry .quesnum
{
	color: #278251;
	font-family: 'CreteRoundItalic', Trebuchet MS, Trebuchet MS, sans-serif;
	font-size: 19px;
	text-transform: capitalise;
	margin: 0 0 0px 0px;
		
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
}

.textentry .summ
{
	background: #FFF;
	border: 1px solid #6EBBA3;
	color: #000;
	padding: 6px;
	overflow-y: auto;
}

.application textarea
{
	border: 1px solid #6EBBA3;
	font-size: 13px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	max-width: 540px;
	width: 527px;
	max-height: 100px;
	min-height: 100px;
	margin: 0;
	padding: 6px;
	resize: none;
	overflow-y: auto;
	
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	-khtml-border-radius: 0px;
}

.application
{
	overflow-y: hidden;
	width: 541px !important;
	
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
}

.application .feedback
{
	padding-bottom: 10px;
	overflow: auto;
	max-height: 322px;
}

.application .item
{
	margin-top: 0;
}

.application .itemwrap
{
	margin-top: 10px;
}

.application .speechBubble
{	
	margin-bottom: 2px !important;
    margin-top: 8px !important;
}

.application .speechBubble:before 
{
	margin-left: 272px;
}

.application .viewfb
{
	box-shadow: 0px 1px 1px 2px #013829;
	-moz-box-shadow: 0px 1px 1px 2px #013829;
	-webkit-box-shadow: 0px 1px 1px 2px #013829;
}

/*.application img
{
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-khtml-border-radius: 6px;
}*/

.ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; }
.ui-helper-clearfix:after { clear: both; }

/* General Tab Styling
----------------------------------*/
.ui-tabs { position: relative; } /* 'position: relative' prevents IE scroll bug (element with 'position: relative' inside container with 'overflow: auto' appear as "fixed") */
.ui-tabs .ui-tabs-nav { margin: 0; }
.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a
{
	background: #FFF; cursor: default;
	border-bottom-left-radius: 3px;
	-moz-border-bottom-left-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -khtml-border-bottom-left-radius: 3px;
	
	border-bottom-right-radius: 3px;
	-moz-border-bottom-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -khtml-border-bottom-right-radius: 3px;
}
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */

/* ************************************* */
/* ########### Reflection UI ########### */
/* ************************************* */

.reflection .ui-tabs-nav
{
	margin: 0px 84px 0px 84px;
	padding: 0; 
	margin-bottom: 20px;
	position: relative;
	top: 0px;
}

.reflection .ui-tabs-nav li a 
{
	float: left;
	padding: 12px; 
	padding-right: 14px;
	text-decoration: none;
	font-family: 'UbuntuRegular', Lucida Sans Unicode, Lucida Grande, sans-serif;
	/*font-weight: 500;*/
	font-size: 16px;
	color: #005445 !important;
}

.reflection .ui-tabs-hide
{
	display: none !important; 
}

.reflection .tabcontent
{
	/* position: relative; */
	/* top: 28px; */
	padding: 40px 20px 10px 20px; /* padding around text */
}

.reflection li.ui-tabs-selected
{ 	
	background: #FFF;
	position: relative;
	top: -1px;
	border-top: 0;
	padding-top: 1px;
}

.reflection .ui-state-hover 
{
	background: #FFF1A8; /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(204,192,134,1) 0%, rgba(255,241,168,1) 9%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(204,192,134,1)), color-stop(9%,rgba(255,241,168,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(204,192,134,1) 0%,rgba(255,241,168,1) 9%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(204,192,134,1) 0%,rgba(255,241,168,1) 9%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(204,192,134,1) 0%,rgba(255,241,168,1) 9%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(204,192,134,1) 0%,rgba(255,241,168,1) 9%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCC086', endColorstr='#FFF1A8',GradientType=0 ); /* IE6-9 */
}

.reflection .ui-tabs-panel 
{ 
	background: #FFF; 
	border: 1px solid #6EBBA3; 
	
	border-top: 0;
	color: #000;
	display: block;
	max-width: 100%;
}

.reflection .tabcontent li
{
	background: url('../images/page_graphics/bulletpointorange.png');
	background-position: 0px 3px; 
	background-repeat: no-repeat;
	margin-bottom: 12px;
	padding-left: 14px;
	
	list-style-type: none;
}

/* ************************************** */
/* ############# Tabbing UI ############# */
/* ************************************** */

.ui-tabs-vertical { width: 100%; }
.ui-tabs-vertical .ui-tabs-nav { width: 154px; /* 12em; */ float: left; } /* tab width */
.ui-tabs-vertical .ui-tabs-nav li 
{ 
	border-right: none; 
	border-bottom: 1px solid #6EBBA3; 
	border-left: 1px solid #6EBBA3; 
	max-width: 100%; width: 100%; /* width: 162px; */ 
	clear: left; 
	
	background: #DAF5E7; /* Old browsers */
	background: -moz-linear-gradient(top,  #DAF5E7 0%, #DAF5E7 9%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#DAF5E7), color-stop(9%,#DAF5E7)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #DAF5E7 0%,#DAF5E7 9%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #DAF5E7 0%,#DAF5E7 9%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #DAF5E7 0%,#DAF5E7 9%); /* IE10+ */
	background: linear-gradient(to bottom,  #DAF5E7 0%,#DAF5E7 9%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#DAF5E7', endColorstr='#DAF5E7',GradientType=0 );  IE6-9 */
	
	/* box-shadow: inset -6px 0px 7px -6px #6EBBA3; 
	-moz-box-shadow: inset -6px 0px 7px -6px #6EBBA3; 
	-webkit-box-shadow: inset -6px 0px 7px -6px #6EBBA3; */
}

.ui-tabs-vertical .ui-tabs-nav li a { display: block; cursor: pointer;}
.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-selected { background: #FFF; border-right: 1px solid #FFF; /*width: 353px;*/ box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; }
.ui-tabs-vertical .ui-tabs-panel { border: 1px solid #6EBBA3; border-top: 0; border-left: 0; /*max-width: 67.5%; width: 66%;*/ /*width: 355px !important;*/ float: right; } /* tabbing feedback panel */

.tabbing .ui-tabs-hide
{
	display: none !important; 
}

.tabbing .ui-tabs-nav li a
{
	width: 84.5%;
	/*width: 85%\9; IE*/
	height: 100%;
	float: left;
	padding: 12px;
	text-decoration: none;
}

.ui-tabs-vertical .ui-tabs-nav li a:hover
{
	z-index: 2 !important;
	
	background: #FFF1A8; /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(204,192,134,1) 0%, rgba(255,241,168,1) 9%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(204,192,134,1)), color-stop(9%,rgba(255,241,168,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(204,192,134,1) 0%,rgba(255,241,168,1) 9%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(204,192,134,1) 0%,rgba(255,241,168,1) 9%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(204,192,134,1) 0%,rgba(255,241,168,1) 9%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(204,192,134,1) 0%,rgba(255,241,168,1) 9%); /* W3C */
	/* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCC086', endColorstr='#FFF1A8',GradientType=0 ); */ /* IE6-9 */
	
	/* box-shadow: inset -6px 0px 7px -6px #BAAB6C;
	-moz-box-shadow: inset -6px 0px 7px -6px #BAAB6C;
	-webkit-box-shadow: inset -6px 0px 7px -6px #BAAB6C; */
}

.tabbing li.ui-tabs-selected a:hover 
{ 
	background: #FFF;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

.tabbing .ui-tabs-panel 
{ 
	background: #FFF;
	border: 1px solid #6EBBA3;
	border-top: 0;
	color: #000;
	display: block; 
	max-width: 100%;
	width: 355px;
	width: 355px\9; /*IE*/
	margin: 0;
	/* padding: 12px 12px 12px 16px; */
	padding: 12px;
	padding-left: 16px;
}

.tabbing .ui-tabs-panel ul li
{
	background: url('../images/page_graphics/bulletpointorange.png');
	background-position: 0px 3px; 
	background-repeat: no-repeat;
	margin-bottom: 12px;
	padding-left: 14px;
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
{
	.tabbing .ui-tabs-panel
	{
		position: relative;
		width: 356px;
		border-left: none;
	}
	
	.ui-tabs-vertical .ui-tabs-nav li.ui-tabs-selected 
	{ 
		border-right: 2px solid #FFF;
	}
}

/* *************************************** */
/* ############## Slider UI ############## */
/* *************************************** */

.ui-slider
{
	border-top: 0px solid #000;
	position: relative; 
	height: 60px; 
	text-align: center; 
	margin: 20px auto 10px auto;
}

.ui-slider-handle 
{
	background: url('../images/slider/sliderhandle.png'); 
	background-size: cover;
	position: absolute; 
	width: 32px; 
	height: 37px; 
	z-index: 2; 
	cursor: pointer;
	
	box-shadow: 0 4px 2px -1px #B3B3B3;
	-moz-box-shadow: 0 4px 2px -1px #B3B3B3;
	-webkit-box-shadow: 0 4px 2px -1px #B3B3B3;
}

.ui-slider-horizontal .ui-slider-handle
{
	top: 9px; 
	margin-left: -15px; 
	cursor: pointer;
}

.slider .ui-state-hover, .slider .ui-state-active
{
	background: url('../images/slider/sliderhandle_hover.png'); 
	background-size: cover;
	color: #000;
	font-weight: bold; 
}

/* ************************************** */
/* ############ Progress Bar ############ */
/* ************************************** */

.slicebar 
{
	border-top: 1px solid #FFF;
	overflow: visible;
	
	border-bottom-right-radius: 3px;
	-moz-border-bottom-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	-khtml-border-bottom-right-radius: 3px;
	
	filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#036648", endColorStr="#005445"); /* IE9 */
	background-image: -ms-linear-gradient(top, #036648 0%, #005445 100%); /* IE10 Consumer Preview */ 
	background-image: linear-gradient(to bottom, #036648 0%, #005445 100%); /* W3C Markup, IE10 Release Preview */
	background-image: -moz-linear-gradient(top, #036648 0%, #005445 100%); /* Mozilla Firefox */ 
	background-image: -o-linear-gradient(top, #036648 0%, #005445 100%); /* Opera */ 
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #036648), color-stop(1, #005445)); /* Webkit (Safari/Chrome 10) */
	background-image: -webkit-linear-gradient(top, #036648 0%, #005445 100%); /* Webkit (Chrome 11+) */ 
}

.slicebar .bar 
{
	position: relative;
    width: 541px;
    height: 8px;		       
}

.slicebar .bar span 
{
    display: inline-block;
    height: 100%;
}

.slicebar .bar .slice
{
	border-right: 1px solid #FFF;
	box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;
	-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset;
}

.slicebar .bar .slice:first-of-type
{
	border-bottom-left-radius: 3px;
	-moz-border-bottom-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-khtml-border-bottom-left-radius: 3px;
}

.slicebar .bar .slice:last-of-type
{
	border-bottom-right-radius: 3px;
	-moz-border-bottom-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	-khtml-border-bottom-right-radius: 3px;
}

.slicebar .bar .slice:last-of-type:after 
{ 
	content:''; 
	display: block; 
	background: url(../images/page_graphics/activitycomplete.png) no-repeat; 
	background-size: cover;
	height: 20px; 
	width: 40px; 
	position: relative;
	top: 9px;
	left: 100%;
	margin-top: -20px; 
	margin-left: -40px; 
	z-index: 10;  
	overflow: visible;
}

/* -------------------- */
/* BORDER RADIUS */
/* -------------------- */

.checklist, .checklisttac, .checklisttacquiz, .classificationaaa, .classificationcar, .ctvm, .flashcards, .feedbackpanel, .vidtrans, .audtrans, .laddersteps, .matching, .mcq, .mcq_le, .notemaking, .opinions, .paraseq, .paraseqaaa, .process, .process1, .reflection, .seesaw, .textentry, .flashcards .card, .startimage
{
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

.mcq .feedback
{
	border-radius: 0px;
	-moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    -khtml-border-radius: 0px;
}

.nav, .labelledgraphic, .labelledgraphic img, .notemaking .question, .pyramid, .relcon, .slider, .textentry .question, .btn, .nav .restart, .steptop-border-radius
{
	border-top-left-radius: 3px;
	-moz-border-top-left-radius: 3px;
	-webkit-border-top-left-radius: 3px;
	-khtml-border-top-left-radius: 3px;
}

.nav, .labelledgraphic, .labelledgraphic img, .notemaking .question, .pyramid, .relcon, .slider, .textentry .question, .laddersteps .stepfb, .tabbing, .tabbing .ui-tabs-panel, .nav .next, .nav .summary, .nav .print, .nav .checkanswers
{
	border-top-right-radius: 3px;
	-moz-border-top-right-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-khtml-border-top-right-radius: 3px;
}

.tabbing, .step1-border-radius, .slicebar, .feedback, .labelledgraphic-border-radius, .pyramid-border-radius, .relcon-border-radius, .seesaw .summary, .slider-border-radius /*(laddersteps)*/
{
	border-bottom-left-radius: 3px;
	-moz-border-bottom-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-khtml-border-bottom-left-radius: 3px;	
}

.laddersteps .stepfb, .tabbing, .tabbing .ui-tabs-panel, .slicebar, .feedback, .labelledgraphic-border-radius, .pyramid-border-radius, .relcon-border-radius, .seesaw .summary, .slider-border-radius
{
	border-bottom-right-radius: 3px;
	-moz-border-bottom-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	-khtml-border-bottom-right-radius: 3px;
}

.pyramid .feedback
{
	border-bottom-left-radius: 3px;
	-moz-border-bottom-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-khtml-border-bottom-left-radius: 3px;
	
	border-bottom-right-radius: 3px;
	-moz-border-bottom-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	-khtml-border-bottom-right-radius: 3px;
}



/* ///////////////////////////////////////////////////////////////////////////// */
                           /*MEDIA QUERIES*/
/* ///////////////////////////////////////////////////////////////////////////// */


@media screen
{
	/*.printheader, */.printwindow, .printwindow br, .printwindow h4, .printwindow p, .printwindow em, .printwindow #selectable, .printdetails, .printbanner, .printfooter, .printfooter img
	{
		display: none;
	}
}


.summaryhead
{
	color: #278251;
	font-family: 'CreteRoundItalic', Trebuchet MS, Trebuchet MS, sans-serif;
	font-size: 1.5em;
	margin: 0px;
	margin-top: -6px;
	margin-bottom: 0px;
		
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
}

.summaryques
{
	/* font-size: 0.8em; */
	font-family: Helvetica, Arial, sans-serif;
	background: #DAF5E7 !important;
	border: 1px solid #6EBBA3;
	/* border-bottom: 2px solid #91D5E6; */
	/* margin-top: 20px; */
	margin-bottom: 8px;
	padding: 8px;
	clear: both; 
	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

.summarylisthead
{
	background: #DAF5E7 !important;
	border: 1px solid #6EBBA3;
	/*border-bottom: 2px solid #91D5E6;*/
	margin-top: 30px;
	margin-bottom: 8px;
	padding: 8px;
	padding-bottom: 3px;
	clear: both; 
	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

.summarydescription
{
	font-size: 10pt;
	font-family: Helvetica, Arial, sans-serif;
	text-align: right;
	margin: 0px;
	margin-bottom: -25px;
	/* padding: 8px; */
	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

/*.summaryques:before
{
	content:'';
	background: #CCC !important;
	height: 1px;
	width: 100%;
	position: relative;
	margin-top: -27px;
	margin-left: -12px;
	float: left;
}*/

.summaryinput
{
	background: #FFFFFF;
	border: 1px solid #999999;
	/* border-bottom: 2px solid #BBBBBB; */
	/* font-size: 0.8em; */
	font-family: Helvetica, Arial, sans-serif;
	margin-bottom: 8px;
	padding: 8px;
	clear: both; 
	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

.summaryfb
{
	background: #F5EDE1 !important;
	border: 1px solid #999999;
	/*border-top: 2px solid #C8C1B8;*/
	/*font-size: 0.8em;*/
	font-family: Helvetica, Arial, sans-serif;
	margin-bottom: 30px;
	padding: 8px;
	clear: both; 
	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}

.summaryplain
{
	background: #FFF !important;
	border: 1px solid #999999;
	/*border-top: 2px solid #C8C1B8;*/
	/*font-size: 0.8em;*/
	font-family: Helvetica, Arial, sans-serif;
	margin-bottom: 30px;
	padding: 8px;
	clear: both; 
	
	border-radius: 3px;
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
}
	
.printfooter img
	{
		position: absolute;
		bottom: 0px;
	}


/* ///////////////////////////////////////////////////////////////////////////// */
                           /* VIDEO & AUDIO */
/* ///////////////////////////////////////////////////////////////////////////// */

.multiwrapaud, .multiwrapvid
{
	background: #4D4D4D;
	width: 540px;
	float: left;
	/* margin-bottom: 10px; */
	clear: both;
	
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
}
   
#vid0 iframe, #vid1 iframe, #vid2 iframe, #vid3 iframe, #vid4 iframe, #vid5 iframe, #vid6 iframe, #vid7 iframe, #vid8 iframe
{
	background: #000;
	width: 540px;
	height: 304px;
	float: left;
	
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
	
	box-shadow: 0 7px 6px -6px #333;
	-moz-box-shadow: 0 7px 6px -6px #333;
	-webkit-box-shadow: 0 7px 6px -6px #333;
}
   
.multilistaud, .multilistvid
{
	background: #F5EDE1;
	border: 1px solid #C8C1B8;
	border-top: none;
	width: 538px;
	height: 123px;
	float: right;
	overflow-y: auto;
	clear: both;
	
	border-bottom-left-radius: 3px;
	-moz-border-bottom-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-khtml-border-bottom-left-radius: 3px;
	
	border-bottom-right-radius: 3px;
	-moz-border-bottom-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-khtml-border-bottom-left-radius: 3px;
	
	box-shadow: 0 7px 6px -6px #333;
	-moz-box-shadow: 0 7px 6px -6px #333;
	-webkit-box-shadow: 0 7px 6px -6px #333;
}
   
.listitem
{
	background: #FFF;
	border-bottom: 1px solid #C8C1B8;
	height: 45px;
	margin: 0px;
	padding: 8px;
	cursor: pointer;
}
   
.listitem:last-of-type
{
	border-bottom: none;
}

.listitem:hover
{
	background: #FFF1A8;
}
   
.playing, .playing:hover
{
	background: #EEE; /*E0CCFF*/
}
   
.listimg
{
	width: 80px;
	float: left;
}
   
.listtext
{
	margin-left: 5px;
	float: left;
}

audio, video
{
	background: #FFF;
	width: 540px !important;
	float: left;
	cursor: pointer;
	
	box-shadow: 0 7px 6px -6px #333;
	-moz-box-shadow: 0 7px 6px -6px #333;
	-webkit-box-shadow: 0 7px 6px -6px #333;
}

.viewtrans
{
	margin-top: 14px;
	margin-left: 195px;
}

.vidtrans, .audtrans /* same as regular feedback but with margin top */
{
	background: #F8FAFB; /*F5EDE1*/
	border: 1px solid #CCC; /*C8C1B8*/
	width: 522px !important;
	min-height: 28px;
	margin-top: 8px; 
	padding: 8px;
	padding-top: 0px;
	clear: both;
	
	/* padding-bottom: 32px; */
	/* float: left; */
	/* margin-bottom: 20px; */
}

#podsummary
{
	background: #FFF;
	width: 180px;
	height: 260px;
	float: left;
	
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	-khtml-border-radius: 0px;
	
	box-shadow: 0px 0px 0px 0px #FFF;
	-moz-box-shadow: 0px 0px 0px 0px #FFF;
	-webkit-box-shadow: 0px 0px 0px 0px #FFF;
}


/*  COURSE QUIZ BUTTON STYLE CORRECTION  */
div.quiz {
	max-width: 145px;
	text-align: center;
}

a.nextpage_button,
a.submit_button {
	text-decoration: none;
}
/*  COURSE QUIZ BUTTON STYLE CORRECTION  */