/*!
 *
 *	beyondblue Workplace mental health awareness resource
 *
 *	@author        Patrick Toohey
 *	@copyright     (c) Millipede Creative Development Pty Ltd, http://millipede.com.au
 *	@version       0.1, March 2012
 *
 *	includes elements of HTML5 boilerplate (http://html5boilerplate.com) & MediaElement (https://github.com/johndyer/mediaelement)
 *
 */



h1, h2, h3, h4, h5, h6, p {
	margin: 0px;
	font-weight: normal;
}


/* ! ------------------------------------------------------------------ */
/* ! HTML5 display definitions */


article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

section { display: block}


/* ! ------------------------------------------------------------------ */
/* ! Typography */


/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */
html { font-size: 16px; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.4; }


/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate
 * Also: hot pink! (or customize the background color to match your design)
 */
::-moz-selection { background: #8097BA; color: #fff; text-shadow: none; }
::selection { background: #8097BA; color: #fff; text-shadow: none; }


/* Links */
a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:hover, a:active { outline: 0; } /* h5bp.com/h */

*:focus {
	outline: 0; /* replace with custom focus outline for superior WCAG2 AA support */
}

/* Misc. */
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; } /* Redeclare monospace font family: h5bp.com/j */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } /* Improve readability of pre-formatted text in all browsers */
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }



/* ! ------------------------------------------------------------------ */
/* ! Lists */


ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }



/* ! ------------------------------------------------------------------ */
/* ! Embedded content */


/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
 */
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/*
 * Correct overflow not hidden in IE9
 */
svg:not(:root) { overflow: hidden; }



/* ! ------------------------------------------------------------------ */
/* ! Figures */


figure { margin: 0; }



/* ! ------------------------------------------------------------------ */
/* ! Forms */


form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/*
 * 1. Correct color not inheriting in IE6/7/8/9
 * 2. Correct alignment displayed oddly in IE6/7
 */
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 */
button, input { line-height: normal; }

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
 */
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }

/*
 * Re-set default cursor for disabled elements
 */
button[disabled], input[disabled] { cursor: default; }

/*
 * Consistent box sizing and appearance
 */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/*
 * Remove inner padding and border in FF3/4: h5bp.com/l
 */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/*
 * 1. Remove default vertical scrollbar in IE6/7/8/9
 * 2. Allow only vertical resizing
 */
textarea { overflow: auto; vertical-align: top; resize: vertical; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }



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


table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }





/* !  */
/* !  */
/* ! ========  START SITE  ============================================== */
/* !  */
/* !  */


/* ! ------------------------------------------------------------------ */
/* ! Layering */

body {
	position: relative;
}
#header {
	z-index: 100;
	position: relative;
	overflow: visible;
}
#main,
#menu {
	z-index: 50;
	position: relative;

}
#menu {
	z-index: 51;
	position: absolute;
	overflow: hidden;
	height: 587px;
	width: 890px;
	display: none;
}
#scrollbar {
	z-index: 150;
	position: relative;
}


/* ! ------------------------------------------------------------------ */
/* ! Font families */

.adelle {
	font-family: "adelle", "Candara", Arial, sans-serif;
	font-weight: 700
}
.adelle-extra-bold {
	font-family: "adelle", "Candara", Arial, sans-serif;
	font-weight: 800
}
.meta-condensed {
	font-family: "ff-meta-web-pro-condensed", "Arial Narrow", Arial, sans-serif;
}
html {
	font-family: "Arial Narrow", Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}


/* ! ------------------------------------------------------------------ */
/* ! Thematic styles  - text shadows, dark, blue, type styles, etc */

.shadow {
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
}
.full-shadow {
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 1);
}
.dark-shadow {
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
}
.dark-heading {

	/* hide the text */
	color: transparent;

	/* mask the background with the text - text value is only supported by webkit */
	-webkit-background-clip: text;

	/* becomes the inner shadow */
	background-color: #333;

	/* becomes the text colour. blur creates the inner shadow effect. */
	text-shadow: 0 5px 6px rgba(255, 255, 255, 0.2);

}
.dark-body,
.dark-note {
	color: #333;
	line-height: 1.25;
}
.dark-body {
	font-size: 160%;
	text-shadow: 0px 1px 2px rgba(255, 255, 255, 0.3);
}
.dark-note  {
	font-size: 140%;
}

.beyondblue {
	font-style:italic;
}

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

#header {
	font-size: 140%;
	height: 65px;
	max-height: 65px;
	width: 890px;
	background: url('../img/logo/logo.png') no-repeat 0px 5px;
}
#header h1 {
	height: 50px;
	position: relative;
	float: left;
	margin-left: 95px;
	margin-top: 8px;
	width: 355px;
	background: url(../img/header/titles.png) no-repeat 0px 0px;
}
#header h1.help {
	background-position: 0px -350px;
}
#header h1.conclusion {
	background-position: 0px -400px;
}
#header ul {
	position: relative;
	width: 440px;
}
#header ul li {
	display: block;
	float: left;
}
#header nav {
	float: right;
	text-transform: lowercase;
	height: 75px;
	margin-top: -10px;
}
#header nav a {
	text-decoration: none;
	text-align: center;
	width: 100%;
	bottom: 0px;
	height: 75px;
	line-height: 97px;
	display: block;
	float: left;
	position: relative;
	-webkit-transition: line-height .2s ease-out;
	-moz-transition: line-height .2s ease-out;
	-ms-transition: line-height .2s ease-out;
	-o-transition: line-height .2s ease-out;
	background: -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	border-left: #5db2d9 solid 2px;
	color: #FFF;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
	cursor: pointer
}
.lt-ie9 #header nav a {
	background: url(../img/header/header-btn-tile.png) repeat-x 0px 0px
}
.lt-ie9 #home-link.hover a,
.lt-ie9 #help-link.hover a,
.lt-ie9 #conclusion-link.hover a {
	background-position: 0px -75px
}

#header nav li {
	border-left: #276784 solid 2px;
	border-right: #276784 solid 2px;
	height: 75px;
}

#header nav li:first-child {
	border-right-width: 0px;
}

#home-link.hover a,
#help-link.hover a,
#conclusion-link.hover a {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a;
	line-height: 70px;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
	border-color: #47839b
}

#home-link.inactive a,
#help-link.inactive a,
#conclusion-link.inactive a {
	box-shadow: inset 0 0 12px #333;
	background: #B1B1B1;
	color: #444;
	border-color: #A2A2A2;
	text-shadow: none;
	cursor: text
}

#home-link.inactive,
#help-link.inactive,
#conclusion-link.inactive {
	border-color: #444
}

.lt-ie9 #home-link.inactive a,
.lt-ie9 #help-link.inactive a,
.lt-ie9 #conclusion-link.inactive a {
	background-position: 0px -150px
}

#home-link,
#help-link,
#conclusion-link {
	width: 150px;
	height: 65px;
	cursor: pointer;
	position: absolute; /* prevent tabbing focusrect slipping down the first time you tab to the conclusion link */
	top: 0px;
	right: 0px;
}

#home-link {
    right: 156px;
    width: 120px;
}

#conclusion-link {
	width: 160px;
	right: 0px;
	padding-right: 2px;
}


/* ! ------------------------------------------------------------------ */
/* ! Basic structure / sections */

html {
	background: #E1E1E0;
}
body {
	width: 970px;
	margin: 10px auto;
	padding: 0 0 0 28px;
}
#main {
	margin-top: 65px
}
#main,
#menu {
	box-shadow: 0 -2px 2px rgba(0,0,0,0.32), 0 2px 0 rgba(255,255,255,0.32);
	width: 890px;
	height: 588px;
	overflow: hidden;
	float: left;
}
#menu {
	box-shadow: none;
}
#menu.closed {
	height: 46px
}
#modal-view,
#modal-view-prompt {
	z-index: 250;
}
#modal-view,
#modal-view-prompt  {
	background: rgba(0, 0, 0, 0.5);
	width: 850px;
	height: 550px;
	max-width: 850px;
	max-height: 550px;
	overflow: hidden;
	position: absolute;
	top: 65px;
	left: 28px;
	z-index: 2000;
	padding: 20px
}
.lt-ie9 #modal-view {
	background: url(../img/misc/black-50.png)
}
.lt-ie9 #modal-view-prompt  {
	background: url(../img/misc/white-50.png)
}
/* conclusion prompt */
#modal-view-prompt {
	background: rgba(255, 255, 255, 0.75);
	font-size: 150%
}
#prompt {
	width: 600px;
	border-radius: 5px;
	box-shadow: 0px -6px 0px #000, 0px 6px 0px #000, 0px 0px 0px 6px #76DEF8;
	background: #000;
	margin: 100px auto 0px;
	position: relative;
	color: #FFF
}
#prompt div {
	padding: 40px 40px 20px;
	background: #333;
	border-radius: 5px;
	margin: 5px 0px;
}
#prompt p {
	margin: 20px 0px
}

/* work around Safari bug where content disappears if translate is not set on child elements and translate is applied to parent */
/* Chrome gets this right */
section .screen {
    -webkit-transform: translate3d(0,0,0);
}
.no-boxshadow #main {
	border-bottom: 2px #FFF solid;
}
.pointerevents #main:after {
	content: '';
	display: block;
	box-shadow: inset 0 5px 8px rgba(0,0,0,0.8);
	z-index: 100;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 890px;
	height: 588px;
	pointer-events: none;
}
.pointerevents #overlay-top,
.pointerevents #overlay-left,
.pointerevents #overlay-right {
	display: none
}
#overlay-top,
#overlay-left,
#overlay-right {
	position: absolute;
	top: 65px;
	left: 36px;
	width: 874px;
	height: 13px;
	z-index: 75;
	background: url(../img/backgrounds/overlay-top.png) no-repeat;
}
#overlay-left {
	left: 28px;
	width: 8px;
	height: 588px;
	background: url(../img/backgrounds/overlay-left.png) no-repeat
}
#overlay-right {
	left: 910px;
	width: 8px;
	height: 588px;
	background: url(../img/backgrounds/overlay-right.png) no-repeat
}
section {
	position: absolute;
}
section h1,
#main .title {
	box-shadow: 0 2px 0px #000000, 0 7px 5px rgba(0,0,0,0.45);
	color: #FFF;
	font-style: italic;
	font-weight: bold;
	display: block;
	background: #333 url('../img/home/titles2.png') no-repeat;
	height: 55px;
	max-height: 55px;
	position: absolute;
	width: 100%;
	z-index: 100;
}
section h1 {
	display: none;
	z-index: 99;
}
#main .title.m-0 {
	/* background-position: 100px -40px; */
	background-position: -1750px 17px;
}
#main .title.m-1 {
	background-position: -1750px -84px;
}
#main .title.m-2 {
	background-position: -1750px -184px;
}
#main .title.m-3 {
	background-position: -1750px -284px;
}

.screen {
	height: 588px;
	z-index: 0;
	position:relative
}
/* .lt-ie9 .screen {
	height: 590px;
	max-height: 590px;
} */
.lt-ie9 #main .title span {
	height: 9px;
	display: block;
	width: 890px;
	position: absolute;
	z-index: 101;
	top: 43px;
	background: transparent url(../img/backgrounds/title-drop-shadow.png) no-repeat;
}

#incompatible-browser-warning {
	display: none
}
.lt-ie8 #incompatible-browser-warning {
	display: block;
}
.lt-ie8 #main {
	display: none;
}




/* ! ------------------------------------------------------------------ */
/* ! Common Screen Elements */


/* ! ------------------------------------------------------------------ */
/* ! Main, all myth screens */

#myth-0, #myth-1, #myth-2, #myth-3, #myth-4, #myth-5, #conclusion, #intro {
	font-size: 150%;
}

/* smaller font size for tablet & mobile devices */
.touch #myth-0, .touch #myth-1, .touch #myth-2, .touch #myth-3, .touch #myth-4, .touch #myth-5, .touch #conclusion, .touch #intro {
	font-size: 130%;
}

#main {

	background: rgb(221,221,221); /* Old browsers */

	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNkZGRkZGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjOTE5MTkxIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-radial-gradient(center, ellipse cover,  rgba(221,221,221,1) 0%, rgba(175,175,175,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(221,221,221,1)), color-stop(100%,rgba(175,175,175,1))); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover,  rgba(221,221,221,1) 0%,rgba(175,175,175,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover,  rgba(221,221,221,1) 0%,rgba(175,175,175,1) 100%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover,  rgba(221,221,221,1) 0%,rgba(175,175,175,1) 100%); /* IE10+ */
	background: radial-gradient(center, ellipse cover,  rgba(221,221,221,1) 0%,rgba(175,175,175,1) 100%); /* W3C */

	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#b2b2b2',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

}


/* ! ------------------------------------------------------------------ */
/* ! Content panels */

.outset {
	border-top: 2px solid #FFF;
	border-bottom: 2px solid #808080;
	background: rgb(217,217,217);
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Q5ZDlkOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2VhZWFlYSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkNWQ1ZDUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(left,  rgba(217,217,217,1) 0%, rgba(234,234,234,1) 50%, rgba(213,213,213,1) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(217,217,217,1)), color-stop(50%,rgba(234,234,234,1)), color-stop(100%,rgba(213,213,213,1)));
	background: -webkit-linear-gradient(left,  rgba(217,217,217,1) 0%,rgba(234,234,234,1) 50%,rgba(213,213,213,1) 100%);
	background: -o-linear-gradient(left,  rgba(217,217,217,1) 0%,rgba(234,234,234,1) 50%,rgba(213,213,213,1) 100%);
	background: -ms-linear-gradient(left,  rgba(217,217,217,1) 0%,rgba(234,234,234,1) 50%,rgba(213,213,213,1) 100%);
	background: linear-gradient(left,  rgba(217,217,217,1) 0%,rgba(234,234,234,1) 50%,rgba(213,213,213,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d9d9d9', endColorstr='#d5d5d5',GradientType=1 );
}
.inset {
	background: url(../img/backgrounds/inset.png) no-repeat -4px -4px;
	box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.75), 0 3px 4px rgba(255, 255, 255, 0.75);
}
.lt-ie9 .inset {
	border-bottom: 2px solid #DDD
}

.lifted {
	position: relative
}
.lifted:before,
.lifted:after {
	content: '';
	bottom: 15px;
	left: -10px;
	height: 20px;
	width: 465px;
	position: absolute;
	z-index: -1;
	box-shadow: 0 18px 10px 2px rgba(0, 0, 0, 0.4);
	-webkit-transform: rotate(-2deg);
	-moz-transform: rotate(-2deg);
	-o-transform: rotate(-2deg);
	-ms-transform: rotate(-2deg);
	transform: rotate(-2deg);
}
.lifted:after {
	right: -10px;
	left: auto;
	-webkit-transform: rotate(2deg);
	-moz-transform: rotate(2deg);
	-o-transform: rotate(2deg);
	-ms-transform: rotate(2deg);
	transform: rotate(2deg);
}

/* unfortunately ie bugs prevent this approach. applying a filter results in clipping the content box!! so the after element won't display outside parent. ridiculous. */
.lt-ie9 .lifted:after {
	display: none;
	/*
	bottom: -35px;
	right: auto;
	left: 0px;
	height: 33px;
	width: 100%;
	background: url(../img/backgrounds/curved-drop-shadow.png) no-repeat
	*/
}
/* work around */
.lt-ie9 .ie-lifted {
	height: 33px;
	width: 100%;
	background: url(../img/backgrounds/curved-drop-shadow.png) no-repeat
}
.inset.lifted:before,
.inset.lifted:after {
	bottom: auto;
	top: -35px
}
.dark {
	color: #FFF;
	text-shadow: 0px -1px 2px #000;

	background: rgb(51,51,51);
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzMzMzMzMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzU1NTU1NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzMzMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(left,  rgba(51,51,51,1) 0%, rgba(85,85,85,1) 50%, rgba(51,51,51,1) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(51,51,51,1)), color-stop(50%,rgba(85,85,85,1)), color-stop(100%,rgba(51,51,51,1)));
	background: -webkit-linear-gradient(left,  rgba(51,51,51,1) 0%,rgba(85,85,85,1) 50%,rgba(51,51,51,1) 100%);
	background: -o-linear-gradient(left,  rgba(51,51,51,1) 0%,rgba(85,85,85,1) 50%,rgba(51,51,51,1) 100%);
	background: -ms-linear-gradient(left,  rgba(51,51,51,1) 0%,rgba(85,85,85,1) 50%,rgba(51,51,51,1) 100%);
	background: linear-gradient(left,  rgba(51,51,51,1) 0%,rgba(85,85,85,1) 50%,rgba(51,51,51,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#666666',GradientType=1 );

	border-bottom: 2px solid #000;
	border-top: 1px solid transparent;
	box-shadow: 0px -2px 2px rgba(104, 104, 104, 0.5);
}
/*.lt-ie9 .dark span {
	background: url(../img/backgrounds/top-shadow.png) no-repeat 0px 0px;
	height: 3px;
	width: 100%;
	position: absolute;
	left: 0px;
	top: -3px;
}*/
.dark-bullet-list {
	list-style: none;
	padding: 0;
	font-size: 90%
}
.dark-bullet-list li {
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat
}

.content {
    height: 480px;
    margin-top: 70px;
}

/* ! ------------------------------------------------------------------ */
/* ! Video screens */

/* .videoplayer {
	max-height: 498px;
    padding-top: 90px;
}
.lt-ie9 .videoplayer {
	padding-top: 70px;
	max-height: 520px
} */

.videoplayer .content {
	padding: 0px 20px 0px;
	/* height: 450px; */
	overflow: visible;
}

/* IE: applying a filter results in clipping the content box so the title is cut off. problem is there's a filter applied to the parent also, don't want to change that, so have to change layout for ie. */
.videoplayer h2 {

	height: 70px;
	width: 255px;
	margin: -20px 10px -20px;

	/*background: rgb(254,216,163);
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmZWQ4YTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZjliMDI2IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-radial-gradient(center bottom, circle cover, rgba(254,216,163,1) 0%, rgba(249,176,38,1) 100%);
	background: -webkit-radial-gradient(center bottom, circle cover, rgba(254,216,163,1) 0%,rgba(249,176,38,1) 100%);
	background: -o-radial-gradient(center bottom, circle cover,  rgba(254,216,163,1) 0%,rgba(249,176,38,1) 100%);
	background: -ms-radial-gradient(center bottom, circle cover,  rgba(254,216,163,1) 0%,rgba(249,176,38,1) 100%);
	background: radial-gradient(center bottom, circle cover,  rgba(254,216,163,1) 0%,rgba(249,176,38,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fed8a3', endColorstr='#f9b026',GradientType=1 );

	box-shadow: 3px 4px 8px 0px rgba(0, 0, 0, 0.3), inset 0px 2px 0px 0px rgba(255, 255, 204, 1), inset 0px -4px 1px 2px rgba(194, 66, 19, 0.3)
*/
	background:none;
	filter: none;
	box-shadow:none;
	border:none;

}
.lt-ie9 .videoplayer h2 {
	/*background: url(../img/titles/title-grad.png);*/
	margin: 10px 20px -20px;
	/*
	border-top: 2px solid #FFFFCC;
	border-left: 2px solid #ffad30;
	border-right: 2px solid #ffad30;
	*/
}
.lt-ie9 .videoplayer .content {
	padding: 0px 20px 0px;
	height: 480px;
}
.videoplayer h2 span {
	display:none;
	height: 100%;
	background: url(../img/titles/story.png) no-repeat;
}
.videoplayer .video-holder {
	background: #FFF;
	box-shadow: 0px 4px 10px rgba(0,0,0,0.5);
	float: left;
	padding: 10px;
	width: 504px;
	height: 314px;

}
.videoplayer .col-2 {
	float: right;
	width: 310px;
	font-size: 100%;
}
.videoplayer .col-2 p {
	font-size: 90%;
    margin: 0 0 1em;
}
.videoplayer .activity .button-container {
	float: left;
	width: 150px;
}

/* ! ------------------------------------------------------------------ */
/* ! Home */

#home {
	height: 588px;
	width: 890px;
	background: url(../img/home/arrows.png) 0px 0px no-repeat;
	display: block
}

#home.hide-background {
	background: none;
}

#home .instructional {
	font-size: 130%;
	width: 320px;
	line-height: 1.2;
	margin: 30px;
}
#home .myth {
	border-radius: 5px;
	color: #FFF;
	font-style: italic;
	font-weight: bold;
	display: block;
	padding: 10px 0;
	height: 40px;
}
#home nav li {
	position: absolute
}
#home nav li p {
	width: 100%
}
#home nav li em {
	background: url(../img/home/titles2.png) no-repeat;
	width: 100%;
	height: 32px
}
#home .tooltip {
	display: none;
}
#home a {
	text-decoration: none;
	cursor: default;
}
#home .myth p {
	position: absolute;
	/*left: 20px;*/
	top: 16px;
}
#home .bubble {
	height: 30px;
	width: 40px;
	border-radius: 70%;
	top: 34px;
	position: absolute;
	background: #333333;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 4px rgba(0,0,0,0.49);
}
#home .bubble1,
#home .bubble2 {
	height: 12px;
	width: 12px;
	border-radius: 50%;
	top: 67px;
	left: 14px;
	position: absolute;
}
#home .bubble2 {
	top: 84px
}
#home .dark-background,
#home .bubble1,
#home .bubble2 {
	background: #333333;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 4px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,0);
	-webkit-transition:background 0.25s ease-out;
	-moz-transition:background 0.25s ease-out;
	-ms-transition:background 0.25s ease-out;
	-o-transition:background 0.25s ease-out;
	transition:background 0.25s ease-out;
}
#home a.hover,
#home a.hover .bubble,
#home a.hover .bubble1,
#home a.hover .bubble2 {
	cursor: pointer;
	background: #76DEF8;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 2px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,0);
	/*appears as if size of button is slightly reduced from the top */
	/*box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 2px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,1);*/
	-webkit-transition:background 0.25s ease-in;
	-moz-transition:background 0.25s ease-in;
	-ms-transition:background 0.25s ease-in;
	-o-transition:background 0.25s ease-in;
	transition:background 0.25s ease-in;
}
/* cannot use PIE for these as it's bugged on hover (I guess because it's nested? not sure)*/
.lt-ie9 #home .bubble {
	height: 73px;
	width: 44px;
	background-color: transparent !important;
	background: url(../img/home/bubbles.png) no-repeat 0px 0px
}
.lt-ie9 #home a.hover .bubble {
	cursor: pointer;
	background: url(../img/home/bubbles.png) no-repeat 0px -73px
}
#home a.hover .bubble {
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 2px rgba(0,0,0,0.49);
}

#home .light-background,
#home .light-background .bubble1,
#home .light-background .bubble2 {
	background: #555555;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 4px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,0);
	-webkit-transition:background 0.25s ease-out;
	-moz-transition:background 0.25s ease-out;
	-ms-transition:background 0.25s ease-out;
	-o-transition:background 0.25s ease-out;
	transition:background 0.25s ease-out;
}

#home .light-background .bubble {
	background: #e5e5e5;
}
.lt-ie9 #home .light-background .bubble {
	background: url(../img/home/bubbles.png) no-repeat 0px -146px
}

#home .bullet-arrow-holder {
	position: absolute
}
#home .bullet-arrow {
	height: 28px;
	width: 28px;
}
#home .bullet-arrow .circle {
	height: 20px;
	width: 20px;
}
#home .bullet-arrow canvas {
	top: 5px;
	left: 7px;
}

/* Myth 0 */
#home #home-myth-0 {
	left: 420px;
    top: 70px;
    width: 360px;
}
#home #home-myth-0 .bubble {
	left: 160px
}
#home #home-myth-0 .bubble1,
#home #home-myth-0 .bubble2 {
	left: 174px
}
#home #home-myth-0 em {
	background-position: 30px 0px;
}
#home #home-myth-0 a.hover.complete em,
#home #home-myth-0 a.hover em {
	/*background-position: -870px 0px;*/
	background-position: -2670px 0px;
}
#home #home-myth-0 a.clicked em {
	background-position: -1770px 0px;
}
#home #home-myth-0 a.complete em {
	/*background-position: -2670px 0px;*/
	background-position: -1770px 0px;
}

/* Myth 1 */
#home #home-myth-1 {
	left: 30px;
    top: 195px;
    width: 360px;
}
#home #home-myth-1 .bubble {
	left: 30px;
}
#home #home-myth-1 .bubble1,
#home #home-myth-1 .bubble2 {
	left: 44px;
}
#home #home-myth-1 em {
	background-position: 30px -100px;
}
#home #home-myth-1 a.hover em,
#home #home-myth-1 a.hover.complete em {
	/*background-position: -870px -100px;*/
	background-position: -2670px -100px;
}
#home #home-myth-1 a.clicked em {
	background-position: -1770px -100px;
}
#home #home-myth-1 a.complete em {
	/*background-position: -2670px -100px;*/
	background-position: -1770px -100px;
}

/* Myth 2 */
#home #home-myth-2 {
	left: 480px;
    top: 320px;
    width: 360px;
}
#home #home-myth-2 .bubble {
	left: 195px;
}
#home #home-myth-2 .bubble1,
#home #home-myth-2 .bubble2 {
	left: 209px;
}
#home #home-myth-2 em {
	background-position: 30px -200px;
}
#home #home-myth-2 a.hover em,
#home #home-myth-2 a.hover.complete em {
	/*background-position: -870px -200px;*/
	background-position: -2670px -200px;
}
#home #home-myth-2 a.clicked em {
	background-position: -1770px -200px;
}
#home #home-myth-2 a.complete em {
	/*background-position: -2670px -200px;*/
	background-position: -1770px -200px;
}

/* Myth 3 */
#home #home-myth-3 {
	left: 210px;
    top: 448px;
    width: 360px;
}
#home #home-myth-3 .bubble {
	left: 193px;
}
#home #home-myth-3 .bubble1,
#home #home-myth-3 .bubble2 {
	left: 207px;
}
#home #home-myth-3 em {
	background-position: 30px -300px
}
#home #home-myth-3 a.hover em,
#home #home-myth-3 a.hover.complete em {
	/*background-position: -870px -300px;*/
	background-position: -2670px -300px;
}
#home #home-myth-3 a.clicked em {
	background-position: -1770px -300px;
}
#home #home-myth-3 a.complete em {
	/*background-position: -2670px -300px;*/
	background-position: -1770px -300px;
}


/* ! ------------------------------------------------------------------ */
/* ! Help */

#help .gradient-dark {

	/* gradient style 'bb help btn' */
	background: rgb(72,72,72); /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ4NDg0OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxYTFhMWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgba(72,72,72,1) 0%, rgba(26,26,26,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(72,72,72,1)), color-stop(100%,rgba(26,26,26,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(72,72,72,1) 0%,rgba(26,26,26,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(72,72,72,1) 0%,rgba(26,26,26,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(72,72,72,1) 0%,rgba(26,26,26,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(72,72,72,1) 0%,rgba(26,26,26,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#484848', endColorstr='#1a1a1a',GradientType=0 ); /* IE6-8 */

}
#help {
	width: 700px;
	border-radius: 5px;
	box-shadow: 0px -6px 0px #000, 0px 6px 0px #000, 0px 0px 0px 6px #76DEF8;
	background: #000;
	margin: 0 0 0 40px;
	padding: 0;
	position: relative;
}
#help .info {
	margin-bottom: 2px;
}
#help a {
	text-decoration: none;
}

/* closed state */
#help a.header {
	height: 66px;
	padding-left: 40px;
	width: 660px;
	margin-left: 0px;
	border-radius: 5px;
	box-shadow: inset 0 1px 0px #484848, 0 1px 0px #1A1A1A;
	background: #333;
	cursor: pointer;
	display: block;

	/*z-index: 1;*/
	position: relative;
	color: #FFF;

	/* this basic animation is slow on iPad - animating width/margin won't cut it. perhaps we could scale it instead. */

	-webkit-transition-property: width, margin;
	-moz-transition-property: width, margin;
	-o-transition-property: width, margin;
	-ms-transition-property: width, margin;
	transition-property: width, margin;

	-webkit-transition-duration: .2s;
	-moz-transition-duration: .2s;
	-o-transition-duration: .2s;
	-ms-transition-duration: .2s;
	transition-duration: .2s;

	-webkit-transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	-o-transition-timing-function: ease-out;
	-ms-transition-timing-function: ease-out;
	transition-timing-function: ease-out;

}
#help .bullet-arrow-holder {
	float: left;
	margin-right: 40px;
	margin-top: 15px
}
#help hgroup {
	padding: 20px 60px 0px 0px;
}
#help h1 {
	float: left;
	padding: 2px 0 0 60px;
	display: block;
	background: none;
	box-shadow: none;
	font-style: normal;
	width: auto
}
.lt-ie9 #help h1 {
	font-size: 150%
}
#help h2 {
	float: right;
	font-weight: normal
}
#help dl {
	display: none;

	/*height: 0px;*/
	/*
	-webkit-transition-property: all;
	-webkit-transition-duration: .4s;
	-webkit-transition-timing-function: ease-out;
	*/
}
#help ul {
	list-style: none;

}
#help dl li span {
	width: 60px;
	display: block;
	float: left;
}
#help dl li a {
	display: inline;
	margin-left: 10px;
}

/* closed hover */
#help a.active:hover {
	background: #76DEF8;
	box-shadow: inset 0 1px 0px #B7EEFB, 0 1px 0px #0A91B1;
	width: 680px;
	margin-left: -10px;
}
#help a.active:hover h1,
#help a.active:hover h2 {
	color: #067E9B;
	text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5);
}

/* open state */
#help .open a.header {
	background: #000;
}

/* open down state */
#help .open a.down {
	background: #0A91B1;
	box-shadow: inset 0 1px 0px #21C7EF, 0 1px 0px #097691;
}
#help a.down h1,
#help a.down h2 {
	color: #FFF;
}


/* inactive state */
#help a.inactive {
	color: #8D8D8D;
	cursor: default
}
#help a.inactive h1 {
	color: #8D8D8D
}

/* current state */
#help a.current {
	background: #000000;
	width: 680px;
	margin-left: -10px;
}

#help dl a {
	color: #0A91B1;
	display: block
}
#help dl {
	padding: 10px 40px 0px;
	font-size: 140%;
	background: #FFF;
	margin: 0 10px 10px
}
#help dt {
	float: left;
	display: inline;
	width: 270px;
	clear: both;
	margin-bottom: 15px
}
#help dd {
	float: left;
	display: inline;
	left: 0px;
	width: 330px;
	margin: 0;
}
#help dd,
#help dt {
	margin-bottom: 10px;
}
#help dd p {
	padding: 0;
	margin: 0;
	color: #333;
}
#help dl .hover {
	background: #CCC
}
#help dd.full-width {
	width: 620px;
}
#help p {
	color: #555;
	font-size: 90%;
	line-height: 1.2;
}
#help-other dt {
	width: 240px;
	margin-right: 30px;
}
#help dt, #help dd {
	margin-bottom: 15px;
}
#help dl a:hover {
	text-decoration: underline
}

/* arrow */
.down-arrow {
	height: 0px;
	width: 0px;
	position: absolute;
	left: 30px;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 20px solid #000;
	opacity: 0;

	/*top: 66px;*/
	/*margin-top: -50px;*/

}

#modal-view .button-holder {
	position: absolute;
	top: 20px;
	right: 30px;
}
#modal-view button {
	height: 70px;
	width: 70px;
	border-radius: 50%;
	box-shadow: 0px 6px 6px rgba(0,0,0,0.5);
	text-indent: 0em;
	color: #FFF;
	font-size: 280%;
	text-transform: uppercase;
	padding-top: 10px
}
#modal-view button:before {
	width: 74px;
	height: 74px;
	border-radius: 50%;
}
#modal-view button:after {
	display: none
}
.lt-ie9 #modal-view button {
	background: url(../img/buttons/buttons.png) -1300px 0px;
	border-radius: none;
	width: 84px;
	height: 84px;
	text-indent: -10px;

}
.lt-ie9 #modal-view button:before {
	display: none
}


/* ! ------------------------------------------------------------------ */
/* ! Intro */


#intro {
	position: relative;
}
#intro h2 {
	font-size: 120%
}
#intro .screen {
	position: absolute;
	width: 910px;
}
#intro .screen .content {
	height: 474px;
}
#intro .help-1 {
	position: absolute;
	left: 70px;
	top: 490px;
	font-size: 90%
}
#intro .help-1 button {
	float: left;
}
#intro .help-1 span {
	float: right;
	width: 500px;
	margin-left: 32px
}
#intro .help-1 strong {
	display: block
}
#intro-screens {
	position: absolute;
}
#intro-screens p {
	width:620px;
	margin-bottom: 1em;
}
#intro-screens .content {
	margin-top: 50px;
}
#intro-screens .content div {
	padding: 100px 80px 0;
	line-height: 1.25;
	height: 324px;
}
#intro-screens p.button-holder {
	margin-bottom: 0px;
	position: absolute;
	bottom: 40px;
	right: 80px;
	width: 250px
}
#intro h2 {
	margin-bottom: 20px
}

/* Screen 0 */
#intro .screen-0 {
	left: -10px;
	top: 0px;
}
#intro .screen-0 h2 {
	font-size: 180%;
	width: 430px;
	margin-bottom: 30px;
}
#intro .screen-0 p {
	font-size: 110%;
	width: 400px
}
#intro .screen-0 .content div {
	background: url(../img/logo/butterfly.png) no-repeat 510px 40px;
	width: 800px;
	padding: 70px 0px 0px 90px
}
#intro-screens .screen-0 p.button-holder {
	width: 250px;
	right: 80px;
	top: 380px
}
#intro-screens .screen-0 p.button-holder button {
	position: absolute;
	top: 0px;
	left: 0px
}

/* Screen 1 */
#intro .screen-1 {
	left: 930px;
	top: 0px;
}
#intro-screens .screen-1 p.button-holder {
	width: 250px;
	right: 80px;
	top: 380px
}
#intro-screens .screen-1 p.button-holder button {
	position: absolute;
	top: 0px;
	left: 0px
}
#entry-name label {
	width: 284px;
}
#entry-name label,
#entry-postcode label {
	display: block;
	margin-bottom: 10px;
}
#intro #entry-name,
#intro #entry-postcode {
	float: left;
	width: 377px;
	margin-bottom: 40px;
	position: relative
}
#intro #entry-postcode {
	width: 200px;
}
#intro #entry-name input,
#intro #entry-postcode input {
	height: 50px;
	border: 0px;
	padding: 0px 10px;
	margin-top: 5px;
	color: #016981;
}
.lt-ie9 #intro #entry-name input,
.lt-ie9 #intro #entry-postcode input {
	padding: 15px 10px 0px;
	height: 35px;
}
#entry-name input {
	background: url(../img/forms/input_boxes.png) no-repeat 0px -106px;
	width: 284px;
}
#entry-postcode input {
	background: url(../img/forms/input_boxes.png) no-repeat 0px -159px;
	width: 148px;
}
#entry-terms span {
	display: block;
	margin-bottom: 30px;
}
#entry-terms label {
	display: block;
	cursor: pointer;
	height: 26px;
	max-height: 26px;
	background: url(../img/forms/checkbox.png) no-repeat 0px 0px;
	padding: 4px 22px 0px 39px;
	clear: both;
	font-size: 80%;
	float: left;
	clear: none;
	margin-bottom: 26px;
	margin-left: -30px;
}
#entry-terms label span {
	font-size: 85%;
	display: inline;
	padding-right: 4px
}
#entry-terms input {
	/*position: absolute;*/
	float: left;
	/*margin-left: -150px;*/
	border: 0px !important;
	width: 30px;
	height: 30px;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
	/*visibility: hidden;*/
}
#intro #entry-terms {
	width: 800px;
	clear: both
}
.LV_valid {
    color: #0C0;
	overflow: hidden;
	display: block !important;
	width: 50px;
	height: 50px;
	padding-top: 35px;
	top: 12px;
	left: 310px;
	text-indent: -9999em;
	background: url(../img/misc/tick.png) no-repeat 0px 35px;
	position: absolute;
}
#entry-postcode .LV_valid {
	left: 174px;
}
#entry-terms .LV_invalid {
	top: 340px;
}
.LV_invalid {
	display: block;
	font-size: 80%;
	color: #C00;
	position: absolute;
	top: 100px;
	width: 284px;
}
#bb-name.LV_invalid_field,
#bb-name input.LV_invalid_field:hover,
#bb-name input.LV_invalid_field:active,
#bb-name textarea.LV_invalid_field:hover,
#bb-name textarea.LV_invalid_field:active {
	background-position: 0px 0px
}
#bb-postcode.LV_invalid_field,
#bb-postcode input.LV_invalid_field:hover,
#bb-postcode input.LV_invalid_field:active,
#bb-postcode textarea.LV_invalid_field:hover,
#bb-postcode textarea.LV_invalid_field:active {
	background-position: 0px -53px
}

/* Screen 2 */
#intro .screen-2 {
	left: 1860px;
	top: 0px
}

/* Screen 3 */
#intro .screen-3 {
	left: 2790px;
	top: 0px
}
#intro .screen-2 .content div,
#intro .screen-3 .content div {
	height: 400px;
	background: url(../img/backgrounds/intro-arrow.png) no-repeat 80px 370px;
}

/* Panels */
#intro-screens .lifted:before {
	left: 5px;
}
#intro-screens .lifted:after {
	right: 5px;
}
#intro .screen-0 .copyright {
	font-size: 80%;
	text-align: center;
	width: 100%;
	margin-top: 15px;
	color: #666;
}


.videoplayer h2 {
	width:auto;
	display:table;
}
.videoplayer h2 .vid-title {
	padding: 0 20px;
	font-weight:bold;
	font-size: 90%;
	font-family: "adelle", "Candara", Arial, sans-serif;
	background: none;
}

#myth-2 .screen-1.videoplayer h2,
#myth-2 .screen-7.videoplayer h2,
#myth-3 .screen-1.videoplayer h2
{
	padding-bottom: 10px;
	margin: -40px 10px -10px;
	line-height: 110%;
}
#myth-2 .screen-1.videoplayer .vid-title,
#myth-2 .screen-7.videoplayer .vid-title,
#myth-3 .screen-1.videoplayer .vid-title
{
	display: block;
	display: none;
}

.lt-ie9 #myth-2 .screen-1.videoplayer h2,
.lt-ie9 #myth-2 .screen-7.videoplayer h2,
.lt-ie9 #myth-3 .screen-1.videoplayer h2 {
	margin: 0px 10px -10px;
}


/* ! ------------------------------------------------------------------ */
/* ! Myth 1 */

section#myth-0 h1 {
	background-position: 100px 10px;
}
section#myth-1 h1 {
	background-position: 100px -40px;
}
section#myth-2 h1 {
	background-position: 100px -90px;
}
section#myth-3 h1 {
	background-position: 100px -140px;
}

.navigation-tip {
	position: absolute;
	margin-bottom: 0px;
	top: 520px;
	right: 30px;
	width: 296px;
	height: 53px;
	padding: 20px 0px 0px 10px;
	color: #FFF;
	font-size: 75% !important;
	background: url(../img/backgrounds/dark-arrow-bg.png) no-repeat right top;
	font-size: 140%;
	font-family: Arial,sans-serif;
}

/* ! ------------------------------------------------------------------ */
/* ! Myth 0 */

/* #myth-0 .act-2 img {
	float: left;
	margin: 20px 0px -20px -20px;
} */

/* #myth-0 .content p.intro {
	margin: 5em 3em 2em;
	text-align: center;
} */

/* #myth-0 .act-2 .option {
	width: 400px;
	font-size: 90%;
	margin-top: 40px;
	line-height: 1.25;
	margin-right: 20px;
}

#myth-0 .act-2 .option {
	margin: 0 auto;
}
#myth-0 .act-2 a p {
	margin:0;
}
#myth-0 .act-2 .option a, #myth-0 .act-2 .option a.disabled, #myth-0 .act-2 .option a.disabled:hover {
	position: relative;
	display: block;
	padding: 10px 10px 10px 40px;
	font-size: 90%;
	margin: 20px 0px 10px;
	color: #76DEF8;
	background: #333333;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 4px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,0);
	border-radius: 5px;
	text-shadow: none;
	-webkit-transition:all 0.25s ease-out;
	-moz-transition:background 0.25s ease-out;
	-ms-transition:background 0.25s ease-out;
	-o-transition:background 0.25s ease-out;
	transition:background 0.25s ease-out;
}
#myth-0 .act-2 .option a.disabled, #myth-0 .act-2 .option a.disabled:hover {
	cursor:default;
}

#myth-0 .act-2 .option a.visited,#myth-0 .act-2 .option a.visited.disabled, #myth-0 .act-2 .option a.visited.disabled:hover {
	background: #666;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 4px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,0);
	color: #333;
	cursor: default;
}

#myth-0 .act-2 .option a.hover {
	cursor: pointer;
	background: #76DEF8;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 2px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,1);
	-webkit-transition:all 0.25s ease-in;
	-moz-transition:background 0.25s ease-in;
	-ms-transition:background 0.25s ease-in;
	-o-transition:background 0.25s ease-in;
	transition:background 0.25s ease-in;
	color: #067E9B;
} */


/* #myth-0 .image .button-holder.nav.back {
	right: 30px;
}
 */

/* #myth-0 .act-2 .feedback {
	font-size: 90%;
	line-height: 1.25;
	margin-top: 30px;
}
#myth-0 .act-2 .button-holder {
	margin-top: 30px;
}
#myth-0 .act-2 .bullet-arrow-holder {
	float: left;
	margin-left: -50px;
}
#myth-0 .act-2 .bullet-arrow-holder {
	position: absolute
}
#myth-0 .act-2 .bullet-arrow {
	height: 28px;
	width: 28px;
}
#myth-0 .act-2 .bullet-arrow .circle {
	height: 20px;
	width: 20px;
}
#myth-0 .act-2 .bullet-arrow canvas {
	top: 5px;
	left: 7px;
} */

/* #myth-0 .act-2 .speech-bubble-tail {
	position: absolute;
	top: 8px;
	left: -14px;
	width: 0px;
	height: 3px;
	border-top: 16px transparent solid;
	border-bottom: 16px transparent solid;
	border-right: 16px solid #333;
	-webkit-transition:border 0.25s ease-out;
	-moz-transition:border 0.25s ease-out;
	-ms-transition:border 0.25s ease-out;
	-o-transition:border 0.25s ease-out;
	transition:border 0.25s ease-out;
}
#myth-0 .act-2 .hover .speech-bubble-tail {
	border-right-color: #76DEF8;
	-webkit-transition:border 0.25s ease-in;
	-moz-transition:border 0.25s ease-in;
	-ms-transition:border 0.25s ease-in;
	-o-transition:border 0.25s ease-in;
	transition:border 0.25s ease-in;
} */



/* screen 2's first right
.right-screen-1 {
    float: right;
    margin-top: -588px;
    padding-top: 100px;
    position: relative;
    width: 900px;
}
screen 2's second right
.right-screen-2 {
    float: right;
    margin-top: -588px;
    padding-top: 0px;
    position: relative;
    width: 900px;
}

.go-back {
	display:table;
}

.right-screen-2 .lifted {
    height: 480px;
}

.right-screen-2 .button-holder.overlaid {
    left: 50px;
    position: absolute;
    top: 450px;
} */

/* #myth-0 .right-screen-2 img {
	margin: -10px 0 -20px 20px;
} */


/* screen 0 */
/* #myth-0 .screen-0 {
    max-height: 398px;
    padding-top: 190px;
}
#myth-0 .screen-0 .content {
	padding: 60px 120px 60px 362px;
}
#myth-0 .screen-0 .content img {
	display:block;
	position:relative;
	margin: -120px 20px -136px -80px;
}

#myth-0 .screen-0 .content p:first-child {
	margin-bottom: 30px;
}
#myth-0 .content p {
	margin:0.5em 0;
} */
/*
#myth-0 .screen-3
{
	padding-top: 170px;
	max-height: 418px;
}
#myth-0 .screen-3 .content
{
	padding: 40px 120px 40px;
}

 #myth-0 .screen-4, #myth-0 .screen-4-1, #myth-0 .screen-8, #myth-0 .screen-8-1, #myth-0 .screen-12, #myth-0 .screen-12-1, #myth-0 .screen-13, #myth-0 .screen-14, #myth-0 .screen-16
{
	padding-top: 140px;
	max-height: 448px;
}

#myth-0 .screen-4 .content, #myth-0 .screen-4-1 .content, #myth-0 .screen-8 .content, #myth-0 .screen-8-1 .content, #myth-0 .screen-12 .content, #myth-0 .screen-12-1 .content, #myth-0 .screen-13 .content, #myth-0 .screen-14 .content, #myth-0 .screen-16 .content
{
	height: 440px;
    padding: 40px 120px 0;
}*/

#myth-0 .screen-4 .content ul, #myth-0 .screen-4-1 .content ul, #myth-0 .screen-8 .content ul, #myth-0 .screen-8-1 .content ul, #myth-0 .screen-12 .content ul, #myth-0 .screen-12-1 .content ul, #myth-0 .screen-13 .content ul, #myth-0 .screen-14 .content ul, #myth-0 .screen-16 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-0 .screen-4 .content ul li, #myth-0 .screen-4-1 .content ul li, #myth-0 .screen-8 .content ul li, #myth-0 .screen-8-1 .content ul li, #myth-0 .screen-12 .content ul li, #myth-0 .screen-12-1 .content ul li, #myth-0 .screen-13 .content ul li, #myth-0 .screen-14 .content ul li, #myth-0 .screen-16 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

/* last screen (conclusion) */
/* #myth-0 .screen-17
{
	padding-top: 100px;
	max-height: 488px;
}
#myth-0 .screen-17 .content
{
	padding: 40px 120px 40px;
}
#myth-0 .screen-17 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-0 .screen-17 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}
#myth-0 .screen-17 .button-holder {
	margin: 30px auto;
	width: 250px;
}
#myth-0 .screen-17 .button-holder.right {
	margin: 30px 120px 0 0;
	float: right;
}
.lt-ie9 #myth-0 .screen-17 .button-holder {
	margin-top: 0px
}

#myth-0 .screen-17 h2 {
	background: url(../img/titles/titles.png) 0px -585px no-repeat
} */


/* temp - hide content that runs over to next screen */
/* #myth-0 .screen.screen-1,
#myth-0 .screen.screen-3,
#myth-0 .screen.screen-5,
#myth-0 .screen.screen-7,
#myth-0 .screen.screen-9
{
    overflow: hidden;
} */


/* Myth 1

#myth-1 .screen-0 {
    max-height: 398px;
    padding-top: 190px;
}
#myth-1 .screen-0 .content {
	padding: 60px 120px 60px 362px;
}
#myth-1 .screen-0 .content img {
	display:block;
	position:relative;
	margin: -120px 20px -128px -80px;
}

#myth-1 .screen-0 .content p:first-child {
	margin-bottom: 30px;
}
#myth-1 .content p {
	margin:0.5em 0;
}


#myth-1 .screen-2
{
	padding-top: 150px;
	max-height: 438px;
}
#myth-1 .screen-2 .content
{
	padding: 40px 120px 40px;
}
#myth-1 .screen-2 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-1 .screen-2 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-1 .screen-3
{
	padding-top: 170px;
	max-height: 418px;
}
#myth-1 .screen-3 .content
{
	padding: 40px 120px 40px;
}

#myth-1 .screen-5
{
	padding-top: 120px;
	max-height: 468px;
}
#myth-1 .screen-5 .content
{
	padding: 40px 120px 40px;
}
#myth-1 .screen-5 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-1 .screen-5 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-1 .screen-6
{
	padding-top: 150px;
	max-height: 438px;
}
#myth-1 .screen-6 .content
{
	padding: 60px 120px 60px;
}
#myth-1 .screen-6 p:first-child
{
	margin-bottom: 30px;
}

#myth-1 .screen-8
{
	padding-top: 110px;
	max-height: 478px;
}
#myth-1 .screen-8 .content
{
	padding: 40px 120px 40px;
}
#myth-1 .screen-8 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-1 .screen-8 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-1 .screen-9
{
	padding-top: 100px;
	max-height: 488px;
}
#myth-1 .screen-9 .content
{
	padding: 40px 120px 40px;
}
#myth-1 .screen-9 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-1 .screen-9 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}
#myth-1 .screen-9 .button-holder {
	margin: 30px auto;
	width: 250px;
}
#myth-1 .screen-9 .button-holder.right {
	margin: 30px 120px 0 0;
	float: right;
}
.lt-ie9 #myth-1 .screen-9 .button-holder {
	margin-top: 0px
}

#myth-1 .screen-10 {
	display:block;
	margin: 140px 0 0 0;
	z-index: 10;
	position: relative;
	height: 448px;
}
#myth-1 .screen-10 .content {
	padding: 40px 120px 30px;
}
#myth-1 .screen-10 .content p {
	margin-bottom: 30px
}
#myth-1 .screen-10 ul {
	padding-left: 24px;
	font-size: 90%
}
#myth-1 .screen-10 .button-holder {
	margin: 30px auto;
	width: 250px;
}
#myth-1 .screen-10 .button-holder.right {
	margin: 30px 120px 0 0;
	float: right
}
.lt-ie9 #myth-1 .screen-10 .button-holder {
	margin-top: 0px
}
#myth-1 .screen-10 a {
	color: #00AAEE;
}
#myth-1 .screen-10 a:hover {
	color: #46CBF5;
}

#myth-1 .screen-9 h2 {
	background: url(../img/titles/titles.png) 0px -585px no-repeat
}*/
/* temp - hide content that runs over to next screen */
/* #myth-1 .screen.screen-1,
#myth-1 .screen.screen-3,
#myth-1 .screen.screen-5,
#myth-1 .screen.screen-7,
#myth-1 .screen.screen-9
{
    overflow: hidden;
}
 */

/* ! Myth 2
#myth-2 .screen-0 {
    max-height: 398px;
    padding-top: 190px;
}
#myth-2 .screen-0 .content {
	padding: 60px 120px 60px 362px;
}
#myth-2 .screen-0 .content img {
	display:block;
	position:relative;
	margin: -100px 20px -120px -80px;
}

#myth-2 .screen-0 .content p:first-child {
	margin-bottom: 30px;
}
#myth-2 .content p {
	margin:0.5em 0;
}

#myth-2 .screen-2
{
	padding-top: 150px;
	max-height: 438px;
}
#myth-2 .screen-2 .content
{
	padding: 40px 120px 40px;
}
#myth-2 .screen-2 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-2 .screen-2 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-2 .screen-3
{
	padding-top: 170px;
	max-height: 418px;
}
#myth-2 .screen-3 .content
{
	padding: 40px 120px 40px;
}

#myth-2 .screen-5
{
	padding-top: 120px;
	max-height: 468px;
}
#myth-2 .screen-5 .content
{
	padding: 40px 120px 40px;
}
#myth-2 .screen-5 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-2 .screen-5 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-2 .screen-6
{
	padding-top: 150px;
	max-height: 438px;
}
#myth-2 .screen-6 .content
{
	padding: 60px 120px 60px;
}
#myth-2 .screen-6 p:first-child
{
	margin-bottom: 30px;
}

#myth-2 .screen-8
{
	padding-top: 110px;
	max-height: 478px;
}
#myth-2 .screen-8 .content
{
	padding: 40px 120px 40px;
}
#myth-2 .screen-8 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-2 .screen-8 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-2 .screen-9
{
	padding-top: 100px;
	max-height: 488px;
}
#myth-2 .screen-9 .content
{
	padding: 40px 120px 40px;
}
#myth-2 .screen-9 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-2 .screen-9 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}
#myth-2 .screen-9 .button-holder {
	margin: 30px auto;
	width: 250px;
}
#myth-2 .screen-9 .button-holder.right {
	margin: 30px 120px 0 0;
	float: right;
}
.lt-ie9 #myth-2 .screen-9 .button-holder {
	margin-top: 0px
}

#myth-2 .screen-10 {
	display:block;
	margin: 140px 0 0 0;
	z-index: 10;
	position: relative;
	height: 448px;
}
#myth-2 .screen-10 .content {
	padding: 40px 120px 30px;
}
#myth-2 .screen-10 .content p {
	margin-bottom: 30px
}
#myth-2 .screen-10 ul {
	padding-left: 24px;
	font-size: 90%
}
#myth-2 .screen-10 .button-holder {
	margin: 30px auto;
	width: 250px;
}
#myth-2 .screen-10 .button-holder.right {
	margin: 30px 120px 0 0;
	float: right
}
.lt-ie9 #myth-2 .screen-10 .button-holder {
	margin-top: 0px
}
#myth-2 .screen-10 a {
	color: #00AAEE;
}
#myth-2 .screen-10 a:hover {
	color: #46CBF5;
}

#myth-2 .screen-9 h2 {
	background: url(../img/titles/titles.png) 0px -585px no-repeat
}*/
/* temp - hide content that runs over to next screen
#myth-2 .screen.screen-1,
#myth-2 .screen.screen-3,
#myth-2 .screen.screen-5,
#myth-2 .screen.screen-7,
#myth-2 .screen.screen-9
{
    overflow: hidden;
}*/


/* Myth 3
#myth-3 .screen-0 {
    max-height: 398px;
    padding-top: 190px;
}
#myth-3 .screen-0 .content {
	padding: 60px 110px 60px 382px;
}
#myth-3 .screen-0 .content img {
	display:block;
	position:relative;
	margin: -110px 0px -238px -302px;
}

#myth-3 .screen-0 .content p:first-child {
	margin-bottom: 30px;
}
#myth-3 .content p {
	margin:0.5em 0;
}

#myth-3 .screen-2
{
	padding-top: 150px;
	max-height: 438px;
}
#myth-3 .screen-2 .content
{
	padding: 40px 90px;
}
#myth-3 .screen-2 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-3 .screen-2 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-3 .screen-3
{
	padding-top: 170px;
	max-height: 418px;
}
#myth-3 .screen-3 .content
{
	padding: 40px 120px 40px;
}

#myth-3 .screen-5
{
	padding-top: 120px;
	max-height: 468px;
}
#myth-3 .screen-5 .content
{
	padding: 40px 120px 40px;
}
#myth-3 .screen-5 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-3 .screen-5 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-3 .screen-6
{
	padding-top: 150px;
	max-height: 438px;
}
#myth-3 .screen-6 .content
{
	padding: 60px 120px 60px;
}
#myth-3 .screen-6 p:first-child
{
	margin-bottom: 30px;
}

#myth-3 .screen-8
{
	padding-top: 110px;
	max-height: 478px;
}
#myth-3 .screen-8 .content
{
	padding: 40px 120px 40px;
}
#myth-3 .screen-8 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-3 .screen-8 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-3 .screen-9
{
	padding-top: 100px;
	max-height: 488px;
}
#myth-3 .screen-9 .content
{
	padding: 40px 120px 40px;
}
#myth-3 .screen-9 .content ul
{
	list-style: none;
	padding: 0;
	margin:0.5em 0;
}
#myth-3 .screen-9 .content ul li
{
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}
#myth-3 .screen-9 .button-holder {
	margin: 30px auto;
	width: 250px;
}
#myth-3 .screen-9 .button-holder.right {
	margin: 30px 120px 0 0;
	float: right;
}
.lt-ie9 #myth-3 .screen-9 .button-holder {
	margin-top: 0px
}

#myth-3 .screen-10 {
	display:block;
	margin: 140px 0 0 0;
	z-index: 10;
	position: relative;
	height: 448px;
}
#myth-3 .screen-10 .content {
	padding: 40px 120px 30px;
}
#myth-3 .screen-10 .content p {
	margin-bottom: 30px
}
#myth-3 .screen-10 ul {
	padding-left: 24px;
	font-size: 90%
}
#myth-3 .screen-10 .button-holder {
	margin: 30px auto;
	width: 250px;
}
#myth-3 .screen-10 .button-holder.right {
	margin: 30px 120px 0 0;
	float: right
}
.lt-ie9 #myth-3 .screen-10 .button-holder {
	margin-top: 0px
}
#myth-3 .screen-10 a {
	color: #00AAEE;
}
#myth-3 .screen-10 a:hover {
	color: #46CBF5;
}

#myth-3 .screen-9 h2 {
	background: url(../img/titles/titles.png) 0px -585px no-repeat
}*/
/* temp - hide content that runs over to next screen
#myth-3 .screen.screen-1,
#myth-3 .screen.screen-3,
#myth-3 .screen.screen-5,
#myth-3 .screen.screen-7,
#myth-3 .screen.screen-9
{
    overflow: hidden;
}*/


#d-ect-answer h4,
#a-ect-answer h4,
#d-cbt-answer h4,
#a-cbt-answer h4 {
	width: 200px;
	margin-top: -12px
}
#d-vb6-answer, #d-exercise-answer, #d-chocolate-answer, #d-bibliotherapy-answer {
	position: absolute;
	top: 0;
	left: 480px
}
#a-bibliotherapy-answer, #a-lithium-answer, #a-relaxation-answer, #a-kava-answer {
	position: absolute;
	top: 0;
	left: 450px
}
#d-exercise-answer,
#a-bibliotherapy-answer {
	top: 60px
}
#d-chocolate-answer,
#a-relaxation-answer {
	top: 120px
}
#d-bibliotherapy-answer,
#a-kava-answer {
	top: 180px
}

/* Why? */
#treatment-d-why,
#treatment-a-why {
	position: relative;
	float: right;
	margin-top: -588px;
	width: 880px;
	padding-top: 180px
}
#treatment-d-why .type,
#treatment-a-why .type {
	position: absolute;
	top: 0;
	left: 0;
	padding: 100px 140px
}
#treatment-d-why .type h4,
#treatment-a-why .type h4,
#treatment-d-why .type p,
#treatment-a-why .type p {
	margin-bottom: 20px
}

#treatment-d-why .type p,
#treatment-a-why .type p {
	font-size: 90%
}

#treatment-d-why .type .button-holder,
#treatment-a-why .type .button-holder {
	margin-top: 40px
}




/* ! ---------------------------------------------------------------- */
/* ! Screens */
#myth-0, #myth-1, #myth-2 {
	width: 2670px;
}

/* #myth-1 {
	width: 3560px;
} */

.grid.empty {
	background-color: #FFF;
}

.grid.empty p {
	display: hidden;
}

.grid {
	width: 890px;
	height: 588px;
	overflow: hidden;
	position: relative;
	float: left;
}

/* .button-holder.nav.continue {
    bottom: 20px;
    position: absolute;
	right:20px;
} */

.button-holder.nav {
	bottom: 20px;
	position: absolute;
	right: 30px;
}

/* .button-holder.nav.back {
    bottom: 5px;
    position: absolute;
	right:180px;
} */

.button-holder.nav.under-video {
    bottom: 5px;
    position: absolute;
	right: 340px;
}


/* Video layout */


/* Question layout */
.act-2 .content .intro {
    float: none;
    margin: 0 auto;
    padding: 1.8em 0 0.2em;
    position: relative;
 	/* text-align: center; */
    width: 480px;
}

.act-2 .content .intro.option-align {
	left: 40px;
}

.act-2 .option {
	font-size: 90%;
    line-height: 1.25;
    margin: 1.7em auto;
    width: 420px;
}

.act-2.four-options .option {
	margin: 1em auto;
}

.act-2 a p {
	margin:0;
}
.act-2 .option a, .act-2 .option a.disabled, .act-2 .option a.disabled:hover {
	position: relative;
	display: block;
	padding: 14px 10px 14px 25px;
	/* font-size: 90%; */
	margin: 20px 0px 10px;
	color: #76DEF8;
	background: #333333;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 4px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,0);
	border-radius: 5px;
	text-shadow: none;
	-webkit-transition:all 0.25s ease-out;
	-moz-transition:background 0.25s ease-out;
	-ms-transition:background 0.25s ease-out;
	-o-transition:background 0.25s ease-out;
	transition:background 0.25s ease-out;
}

.act-2 .option a.disabled, .act-2 .option a.disabled:hover {
	cursor:default;
}

.act-2 .option a.visited, #myth-0 .act-2 .option a.visited.disabled, .act-2 .option a.visited.disabled:hover {
	/*background: #E5E5E5;
	color: #333333;*/
	background: #555555;
	color: #ffffff;
	margin-left: 10px;
    margin-right: 10px;
    padding-left: 15px;
    padding-right: 0;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 4px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,0);
}

.act-2 .option a.hover {
	cursor: pointer;
	background: #76DEF8;
	box-shadow: 0 3px 5px rgba(0,0,0,0.45), inset 0 -4px 2px rgba(0,0,0,0.49), inset 0px 2px 2px rgba(255,255,255,1);
	-webkit-transition:all 0.25s ease-in;
	-moz-transition:background 0.25s ease-in;
	-ms-transition:background 0.25s ease-in;
	-o-transition:background 0.25s ease-in;
	transition:background 0.25s ease-in;
	color: #333333;
}


/* Image and text layout */
.image img {
    margin: 0.8em 0;
}

.image .col-2 {
	float: right;
	width: 58%;
}

.image .col-2 p {
    padding: 2em 2em 1em 0.5em
}

.image .col-2 p.button-holder {
	padding: 0;
}


/* Text only layout */
.text-only .content p, .text-only .content ul {
    margin: 2em auto -0.8em;
    position: relative;
    width: 600px;
}

.text-only p.button-holder {
	right: 0;
	margin: 2.5em auto;
}

.text-only .content ul {
	list-style: none;
}

.text-only .content ul li {
	margin: 0px 0px 8px 0px;
	padding-left: 30px;
	background: url(../img/misc/dark-bullet.png) left 6px no-repeat;
}

#myth-3 .screen-1 .content, #myth-3 .screen-2 .content {
    height: 370px;
    margin-top: 130px;
    padding-top: 10px;
}
#myth-3 .screen-4 .content {
	height: 440px;
    margin-top: 100px;
    padding-top: 0;
}

#myth-3 .screen-5 h2 {
    background: url("../img/titles/titles.png") no-repeat scroll 0 -585px transparent;
    margin: 1em auto -0.8em;
    position: relative;
    width: 600px;
}

#myth-1 .screen-7 .content {
    height: 330px;
    margin-top: 130px;
    padding-top: 30px;
}

#myth-0 .screen-4 .content, #myth-0 .screen-4-1 .content {
    height: 390px;
    margin-top: 130px;
}

#myth-2 .screen-7 .content, #myth-2 .screen-4 .content {
    height: 380px;
    margin-top: 130px;
}

/* ! ------------------------------------------------------------------ */
/* ! Conclusion */

#conclusion h1 {
	display: none
}

/* screen 0 */
#conclusion .screen-0 {
	height: 458px
}
#conclusion .screen-0 .content {
	padding: 80px 140px;
	margin-top: 100px;
}
#conclusion .screen-0 .content p {
	margin-bottom: 20px
}

/* screen 1 */
#conclusion .screen-1 {
	height: 488px
}
.lt-ie9 #conclusion .screen-1 {
	height: 530px
}
#conclusion .screen-1 h2 {
	width: 230px
}
#conclusion .screen-1 h2 span {
	background-position: 20px -380px
}

/* screen 2 */
#conclusion .screen-2 {
	width: 890px;
}
#conclusion .screen-2 .content {
	padding: 50px 120px 40px 140px;
	margin-top: 60px;
}
#conclusion .screen-2 ul {
	list-style: none;
	padding: 0;
	margin: 10px 0px 0px;
}
#conclusion .screen-2 li {
	margin: 0px 0px 6px;
}
#conclusion .screen-2 a {
	text-decoration: none;
	color: #0A91B1
}
#conclusion .screen-2 a:hover {
	text-decoration: underline
}
#conclusion .screen-2 h2 {
	background: url(../img/titles/titles.png) 0px -690px no-repeat
}
#conclusion .screen-2 .content p:last-child {
	margin-top: 40px
}
#conclusion .screen-2 .col-1 {
	float: left;
	padding-left: 140px;
	margin-top: 20px;
	font-size: 90%;
	line-height: 1.25
}
.lt-ie9 #conclusion .screen-2 .col-1 {
	margin-top: 0px;
}
#conclusion .screen-2 .col-1 .button-holder {
	float: left
}
#conclusion .screen-2 .col-1 .label {
	float: left;
	margin-left: 25px;
	width: 250px;
	display: block
}
#conclusion .screen-2 .right {
	float: right;
	padding-right: 80px;
	margin-top: 20px
}
.lt-ie9 #conclusion .screen-2 .right {
	margin-top: 0px;
}

#conclusion-continue-text {
	display:none;
	width: 300px;
	float: left;
	margin-top: 20px;
}
#conclusion #conclusion-continue-holder {
	display:none;
	margin-top: 25px;
	padding-right: 0px
}
.lt-ie9 #conclusion #conclusion-continue-text {
	margin-top: 20px;
}
.lt-ie9 #conclusion #conclusion-continue-holder {
	margin-top: 5px;
}


/* screen 3 */
#conclusion .screen-3 .content {
	padding: 50px 0px 120px 50px;
	margin-top: 20px;
	height: 308px;
}
#conclusion .screen-3 ul {
	padding: 0;
	margin: 10px 0px 0px;
	font-size: 90%
}
#conclusion .screen-3 li {
	margin: 0px 0px 6px;
}
#conclusion .screen-3 h2 {
	font-size: 90%
}
#conclusion .screen-3 .labels {
	font-size: 80%;
	color: #666;
	margin: 70px 0 10px 470px;
}
#conclusion .screen-3 .labels p {
	float: left;
	width: 120px;
	-webkit-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	-ms-transform: rotate(-30deg);
	transform: rotate(-30deg);
	-webkit-transform-origin: 0%;
	-moz-transform-origin: 0%;
	-o-transform-origin: 0%;
	-ms-transform-origin: 0%;
	transform-origin: 0%;
	margin-left: -50px;
}
.lt-ie9 #conclusion .screen-3 .labels {
	background: url(../img/conclusion/labels.png) no-repeat;
	text-indent: -999em; overflow: hidden; text-align: left; direction: ltr; *line-height: 0;
	margin: 0px 0px 10px 420px;
	min-height: 80px;
}
#likert-form .question p {
	float: left;
	text-align: right;
	width: 400px;
	padding-right: 20px;
}
#likert-form label {
	display: block;
	cursor: pointer;
	height: 26px;
	max-height: 26px;
	background: url(../img/forms/checkbox.png) no-repeat 0px 0px;
	padding: 4px 0px 0px 30px;
	clear: both;
	font-size: 80%;
	float: left;
	clear: none;
	margin-left: -30px;
	margin-bottom: 26px;
	margin-right: 40px;
	width: 0px;
	overflow: hidden;
}
#likert-form input {
	float: left;
	clear: none;
	/*margin-left: -150px;*/
	border: 0px !important;
	width: 30px;
	height: 30px;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
}
#likert-form {
	width: 820px;
	clear: both
}
#likert-form .button-holder {
	float: right;
	margin: 10px 114px 0 0;
}

#survey-link {
	margin-top: 60px;
	font-size: 90%;
}
#survey-link p:first-child {
	width: 400px;
	float: left;
}
#survey-link .button-holder {
	float: right;
	margin-right: 50px;
}




/* ! ------------------------------------------------------------------ */
/* ! Scrollbar  68 x 685 */

#scrollbar {
	display: none;
	height: 653px;
	width: 68px;
	float: right;
	margin-top: -65px;
	position: relative;
	background: #A5A3A4 url('../img/scrollbar/scroll-top.png') no-repeat 0px 0px;
}
#scrollbar-track {
	height: 440px;
	width: 20px;
	left: 24px;
	top: 100px;
	position: absolute;
	background: #F9B026
}
.scrollbar-track-btn {
	height: 22px;
	width: 100%;
	position: absolute;
	cursor: pointer;
	background: url('../img/scrollbar/notches.png') no-repeat 1px 0px;
}
.scrollbar-track-btn:hover,
.scrollbar-track-btn:focus {
	background-position: 1px -22px;
}
.scrollbar-track-btn.inactive {
	background-position: 1px -44px;
	cursor: default;
}
#scrollbar-thumb {
	position: absolute;
	width: 52px;
	height: 52px;
	left: 6px;
	top: 65px;
	cursor: pointer;
	background: url('../img/scrollbar/sprites.png') no-repeat 0px 0px;
}
#scrollbar-thumb:hover {
	background-position: -52px 0px;
}
#scrollbar-thumb:active {
	background-position: -104px 0px;
}
#scrollbar-btn-up,
#scrollbar-btn-down {
	height: 51px;
	width: 48px;
	bottom: 63px;
	left: 9px;
	position: absolute;
	cursor: pointer;
	background: url('../img/scrollbar/btns.png') no-repeat 0px 0px;
}
#scrollbar-btn-down {
	background-position: 0px -53px;
	bottom: 10px
}
#scrollbar-btn-up:hover,
#scrollbar-btn-up:focus {
	background-position: -48px 0px;
}
#scrollbar-btn-down:hover,
#scrollbar-btn-down:focus {
	background-position: -48px -53px;
}
#scrollbar-btn-up:active {
	background-position: -96px 0px;
}
#scrollbar-btn-down:active {
	background-position: -96px -53px;
}
#scrollbar-btn-up.inactive {
	background-position: -144px 0px;
	cursor: default;
}
#scrollbar-btn-down.inactive {
	background-position: -144px -51px;
	cursor: default;
}
#scrollbar-btn-home {
	height: 52px;
	width: 52px;
	top: 10px;
	left: 6px;
	position: absolute;
	cursor: pointer;
	background: url('../img/scrollbar/sprites.png') no-repeat 0px -52px;
}
#scrollbar-btn-home:hover,
#scrollbar-btn-home:focus {
	background-position: -52px -52px;
}
#scrollbar-btn-home:active {
	background-position: -104px -52px;
}
#scrollbar-overlay { /* 66 * 595 */
	background: url('../img/scrollbar/track.png') no-repeat;
	height: 573px;
	width: 100%;
	position: absolute;
	top: 80px;
	left: 0px;
	pointer-events: none;
}



/* ! ------------------------------------------------------------------ */
/* ! Buttons styles */


.button-holder { /* set on parent element to create a new stacking context */
	z-index: 0;
	position: relative;
}
.button-holder.left {
	float: left
}
.button-holder.right {
	float: right
}

a.button {
	display: block
}


button, a.button {
	height: 54px;
	-webkit-border-radius: 32px;
	-moz-border-radius: 32px;
	border-radius: 32px;
	color: #FFF;
	text-indent: -999em;
	border: none;
	background: -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}

button:before,
button:after,
a.button:before,
a.button:after {
	content: "";
	position: absolute;
	-webkit-border-radius: 32px;
	-moz-border-radius: 32px;
	border-radius: 32px;
}

a.button:before,
button:before {
	top: -2px;
	bottom: -2px;
	left: -2px;
	z-index: -10;
	background: -webkit-linear-gradient(top, #60d2ef 0%, #006298 100%);
	background: -moz-linear-gradient(top, #60d2ef 0%, #006298 100%);
	background: -o-linear-gradient(top, #60d2ef 0%, #006298 100%);
	background: -ms-linear-gradient(top, #60d2ef 0%, #006298 100%);
	background: linear-gradient(top, #60d2ef 0%, #006298 100%);
}

a.button:after,
button:after {
	top: -4px;
	bottom: -4px;
	left: -4px;
	z-index: -11;
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(255,255,255,0.5) 100%);
	background: -moz-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(255,255,255,0.5) 100%);
	background: -o-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(255,255,255,0.5) 100%);
	background: -ms-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(255,255,255,0.5) 100%);
	background: linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(255,255,255,0.5) 100%);
}

a.button.hover:before,
a.button:focus:before,
button.hover:before,
button:focus:before {
	background: #006a9a;
}

a.button.inactive,
button.inactive {
	background: -webkit-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: -moz-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: -o-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: -ms-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
}
a.button.inactive:before,
button.inactive:before {
	background: -webkit-linear-gradient(top, #dddddd 0%, #888888 100%);
	background: -moz-linear-gradient(top, #dddddd 0%, #888888 100%);
	background: -o-linear-gradient(top, #dddddd 0%, #888888 100%);
	background: -ms-linear-gradient(top, #dddddd 0%, #888888 100%);
	background: linear-gradient(top, #dddddd 0%, #888888 100%);
}

a.button.selected,
button.selected {
	background: -webkit-linear-gradient(top, #2d2d2d 0%,#4c4c4c 100%);
	background: -moz-linear-gradient(top, #2d2d2d 0%,#4c4c4c 100%);
	background: -o-linear-gradient(top, #2d2d2d 0%,#4c4c4c 100%);
	background: -ms-linear-gradient(top, #2d2d2d 0%,#4c4c4c 100%);
	background: linear-gradient(top, #2d2d2d 0%,#4c4c4c 100%);
}
a.button.selected:before,
button.selected:before {
	background: -webkit-linear-gradient(top, #4c4c4c 0%,#2d2d2d 100%);
	background: -moz-linear-gradient(top, #4c4c4c 0%,#2d2d2d 100%);
	background: -o-linear-gradient(top, #4c4c4c 0%,#2d2d2d 100%);
	background: -ms-linear-gradient(top, #4c4c4c 0%,#2d2d2d 100%);
	background: linear-gradient(top, #4c4c4c 0%,#2d2d2d 100%);
}


/* Use images for < IE 10.  */
.lt-ie10 a.button,
.lt-ie10 button {
	border-radius: none;
	height: 62px;
	text-indent: 0;
	background-repeat: none;
}
.lt-ie10 a.button.inactive,
.lt-ie10 button.inactive {
	/*background-position-y: -300px*/
}
.lt-ie10 a.button.hover, .lt-ie10 a.button:focus,
.lt-ie10 button.hover, .lt-ie10 button:focus {
	background-color: transparent !important;
}
.lt-ie10 a.button.large.hover, .lt-ie10 a.button.large:focus,
.lt-ie10 button.large.hover, .lt-ie10 button.large:focus {
	background-color: transparent !important;
	background-position: 0px -100px
}
.lt-ie10 a.button.medium.hover, .lt-ie10 a.button.medium:focus,
.lt-ie10 button.medium.hover, .lt-ie10 button.medium:focus {
	background-color: transparent !important;
	background-image: url(../img/buttons/buttons.png) !important;
	background-position: -400px -100px;
}
.lt-ie10 a.button.small.hover, .lt-ie10 a.button.small:focus,
.lt-ie10 button.small.hover, .lt-ie10 button.small:focus {
	background-color: transparent !important;
	background-position: -700px -100px
}
.lt-ie10 a.button.round.hover, .lt-ie10 a.button.round:focus,
.lt-ie10 button.round.hover, .lt-ie10 button.round:focus {
	background-color: transparent !important;
	background-position: -1100px -100px
}
.lt-ie10 a.button.round-small.hover, .lt-ie10 a.button.round-small:focus,
.lt-ie10 button.round-small.hover, .lt-ie10 button.round-small:focus {
	background-color: transparent !important;
	background-position: -1200px -100px
}
.lt-ie10 a.button.thin-small.hover, .lt-ie10 a.button.thin-small:focus,
.lt-ie10 button.thin-small.hover, .lt-ie10 button.thin-small:focus {
	background-color: transparent !important;
	background-position: -900px -100px
}
.lt-ie10 a.button:before, .lt-ie10 a.button:after,
.lt-ie10 a.button.hover:before,
.lt-ie10 a.button:focus:before,
.lt-ie10 a.button:active:before,
.lt-ie10 button:before, .lt-ie10 button:after,
.lt-ie10 button.hover:before,
.lt-ie10 button:focus:before,
.lt-ie10 button:active:before {
	display: none
}
.lt-ie10 a.button span,
.lt-ie10 button span {
	text-indent: -999em;
	width: 100%;
	height: 50px; /* 100% */
	display: block;
}
.lt-ie10 a.button.large,
.lt-ie10 button.large {
	width: 353px;
	background-color: transparent !important;
	background-image: url(../img/buttons/buttons.png) !important;
	background-position: 0px 0px;
}
.lt-ie10 a.button.medium,
.lt-ie10 button.medium {
	width: 250px;
	background-color: transparent !important;
	background-image: url(../img/buttons/buttons.png) !important;
	background-position: -400px 0px;
}
.lt-ie10 a.button.small,
.lt-ie10 button.small {
	width: 128px;
	background-color: transparent !important;
	background-image: url(../img/buttons/buttons.png) !important;
	background-position: -700px 0px;
}
.lt-ie10 a.button.small.inactive,
.lt-ie10 button.small.inactive {
	background-position: -700px -300px;
}
.lt-ie10 a.button.round,
.lt-ie10 button.round {
	width: 62px;
	height: 62px;
	background-color: transparent !important;
	background-image: url(../img/buttons/buttons.png) !important;
	background-position: -1100px 0px;
}
.lt-ie10 a.button.round-small,
.lt-ie10 button.round-small {
	width: 34px;
	height: 34px;
	background-color: transparent !important;
	background-image: url(../img/buttons/buttons.png) !important;
	background-position: -1200px 0px
}
.lt-ie10 a.button.thin-small,
.lt-ie10 button.thin-small {
	width: 98px;
	height: 43px;
	background-color: transparent !important;
	background-image: url(../img/buttons/buttons.png) !important;
	background-position: -900px 0px
}

/* Next button */
button.next {
	width: 228px;
	background: url(../img/buttons/sprites.png) center -216px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -216px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -216px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -216px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -216px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.next:before {
	width: 232px;
}
button.next:after {
	width: 236px;
}
button.next.hover, button.next:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -270px no-repeat;
}
.lt-ie10 button.next span {
	background: url(../img/buttons/sprites.png) center -216px no-repeat
}
.lt-ie10 button.next.hover span,
.lt-ie10 button.next:focus span {
	background-position: center -270px
}

/* Main menu button */
button.main-menu {
	width: 242px;
	background: url(../img/buttons/sprites.png) center -108px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -108px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -108px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -108px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -108px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.main-menu:before {
	width: 246px;
}
button.main-menu:after {
	width: 250px;
}
button.main-menu.hover, button.main-menu:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -161px no-repeat;
}
.lt-ie10 button.main-menu span {
	background: url(../img/buttons/sprites.png) center -108px no-repeat
}
.lt-ie10 button.main-menu.hover span,
.lt-ie10 button.main-menu:focus span,
.lt-ie10 button.main-menu:active span {
	background-position: center -161px
}

/* PDF button */
a.button.pdf {
	width: 54px;
	height: 54px;
	background: url(../img/buttons/pdf.png) center -29px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/pdf.png) center -29px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/pdf.png) center -29px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/pdf.png) center -29px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/pdf.png) center -29px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
a.button.pdf:before {
	width: 58px;
	height: 58px;
}
a.button.pdf:after {
	width: 62px;
	height: 62px;
}
a.button.pdf.hover, a.button.pdf:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/pdf.png) center 15px no-repeat;
}
.lt-ie10 a.button.pdf span {
	background: url(../img/buttons/pdf.png) center -24px no-repeat
}
.lt-ie10 a.button.pdf.hover span,
.lt-ie10 a.button.pdf:focus span {
	background-position: center 20px
}

/* begin button */
button.begin {
	width: 228px;
	background: url(../img/buttons/sprites.png) center -324px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -324px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -324px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -324px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -324px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.begin:before {
	width: 232px;
	height: 58px
}
button.begin:after {
	width: 236px;
	height: 62px
}
button.begin.hover, button.begin:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -378px no-repeat;
}
.lt-ie10 button.begin span {
	background: url(../img/buttons/sprites.png) center -324px no-repeat
}
.lt-ie10 button.begin.hover span,
.lt-ie10 button.begin:focus span {
	background: url(../img/buttons/sprites.png) center -378px no-repeat
}

/* OK button */
button.ok {
	width: 120px;
	background: url(../img/buttons/sprites.png) center -1px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.ok:before {
	width: 124px;
}
button.ok:after {
	width: 128px;
}
button.ok.hover, button.ok:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -54px no-repeat;
}
button.ok.inactive {
	background: url(../img/buttons/sprites.png) center -1px no-repeat, -webkit-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -1px no-repeat, -moz-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -1px no-repeat, -o-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -1px no-repeat, -ms-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -1px no-repeat, linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
}
button.ok.inactive:before {
	background: -webkit-linear-gradient(top, #dddddd 0%, #888888 100%);
	background: -moz-linear-gradient(top, #dddddd 0%, #888888 100%);
	background: -o-linear-gradient(top, #dddddd 0%, #888888 100%);
	background: -ms-linear-gradient(top, #dddddd 0%, #888888 100%);
	background: linear-gradient(top, #dddddd 0%, #888888 100%);
}
.lt-ie10 button.ok span {
	background: url(../img/buttons/sprites.png) center 2px no-repeat
}
.lt-ie10 button.ok.inactive.hover span {
	background-position: center 2px
}
.lt-ie10 button.ok.hover span,
.lt-ie10 button.ok:focus span {
	background-position: center -52px
}

/* find-out-more button */
button.find-out-more {
	width: 242px;
	background: url(../img/buttons/sprites.png) center -756px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -756px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -756px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -756px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -756px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.find-out-more:before {
	width: 246px;
	height: 58px
}
button.find-out-more:after {
	width: 250px;
	height: 62px
}
button.find-out-more.hover, button.find-out-more:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -810px no-repeat;
}
.lt-ie10 button.find-out-more span {
	background: url(../img/buttons/sprites.png) center -756px no-repeat
}
.lt-ie10 button.find-out-more.hover span,
.lt-ie10 button.find-out-more:focus span {
	background-position: center -810px
}

/* info button */
button.info {
	width: 26px;
	height: 26px;
	background: url(../img/buttons/sprites.png) center -987px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -987px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -987px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -987px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -987px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.info:after {
	width: 34px;
	height: 34px
}
button.info:before {
	width: 30px;
	height: 30px
}
button.info.hover, button.info:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -987px no-repeat;
}
.lt-ie10 button.info span,
.lt-ie10 button.info.hover span,
.lt-ie10 button.info:focus span {
	background: url(../img/buttons/sprites.png) center -987px no-repeat;
}

button.info.visited {
	background: #50145F url(../img/buttons/sprites.png) center -987px no-repeat;
}
button.info.visited:before {
	background: -webkit-linear-gradient(top, #AA27CB 0%, #2F0B38 100%);
	background: -moz-linear-gradient(top, #AA27CB 0%, #2F0B38 100%);
	background: -o-linear-gradient(top, #AA27CB 0%, #2F0B38 100%);
	background: -ms-linear-gradient(top, #AA27CB 0%, #2F0B38 100%);
	background: linear-gradient(top, #AA27CB 0%, #2F0B38 100%);
}
.lt-ie10 button.info.visited:before {
	display: none
}
.lt-ie10 a.button.round-small.visited, .lt-ie10 button.round-small.visited,
.lt-ie10 a.button.round-small.hover.visited, .lt-ie10 a.button.round-small.visited:focus,
.lt-ie10 button.round-small.hover.visited, .lt-ie10 button.round-small.visited:focus {
	background-color: transparent !important;
	background-position: -1200px -200px
}



/* back button */
#conclusion button.back {
	width:226px;
}
#conclusion button.back:after {
	width:234px;
}
#conclusion button.back:before {
	width:230px;
}

button.back {
	width: 146px;
	background: url(../img/buttons/sprites.png) center -864px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -864px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -864px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -864px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -864px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.back:after {
	width: 154px;
	height: 62px
}
button.back:before {
	width: 150px;
	height: 58px
}
button.back.hover, button.back:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -918px no-repeat;
}
button.back.back-up.hover, button.back.back-up:focus {
	background: #006a9a url(../img/buttons/sprites.png) center -1570px no-repeat;
}

.lt-ie10 button.back span,
.lt-ie10 button.back.back-up span {
	background: url(../img/buttons/sprites.png) center -864px no-repeat;
}
.lt-ie10 button.back.hover span,
.lt-ie10 button.back:focus span {
	background-position: center -918px;
}

.lt-ie10 button.back.back-up.hover span,
.lt-ie10 button.back.back-up:focus span {
	background-image: url(../img/buttons/sprites.png);
	background-position: center -1570px;
}

.lt-ie10 button.back.back-up.hover,
.lt-ie10 button.back.back-up:focus {
	background-position: -400px -100px;
}


/* transcript button */
a.button.transcript {
	width: 40px;
	height: 40px;
	background: url(../img/buttons/transcript.png) center center no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/transcript.png) center center no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/transcript.png) center center no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/transcript.png) center center no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/transcript.png) center center no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
a.button.transcript:before {
	width: 44px;
	height: 44px;
}
a.button.transcript:after {
	width: 48px;
	height: 48px;
}
a.button.transcript.hover, a.button.transcript:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/transcript.png) center center no-repeat;
}
.lt-ie10 a.button.transcript span {
	background: url(../img/buttons/transcript.png) center center no-repeat
}
.lt-ie10 a.button.transcript.hover span,
.lt-ie10 a.button.transcript:focus span {
	background-position: center center
}

/* Why? button */
button.why {
	width: 90px;
	height: 35px;
	background: url(../img/buttons/why.png) center center no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/why.png) center center no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/why.png) center center no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/why.png) center center no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/why.png) center center no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.why:before {
	width: 94px;
	height: 39px;
}
button.why:after {
	width: 98px;
	height: 43px;
}
button.why.hover,
button.why:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/why.png) center center no-repeat;
}
.lt-ie10 button.why span {
	background: url(../img/buttons/why.png) center center no-repeat
}
.lt-ie10 button.why.hover span,
.lt-ie10 button.why:focus span {
	background-position: center center
}

/* Continue button */
button.continue {
	width: 240px;
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.continue:after {
	width: 248px;
	height: 62px
}
button.continue:before {
	width: 244px;
	height: 58px
}
button.continue.hover, button.continue:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -1080px no-repeat;
}
.lt-ie10 button.continue span, .lt-ie10 button.continue.inactive span {
	background: url(../img/buttons/sprites.png) center -1026px no-repeat
}
.lt-ie10 button.continue.hover span, .lt-ie10 button.continue.inactive.hover span, .lt-ie10 button.continue:focus span {
	background-position: center -1080px
}

/* End section button
button.end-section {
	width: 240px;
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1026px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.end-section:after {
	width: 248px;
	height: 62px
}
button.end-section:before {
	width: 244px;
	height: 58px
}
button.end-section.hover, button.end-section:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -1080px no-repeat;
}
.lt-ie10 button.end-section span, .lt-ie10 button.end-section.inactive span {
	background: url(../img/buttons/sprites.png) center -1026px no-repeat
}
.lt-ie10 button.end-section.hover span, .lt-ie10 button.end-section.inactive.hover span, .lt-ie10 button.end-section:focus span {
	background-position: center -1080px
}*/

/* try-another-option button */
button.try-another-option {
	width: 300px;
	background: url(../img/buttons/sprites.png) center -1134px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1134px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1134px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1134px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1134px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.try-another-option:after {
	width: 308px;
	height: 62px
}
button.try-another-option:before {
	width: 304px;
	height: 58px
}
button.try-another-option.hover, button.try-another-option:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -1188px no-repeat;
}
.lt-ie10 button.try-another-option span, .lt-ie10 button.try-another-option.inactive span {
	background: url(../img/buttons/sprites.png) center -1134px no-repeat
}
.lt-ie10 button.try-another-option.hover span, .lt-ie10 button.try-another-option:focus span {
	background-position: center -1188px
}

/* try-another-option2 button */
button.try-another-option2 {
	width: 300px;
	background: url(../img/buttons/sprites.png) center -432px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -432px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -432px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -432px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -432px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.try-another-option2:after {
	width: 308px;
	height: 62px
}
button.try-another-option2:before {
	width: 304px;
	height: 58px
}
button.try-another-option2.hover, button.try-another-option2:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -486px no-repeat;
}
.lt-ie10 button.try-another-option2 span, .lt-ie10 button.try-another-option2.inactive span {
	background: url(../img/buttons/sprites.png) center -432px no-repeat
}
.lt-ie10 button.try-another-option2.hover span, .lt-ie10 button.try-another-option2:focus span {
	background-position: center -486px
}

/* Submit button */
button.submit {
	width: 246px;
	background: url(../img/buttons/sprites.png) center -1350px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1350px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1350px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1350px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1350px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.submit:after {
	width: 254px;
	height: 62px
}
button.submit:before {
	width: 250px;
	height: 58px
}
button.submit.hover, submit:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -1404px no-repeat;
}
.lt-ie10 button.submit span, .lt-ie10 button.submit.inactive span {
	background: url(../img/buttons/sprites.png) center -1350px no-repeat
}
.lt-ie10 button.submit.hover span, .lt-ie10 button.submit:focus span {
	background-position: center -1404px
}

/* Survey button */
.button.survey, button.survey {
	width: 246px;

	background: url(../img/buttons/sprites.png) center -1458px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1458px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1458px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1458px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1458px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
.button.survey:after {
	width: 254px;
	height: 62px
}
.button.survey:before {
	width: 250px;
	height: 58px
}
.button.survey.hover, .button.survey:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -1512px no-repeat;
}
.lt-ie10 .button.survey span, .lt-ie10 .button.survey.inactive span {
	background: url(../img/buttons/sprites.png) center -1458px no-repeat
}
.lt-ie10 .button.survey.hover span, .lt-ie10 .button.survey:focus span {
	background-position: center -1512px
}

/* Conclusion button */
button.conclusion {
	width: 246px;
	background: url(../img/buttons/sprites.png) center -1242px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1242px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1242px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1242px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -1242px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.conclusion:after {
	width: 254px;
	height: 62px
}
button.conclusion:before {
	width: 250px;
	height: 58px
}
button.conclusion.hover, button.conclusion:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -1296px no-repeat;
}
.lt-ie10 button.conclusion span, .lt-ie10 button.conclusion.inactive span {
	background: url(../img/buttons/sprites.png) center -1242px no-repeat
}
.lt-ie10 button.conclusion.hover span, .lt-ie10 button.conclusion:focus span {
	background-position: center -1296px
}

/* Help button */
button.help {
	width: 228px;
	background: url(../img/buttons/sprites.png) center -432px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -432px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -432px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -432px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -432px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.help:before {
	width: 232px;
	height: 58px;
}
button.help:after {
	width: 236px;
	height: 62px;
}
button.help.hover, button.help:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -486px no-repeat;
}
.lt-ie10 button.help span, .lt-ie10 button.help.inactive span {
	background: url(../img/buttons/sprites.png) center -432px no-repeat
}
.lt-ie10 button.help.hover span, .lt-ie10 button.help:focus span {
	background-position: center -486px
}

/* yes button */
button.yes {
	width: 136px;
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.yes:before {
	width: 140px;
	height: 58px
}
button.yes:after {
	width: 144px;
	height: 62px
}
button.yes.hover, button.yes:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -594px no-repeat;
}
button.yes.selected {
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -webkit-linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -moz-linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat,  -o-linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -ms-linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
}
button.yes.inactive {
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -webkit-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -moz-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -o-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, -ms-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -540px no-repeat, linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
}
.lt-ie10 button.yes span, .lt-ie10 button.yes.inactive span {
	background: url(../img/buttons/sprites.png) center -540px no-repeat
}
.lt-ie10 button.yes.hover span, .lt-ie10 button.yes:focus span {
	background-position: center -594px
}
.lt-ie10 button.yes.selected,
.lt-ie10 button.no.selected {
	background: url(../img/buttons/selected-ie.png) no-repeat !important
}

/* no button */
button.no {
	width: 136px;
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -webkit-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -moz-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -o-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -ms-linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, linear-gradient(top, #00ade1 0%, #0088ca 76%, #00a2d9 100%);
}
button.no:before {
	width: 140px;
	height: 58px
}
button.no:after {
	width: 144px;
	height: 62px
}
button.no.hover, button.no:focus {
	box-shadow: inset 0 0 6px #004564;
	background: #006a9a url(../img/buttons/sprites.png) center -702px no-repeat;
}
button.no.inactive {
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -webkit-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -moz-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -o-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -ms-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
}
button.no.selected {
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -webkit-linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -moz-linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat,  -o-linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, -ms-linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
	background: url(../img/buttons/sprites.png) center -648px no-repeat, linear-gradient(top, #2d2d2d 0%, #4c4c4c 100%);
}
.lt-ie10 button.no span, .lt-ie10 button.no.inactive span {
	background: url(../img/buttons/sprites.png) center -648px no-repeat
}
.lt-ie10 button.no.hover span, .lt-ie10 button.no:focus span {
	background-position: center -702px
}











/* ! ------------------------------------------------------------------ */
/* ! Bullet arrow */

.bullet-arrow {
	background-image: -webkit-gradient(linear, center top, center bottom, from(rgba(0,0,0,0.5)), to(rgba(255,255,255,0.5)));
	background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.5), rgba(255,255,255,0.5));
	background-image: -moz-linear-gradient(top, rgba(0,0,0,0.5), rgba(255,255,255,0.5));
	background-image: -o-linear-gradient(top, rgba(0,0,0,0.5), rgba(255,255,255,0.5));
	background-image: -ms-linear-gradient(top, rgba(0,0,0,0.5), rgba(255,255,255,0.5));
	background-image: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(255,255,255,0.5));
	border-radius: 50%;
	position: relative;
	height: 38px;
	width: 38px
}

.bullet-arrow .circle {
	border-radius: 50%;
	background-image: -webkit-gradient(linear, center top, center bottom, from(#00bcf5), to(#006682));
	background-image: -webkit-linear-gradient(top, #00bcf5, #006682);
	background-image: -moz-linear-gradient(top, #00bcf5, #006682);
	background-image: -o-linear-gradient(top, #00bcf5, #006682);
	background-image: -ms-linear-gradient(top, #00bcf5, #006682);
	background-image: linear-gradient(to bottom, #00bcf5, #006682);
	box-shadow: 0 0 0 2px rgba(255,255,255,0.5);
	height: 30px;
	width: 30px;
	top: 4px;
	left: 4px;
	position: absolute
}
.bullet-arrow canvas,
.bullet-arrow .nocanvas {
	top: 7px;
	left: 10px;
	position: absolute
}
.no-canvas .bullet-arrow-holder {
	background: url(../img/misc/arrow-small.png) no-repeat
}

.inactive .bullet-arrow .circle {
	background: -webkit-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: -moz-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: -o-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: -ms-linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
	background: linear-gradient(top, #c8c8c8 0%, #aaaaaa 76%, #c0c0c0 100%);
}



/*
.bullet-arrow .triangle {

	width: 0;
	height: 0;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	border-left: 10px solid white;
	top: 6px;
	left: 12px;
	position: absolute

}
*/


/* ! ------------------------------------------------------------------ */
/* ! Transcripts */

.transcript-text {
	padding:40px 0px;
	margin: 0px 40px 40px 100px;
}
.transcript-text p {
	width: 500px;
	font-size: 130%;
	margin-bottom: 40px
}
.transcript-text h1 {
	margin-bottom: 20px
}
.transcript-text h2 {
	margin-bottom: 20px
}


/* ! ------------------------------------------------------------------ */
/* ! Dot Animations */

@-moz-keyframes bullet-in {
	from {
		-moz-transform: scale(0);
		transform: scale(0);
		-moz-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	to {
		-moz-transform: scale(1);
		transform: scale(1);
		-moz-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@-webkit-keyframes bullet-in {
 	from {
		-webkit-transform: scale(0);
		transform: scale(0);
	 	-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	to {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@-ms-keyframes bullet-in {
	from {
		-ms-transform: scale(0);
		transform: scale(0);
		-ms-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	to {
		-ms-transform: scale(1);
		transform: scale(1);
		-ms-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@-o-keyframes bullet-in {
	from {
		-o-transform: scale(0);
		transform: scale(0);
		-o-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	to {
		-o-transform: scale(1);
		transform: scale(1);
		-o-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@keyframes bullet-in {
	from {
		-webkit-transform: scale(0);
		-moz-transform: scale(0);
		-o-transform: scale(0);
		-ms-transform: scale(0);
		transform: scale(0);
		-webkit-animation-timing-function: ease-out;
		-moz-animation-timing-function: ease-out;
		-ms-animation-timing-function: ease-out;
		-o-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	to {
		-webkit-transform: scale(1);
		-moz-transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		transform: scale(1);
		-webkit-animation-timing-function: ease-out;
		-moz-animation-timing-function: ease-out;
		-ms-animation-timing-function: ease-out;
		-o-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@-moz-keyframes bullet-in-big {
	 0% {
		-moz-transform: scale(0);
		transform: scale(0);
		-moz-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	 }
	 80% {
		-moz-transform: scale(1.2);
		transform: scale(1.2);
		-moz-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	 }
	 100% {
		-moz-transform: scale(1);
		transform: scale(1);
		-moz-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	 }
}

@-webkit-keyframes bullet-in-big {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	80% {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@-ms-keyframes bullet-in-big {
	0% {
		-ms-transform: scale(0);
		transform: scale(0);
		-ms-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	80% {
		-ms-transform: scale(1.2);
		transform: scale(1.2);
		-ms-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-ms-transform: scale(1);
		transform: scale(1);
		-ms-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@-o-keyframes bullet-in-big {
	0% {
		-o-transform: scale(0);
		transform: scale(0);
		-o-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	80% {
		-o-transform: scale(1.2);
		transform: scale(1.2);
		-o-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
	100% {
		-o-transform: scale(1);
		transform: scale(1);
		-o-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@keyframes bullet-in-big {
	0% {
		-webkit-transform: scale(0);
	   	-moz-transform: scale(0);
	   	-o-transform: scale(0);
	   	-ms-transform: scale(0);
	   	transform: scale(0);
	   	-webkit-animation-timing-function: ease-out;
	   	-moz-animation-timing-function: ease-out;
	   	-ms-animation-timing-function: ease-out;
	   	-o-animation-timing-function: ease-out;
	   	animation-timing-function: ease-out;
	}
	80% {
	    -webkit-transform: scale(1.2);
	   	-moz-transform: scale(1.2);
	   	-o-transform: scale(1.2);
	   	-ms-transform: scale(1.2);
	   	transform: scale(1.2);
	   	-webkit-animation-timing-function: ease-out;
	   	-moz-animation-timing-function: ease-out;
	   	-ms-animation-timing-function: ease-out;
	   	-o-animation-timing-function: ease-out;
	   	animation-timing-function: ease-out;
	}
	100% {
	    -webkit-transform: scale(1);
	   	-moz-transform: scale(1);
	   	-o-transform: scale(1);
	   	-ms-transform: scale(1);
	   	transform: scale(1);
	   	-webkit-animation-timing-function: ease-out;
	   	-moz-animation-timing-function: ease-out;
	   	-ms-animation-timing-function: ease-out;
	   	-o-animation-timing-function: ease-out;
	   	animation-timing-function: ease-out;
	}
}

.dot, .dot-big {

	background: #555;
	border-radius: 50%;
	box-shadow: 0 3px 0px 0px rgba(0, 0, 0, 0.25);

	width: 12px;
	height: 12px;

	position: absolute;

	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-o-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	transform-origin: 50% 50%;

	-webkit-animation-name: bullet-in;
	-moz-animation-name: bullet-in;
	-ms-animation-name: bullet-in;
	-o-animation-name: bullet-in;
	animation-name: bullet-in;

	-webkit-animation-duration: 0.25s;
	-moz-animation-duration: 0.25s;
	-ms-animation-duration: 0.25s;
	-o-animation-duration: 0.25s;

	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

}

.dot-big {

	width: 30px;
	height: 30px;
	margin: -15px 0px 0px 0px;

	-webkit-animation-duration: 0.5s;
	-moz-animation-duration: 0.5s;
	-ms-animation-duration: 0.5s;
	-o-animation-duration: 0.5s;

	-webkit-animation-name: bullet-in-big;
	-moz-animation-name: bullet-in-big;
	-ms-animation-name: bullet-in-big;
	-o-animation-name: bullet-in-big;
	animation-name: bullet-in-big;

}

.dot.greyed.left {
    margin-left: 28px;
	
	-webkit-animation-duration: 0.05s;
	-moz-animation-duration: 0.05s;
	-ms-animation-duration: 0.05s;
	-o-animation-duration: 0.05s;
}
.dot.greyed.right {
    margin-left: 8px;
	
	-webkit-animation-duration: 0.05s;
	-moz-animation-duration: 0.05s;
	-ms-animation-duration: 0.05s;
	-o-animation-duration: 0.05s;
}
.dot.greyed.bottom {
    margin-left: 20px;
    margin-top: -10px;
	
	-webkit-animation-duration: 0.05s;
	-moz-animation-duration: 0.05s;
	-ms-animation-duration: 0.05s;
	-o-animation-duration: 0.05s;
}

.transcript-holder {
	list-style: none;
	font-size: 90%;
	padding: 0px;
	margin-top: 60px;
}
.transcript-holder p {
	float: left
}
.transcript-holder .label {
	margin-left: 15px;
	display: block;
	width: 220px;
	float: left;
	line-height: 1.2;
	padding-top: 10px;
}
.transcript-holder .button-holder {
	bottom:5px;
}
.transcript-holder .button-holder a.button span {
	height:100%;
}




/* ! ------------------------------------------------------------------ */
/* ! Media element player */

.mejs-container {
	position: relative;
	background: #000;
	font-family: Arial, sans-serif;
	text-align: left;
	vertical-align: top;
}
.me-plugin {
	position: absolute;
}
.mejs-embed, .mejs-embed body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background: #000;
	overflow: hidden;
}
.mejs-container-fullscreen {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	overflow: hidden;
	z-index: 1000;
}
.mejs-container-fullscreen .mejs-mediaelement,
.mejs-container-fullscreen video {
	width: 100%;
	height: 100%;
}

/* Start: LAYERS */
.mejs-background {
	position: absolute;
	top: 0;
	left: 0;
}
.mejs-mediaelement {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.mejs-poster {
	position: absolute;
	top: 0;
	left: 0;
}
.mejs-poster img {
	border: 0;
	padding: 0;
	border: 0;
	display: block;
}
.mejs-overlay {
	position: absolute;
	top: 0;
	left: 0;
}
.mejs-overlay-play {
	cursor: pointer;
}
.mejs-overlay-button {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100px;
	height: 100px;
	margin: -50px 0 0 -50px;
	background: url(../img/videoplayer/bigplay.png) no-repeat;
}
.mejs-overlay:hover .mejs-overlay-button {
	background-position: -100px 0;
}
.mejs-overlay-loading {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 80px;
	height: 80px;
	margin: -40px 0 0 -40px;
	background: #333;
	background: url(../img/videoplayer/background.png);
	background: rgba(0, 0, 0, 0.9);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(50,50,50,0.9)), to(rgba(0,0,0,0.9)));
	background: -webkit-linear-gradient(top, rgba(50,50,50,0.9), rgba(0,0,0,0.9));
	background: -moz-linear-gradient(top, rgba(50,50,50,0.9), rgba(0,0,0,0.9));
	background: -o-linear-gradient(top, rgba(50,50,50,0.9), rgba(0,0,0,0.9));
	background: -ms-linear-gradient(top, rgba(50,50,50,0.9), rgba(0,0,0,0.9));
	background: linear-gradient(rgba(50,50,50,0.9), rgba(0,0,0,0.9));
}
.mejs-overlay-loading span {
	display:block;
	width: 80px;
	height: 80px;
	background: transparent url(../img/videoplayer/loading.gif) 50% 50% no-repeat;
}

/* End: LAYERS */

/* Start: CONTROL BAR */

/* override */
#main .mejs-container .mejs-controls {
	bottom: -30px;
	background: #46CBF5
}
.mejs-container .mejs-controls {
	position: absolute;
	background: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	bottom: 0;
	left: 0;
	background: url(../img/videoplayer/background.png);
	background: rgba(0, 0, 0, 0.7);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(50,50,50,0.7)), to(rgba(0,0,0,0.7)));
	background: -webkit-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
	background: -moz-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
	background: -o-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
	background: -ms-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
	background: linear-gradient(rgba(50,50,50,0.7), rgba(0,0,0,0.7));
	height: 30px;
	width: 100%;
}
.mejs-container .mejs-controls  div {
	list-style-type: none;
	background-image: none;
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	width: 26px;
	height: 26px;
	font-size: 11px;
	line-height: 11px;
	background: 0;
	font-family: Helvetica, Arial;
	border: 0;
}

.mejs-controls .mejs-button button {
	cursor: pointer;
	display: block;
	font-size: 0;
	line-height: 0;
	text-decoration: none;
	margin: 7px 5px;
	padding: 0;
	position: absolute;
	height: 16px;
	width: 16px;
	border: 0;
	background: transparent url(../img/videoplayer/controls.png) no-repeat;
}

/* :focus for accessibility */
.mejs-controls .mejs-button button:focus {
	/*outline: solid 1px yellow;*/
}

/* End: CONTROL BAR */

/* Start: Time (current / duration) */
.mejs-container .mejs-controls .mejs-time {
	color: #fff;
	display: block;
	height: 17px;
	width: auto;
	padding: 8px 3px 0 3px ;
	overflow: hidden;
	text-align: center;
	padding: auto 4px;
}
.mejs-container .mejs-controls .mejs-time span {
	font-size: 11px;
	color: #fff;
	line-height: 12px;
	display: block;
	float: left;
	margin: 1px 2px 0 0;
	width: auto;
}
/* End: Time (current / duration) */


/* Start: Play/pause */
.mejs-controls .mejs-play button {
	background-position:0 0;
}
.mejs-controls .mejs-pause button {
	background-position:0 -16px;
}
/* End: Play/pause */


/* Stop */
.mejs-controls .mejs-stop button {
	background-position: -112px 0;
}
/* End: Play/pause */

/* Start: Progress bar */
.mejs-controls div.mejs-time-rail {
	width: 200px;
	padding-top: 5px;
}
.mejs-controls .mejs-time-rail span {
	display: block;
	position: absolute;
	width: 180px;
	height: 10px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	cursor: pointer;
}
.mejs-controls .mejs-time-rail .mejs-time-total {
	margin: 5px;
	background: #333;
	background: rgba(50,50,50,0.8);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(30,30,30,0.8)), to(rgba(60,60,60,0.8)));
	background: -webkit-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
	background: -moz-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
	background: -o-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
	background: -ms-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
	background: linear-gradient(rgba(30,30,30,0.8), rgba(60,60,60,0.8));
}
.mejs-controls .mejs-time-rail .mejs-time-loaded {
	background: #3caac8;
	background: rgba(60,170,200,0.8);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(44,124,145,0.8)), to(rgba(78,183,212,0.8)));
	background: -webkit-linear-gradient(top, rgba(44,124,145,0.8), rgba(78,183,212,0.8));
	background: -moz-linear-gradient(top, rgba(44,124,145,0.8), rgba(78,183,212,0.8));
	background: -o-linear-gradient(top, rgba(44,124,145,0.8), rgba(78,183,212,0.8));
	background: -ms-linear-gradient(top, rgba(44,124,145,0.8), rgba(78,183,212,0.8));
	background: linear-gradient(rgba(44,124,145,0.8), rgba(78,183,212,0.8));
	width: 0;
}
.mejs-controls .mejs-time-rail .mejs-time-current {
	width: 0;
	background: #fff;
	background: rgba(255,255,255,0.8);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.9)), to(rgba(200,200,200,0.8)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
	background: -moz-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
	background: -o-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
	background: -ms-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
	background: linear-gradient(rgba(255,255,255,0.9), rgba(200,200,200,0.8));
}
.mejs-controls .mejs-time-rail .mejs-time-handle {
	display: none;
	position: absolute;
	margin: 0;
	width: 10px;
	background: #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	cursor: pointer;
	border: solid 2px #333;
	top: -2px;
	text-align: center;
}
.mejs-controls .mejs-time-rail .mejs-time-float {
	position: absolute;
	display: none;
	background: #eee;
	width: 36px;
	height: 17px;
	border: solid 1px #333;
	top: -26px;
	margin-left: -18px;
	text-align: center;
	color: #111;
}
.mejs-controls .mejs-time-rail .mejs-time-float-current {
	margin: 2px;
	width: 30px;
	display: block;
	text-align: center;
	left: 0;
}
.mejs-controls .mejs-time-rail .mejs-time-float-corner {
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	line-height: 0;
	border: solid 5px #eee;
	border-color: #eee transparent transparent transparent;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	top: 15px;
	left: 13px;

}
/* End: Progress bar */

/* Start: Fullscreen */
.mejs-controls .mejs-fullscreen-button button {
	background-position:-32px 0;
}
.mejs-controls .mejs-unfullscreen button {
	background-position:-32px -16px;
}
/* End: Fullscreen */


/* Start: Mute/Volume */
.mejs-controls .mejs-volume-button {
}

.mejs-controls .mejs-mute button {
	background-position:-16px -16px;
}

.mejs-controls .mejs-unmute button {
	background-position:-16px 0;
}

.mejs-controls .mejs-volume-button {
	position: relative;
}
.mejs-controls .mejs-volume-button .mejs-volume-slider {
	display: none;
	height: 115px;
	width: 25px;
	background: url(../img/videoplayer/background.png);
	background: rgba(50, 50, 50, 0.7);
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	top: -115px;
	left: 0;
	z-index: 1;
	position: absolute;
	margin: 0;
}
.mejs-controls .mejs-volume-button:hover {
	-webkit-border-radius: 0 0 4px 4px;
	-moz-border-radius: 0 0 4px 4px;
	border-radius: 0 0 4px 4px;
}
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-total {
	position: absolute;
	left: 11px;
	top: 8px;
	width: 2px;
	height: 100px;
	background: #ddd;
	background: rgba(255, 255, 255, 0.5);
	margin: 0;
}
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-current {
	position: absolute;
	left: 11px;
	top: 8px;
	width: 2px;
	height: 100px;
	background: #ddd;
	background: rgba(255, 255, 255, 0.9);
	margin: 0;
}
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-handle {
	position: absolute;
	left: 4px;
	top: -3px;
	width: 16px;
	height: 6px;
	background: #ddd;
	background: rgba(255, 255, 255, 0.9);
	cursor: N-resize;
	-webkit-border-radius: 1px;
	-moz-border-radius: 1px;
	border-radius: 1px;
	margin: 0;
}


/* horizontal version */

.mejs-controls div.mejs-horizontal-volume-slider {
	height: 26px;
	width: 60px;
	position: relative;
}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
	position: absolute;
	left: 0;
	top: 11px;
	width: 50px;
	height: 8px;
	margin: 0;
	padding: 0;
	font-size: 1px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	background: #333;
	background: rgba(50,50,50,0.8);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(30,30,30,0.8)), to(rgba(60,60,60,0.8)));
	background: -webkit-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
	background: -moz-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
	background: -o-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
	background: -ms-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
	background: linear-gradient(rgba(30,30,30,0.8), rgba(60,60,60,0.8));
}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
	position: absolute;
	left: 0;
	top: 11px;
	width: 50px;
	height: 8px;
	margin: 0;
	padding: 0;
	font-size: 1px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	background: #fff;
	background: rgba(255,255,255,0.8);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.9)), to(rgba(200,200,200,0.8)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
	background: -moz-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
	background: -o-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
	background: -ms-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
	background: linear-gradient(rgba(255,255,255,0.9), rgba(200,200,200,0.8));
}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-handle {
	display: none;
}
/* End: Mute/Volume */




/* Start: TRACK (Captions and Chapters) */
.mejs-controls .mejs-captions-button {
	position: relative;
}
.mejs-controls .mejs-captions-button button {
	background-position:-48px 0;
}
.mejs-controls .mejs-captions-button .mejs-captions-selector {
	display: none
}
.mejs-captions-layer {
	position: absolute;
	bottom: 0;
	left: 0;
	text-align:center;
	line-height: 22px;
	font-size: 12px;
	color: #fff;
}
.mejs-captions-layer  a {
	color: #fff;
	text-decoration: underline;
}
.mejs-captions-layer[lang=ar] {
	font-size: 20px;
	font-weight: normal;
}
.mejs-captions-position {
	position: absolute;
	width: 100%;
	bottom: 15px;
	left: 0;
}
.mejs-captions-position-hover {
	bottom: 45px;
}
.mejs-captions-text {
	padding: 3px 5px;
	background: url(../img/videoplayer/background.png);
	background: rgba(20, 20, 20, 0.8);
	font-weight: bold;
	text-shadow: none;
	font-size: 110%;
	text-shadow: none
}
/* End: TRACK (Captions and Chapters) */



.mejs-clear {
	clear: both;
}

/* Start: ERROR */
.me-cannotplay {
}
.me-cannotplay a {
	color: #fff;
	font-weight: bold;
}
.me-cannotplay span {
	padding: 15px;
	display: block;
}
/* End: ERROR */


/* Start: Loop */
.mejs-controls .mejs-loop-off button{
	background-position: -64px -16px;
}
.mejs-controls .mejs-loop-on button {
	background-position: -64px 0;
}
/* End: Loop */

/* Start: backlight */
.mejs-controls .mejs-backlight-off button{
	background-position: -80px -16px;
}
.mejs-controls .mejs-backlight-on button {
	background-position: -80px 0;
}
/* End: backlight */


/* Start: picture controls */
.mejs-controls .mejs-picturecontrols-button{
	background-position: -96px 0;
}
/* End: picture controls */


/* context menu */
.mejs-contextmenu {
	position: absolute;
	width: 150px;
	padding: 10px;
	border-radius: 4px;
	top: 0;
	left: 0;
	background: #fff;
	border: solid 1px #999;
	z-index: 1001; /* make sure it shows on fullscreen */
}
.mejs-contextmenu .mejs-contextmenu-separator {
	height: 1px;
	font-size: 0;
	margin: 5px 6px;
	background: #333;
}

.mejs-contextmenu .mejs-contextmenu-item {
	font-family: Helvetica, Arial;
	font-size: 12px;
	padding: 4px 6px;
	cursor: pointer;
	color: #333;
}
.mejs-contextmenu .mejs-contextmenu-item:hover {
	background: #2C7C91;
	color: #fff;
}


/* Start: SourceChooser */
.mejs-controls .mejs-sourcechooser-button {
	position: relative;
}

.mejs-controls .mejs-sourcechooser-button button {
	background-position: -128px 0;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector {
	visibility: hidden;
	position: absolute;
	bottom: 26px;
	right: -10px;
	width: 130px;
	height: 100px;
	background: url(../img/videoplayer/background.png);
	background: rgba(50,50,50,0.7);
	border: solid 1px transparent;
	padding: 10px;
	overflow: hidden;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul {
	margin: 0;
	padding: 0;
	display: block;
	list-style-type: none !important;
	overflow: hidden;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li{
	margin: 0 0 6px 0;
	padding: 0;
	list-style-type: none !important;
	display:block;
	color: #fff;
	overflow: hidden;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li input{
	clear: both;
	float: left;
	margin: 3px 3px 0 5px;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li label{
	width: 100px;
	float: left;
	padding: 4px 0 0 0;
	line-height: 15px;
	font-family: helvetica, arial;
	font-size: 10px;
}
/* End: SourceChooser */




/* ! ------------------------------------------------------------------ */
/* ! Media queries for responsive design */



@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}







/* !  */
/* !  */
/* ! ========  END SITE  ============================================== */
/* !  */
/* !  */


/* ! ------------------------------------------------------------------ */
/* ! Utilities */


.nonopaque { opacity: 0 }

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.clear { clear:both; }


/* ! ------------------------------------------------------------------ */
/* ! Print */


.disabled {
	cursor: default;
}


/* ! ------------------------------------------------------------------ */

/* #myth-0 .act-2 .content .intro {
    float: none;
    margin: 0 20px;
    position: relative;
    left: 170px;
    top: 40px;
    text-align: left;
    width: 480px;
}
#myth-0 .screen-2-2-2.act-2 .content .intro {
	top:80px;
}
#myth-0 .act-2 .option {
    float: none;
    left: 240px;
	position: absolute;
}
#myth-0 .act-2 #myth5-screen7-option1 {
    top: 240px;
}
#myth-0 .act-2 #myth5-screen7-option2 {
    top: 340px;
}
#myth-0 .act-2 #myth5-screen7-option3 {
    top: 420px;
}
#myth-0 .screen-2-2-2.act-2 #myth5-screen7-option1 {
    top: 240px;
}
#myth-0 .screen-2-2-2.act-2 #myth5-screen7-option2 {
    top: 320px;
}
#myth-0 .screen-2-2-2.act-2 #myth5-screen7-option3 {
    top: 400px;
} */
.dot-big:before {
	border:25px solid transparent;
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    left: -25px;
    top: -25px;
}
.dot-big {
    animation-duration: 0.5s;
    animation-name: bullet-in-big;
    background: none;
    box-shadow: none;
    border: 25px solid transparent;
    border-radius: 0;
    width: 0;
    height: 0;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
}
.dot-big.right {
	border-left-color: #888888;
}
.dot-big.right:before {
	border-left-color: #555555;
    top: -31px;
}
.dot-big.right.greyed:before {
	border-left-color: #e0e0e0;
    top: -31px;
}
.dot-big.left {
	border-right-color: #888888;
}
.dot-big.left:before {
	border-right-color: #555555;
    top: -31px;
}
.dot-big.left.greyed:before {
	border-right-color: #e0e0e0;
    top: -31px;
}
.dot-big.bottom {
	border-top-color: #888888;
}
.dot-big.bottom:before {
	border-top-color: #555555;
    top: -31px;
}
.dot-big.bottom.greyed:before {
	border-top-color: #e0e0e0;
    top: -31px;
}
.dot-big.top {
	border-bottom-color: #888888;
}
.dot-big.top:before {
	border-bottom-color: #555555;
    top: -31px;
}
.dot-big.top.greyed:before {
	border-bottom-color: #e0e0e0;
    top: -31px;
}

.dot.greyed {
	background-color:#fff;
}