@charset "utf-8";

@import url("home.css") screen;
@import url("weekdiarytools.css") screen;
@import url("notes.css") screen;
@import url("moduleOrder.css") screen;
@import url("moodgraph.css") screen;
@import url("dragdrop.css") screen;
@import url("welcome.css?v=20161220_1532") screen;



/* CSS Document
-----------------------------------------------------
Finding My Way
URL: http://www.findingmyway.com.au

Enabled http://www.enabled.com.au
Design and Html/CSS by Nola Falk / Enabled Solutions

Last modified: July 22 2013
------------------------------------------------------ */

/* fonts */
@font-face {
	font-family: 'SourceSansProRegular';
	src: url('SourceSansPro-Regular-webfont.eot');
	src: url('SourceSansPro-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('SourceSansPro-Regular-webfont.woff') format('woff'), url('SourceSansPro-Regular-webfont.ttf') format('truetype'), url('SourceSansPro-Regular-webfont.svg#SourceSansProRegular') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SourceSansProSemibold';
	src: url('SourceSansPro-Semibold-webfont.eot');
	src: url('SourceSansPro-Semibold-webfont.eot?#iefix') format('embedded-opentype'), url('SourceSansPro-Semibold-webfont.woff') format('woff'), url('SourceSansPro-Semibold-webfont.ttf') format('truetype'), url('SourceSansPro-Semibold-webfont.svg#SourceSansProSemibold') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SourceSansProBold';
	src: url('SourceSansPro-Bold-webfont.eot');
	src: url('SourceSansPro-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('SourceSansPro-Bold-webfont.woff') format('woff'), url('SourceSansPro-Bold-webfont.ttf') format('truetype'), url('SourceSansPro-Bold-webfont.svg#SourceSansProBold') format('svg');
	font-weight: normal;
	font-style: normal;
}

html, body {
	margin: 0;
	padding: 0;
	height: 100%; /* needed for container min-height */
}
body {
	margin: 0;
	padding: 0;
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	font-weight: normal;
	font-style: normal;
	font-size: 18px;
	color: #3e4a5c;
	background-color: #49566b;
	background-image: url(../images/BG_main.jpg);
	background-repeat: repeat-x;
	background-position: left top;
}
body a {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #229dd6;
	text-decoration: none;
}
body a:hover {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #1F8DC2;
	text-decoration: none;
}
/* [ General ] */
/*img,embed,object,video {
  max-width: 100%;
  width: 100%;
}*/

.error {
	color: red;
}
.hidden {
	display: none;
}

.clearfloat {
	clear: both;
	height: 0;
	font-size: 1px;
	line-height: 0px;
}
p{
	margin: 0 0 15px 0;
	font-family: 'SourceSansProRegular', Arial, sans-serif;
}

small{
	margin: 0 0 15px 0;
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #1c94d0;
	display: block;
}
img, img a {
	border: none;
	text-decoration: none;
}
.block {
	display: block;
}
strong {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-weight: normal;
	font-style: normal;
}
a:focus, a:active {
	outline: 0;
	border: 0;
}
.alignLeft {
	float: left;
}
.alignRight {
	float: right;
}
ul, ol {
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

/*cellpadding*/
td, th, tr {
	border: none;
	padding: 0;
	margin: 0;
}
/* cellspacing*/
/*table { border-collapse:separate; border-spacing: 5px; } // cellspacing="5"*/
table {
	border-collapse: collapse;
	border-spacing: 0;
	border: none;
	padding: 0;
	margin: 0;
}  /* cellspacing="0" */
/* valign */
th, td {
	vertical-align: top;
}
/* [ week colours ] */

/* week 1 */
.week1 {
	color: #55bc75; /* kelly green */
}
/* week 2 */
.week2 {
	color: #21beb7; /* aqua */
}
/* week 3 */
.week3 {
	color: #f7af05; /* dark yellow */
}
/* week 4 */
.week4 {
	color: #1c94d0; /* mid blue */
}
/* week 5 */
.week5 {
	color: #e86f50; /* orange red */
}
/* week 6 */
.week6 {
	color: #746cb1; /* purple */
}
/* border top */

/* week 1 */
.topLineweek1 {
	border-top: solid 5px #55bc75; /* kelly green */
}
/* week 2 */
.topLineweek2 {
	border-top: solid 5px #21beb7; /* aqua */
}
/* week 3 */
.topLineweek3 {
	border-top: solid 5px #f7af05; /* dark yellow */
}
/* week 4 */
.topLineweek4 {
	border-top: solid 5px #1c94d0; /* mid blue */
}
/* week 5 */
.topLineweek5{
	border-top: solid 5px #e86f50; /* orange red */
}
/* week 6 */
.topLineweek6 {
	border-top: solid 5px #746cb1; /* purple */
}

/* [ text colour ] */

.textColor1 {
	color: #55bc75; /* kelly green */
}
.textColor2 {
	color: #21beb7; /* aqua */
}
.textColor3 {
	color: #f7af05; /* dark yellow */
}
.textColor4 {
	color: #1c94d0; /* mid blue */
}
.textColor5 {
	color: #e86f50; /* orange red */
}
.textColor6 {
	color: #746cb1; /* purple */
}

/* [ background colours ] */

.backgroundColor1 {
	background-color: #55bc75; /* kelly green */
}
.backgroundColor2 {
	background-color: #21beb7; /* aqua */
}
.backgroundColor3 {
	background-color: #f7af05; /* yellow */
}
.backgroundColor4 {
	background-color: #1c94d0; /* mid blue */
}
.backgroundColor5 {
	background-color: #e86f50; /* orange red */
}
.backgroundColor6 {
	background-color: #746cb1; /* purple */
}

/* [ colours ] */

/* dark green */
.darkGreen {
	background-color: #4daf7c; /* dark green */
}
/* green */
.green, .greenColor{
	background-color: #55bc75; /* kelly green */
}
/* aqua */
.aqua {
	background-color: #21beb7; /* aqua */
}

/* light yellow */
.lightYellow {
	background-color: #FBC13C; /* light yellow */
}

/* yellow */
.yellow {
	background-color: #f7af05; /* yellow */
}

/* yellow */
.darkyellow {
	background-color: #db9b01; /* dark yellow */
}

/* blue */
.blue {
	background-color: #1c94d0; /* mid blue */
}
/* orangered */
.orangered, .orangeColor{
	background-color: #e86f50; /* orange red */
}
/* purple */
.purple {
	background-color: #746cb1; /* purple */
}
/* off white */
.white {
	background-color: #f1f2f4;
}

p.highlight {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #3e4a5c;
	font-size: 18px;
	margin: 15px 0;
	padding: 10px;
	display: block;
	background-color: #d2e2eb;
}
p.footnote {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #68c168;
	font-size: 16px;
	margin: 10px 0;
}
p.footnote a {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #68c168;
	font-size: 16px;
	text-decoration: none;
}
p.footnote a:hover {
	text-decoration: underline;
}
/*note pages */
blockquote {
	float: right;
	background-color: #d2e2eb;
	margin: 20px 0 20px 20px;
	padding: 25px 70px 56px 25px;
	width: 225px;
	min-height: 160px;
	height: auto !important;
	height: 160px;
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #535d6d;
	font-size: 16px;
	line-height: 18px;
	background-image: url(../images/icon_blockquote.jpg);
	background-repeat: no-repeat;
	background-position: right bottom;
}

blockquote p{
	margin: 0 0 20px 0 !important;
}

blockquote strong{
	margin: 8px 0 0 0;
	display: block;
}
/* [ headings ] */

h1 {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	color: #3e4a5c;
	font-size: 36px;
	padding: 0;
	margin: 10px 0 3px 0;
}
h2 {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	color: #3e4a5c;
	font-size: 24px;
	padding: 0;
	margin: 10px 0 3px 0;
}
h3 {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	color: #3e4a5c;
	font-size: 20px;
	padding: 0;
	margin: 10px 0 3px 0;
}

h4{
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	color: #3e4a5c;
	font-size: 18px;
	padding: 0;
	margin: 10px 0 3px 0;
}
/* [ Layout ] */

div#wrapper {
	margin: 0;
	height: auto !important; /* real browsers */
	height: 100%; /* IE6: treated as min-height*/
	min-height: 100%; /* real browsers */
	position: relative;
	overflow: hidden;
}
div#contentHolder {
	margin: 0 auto;
	padding: 0 0 134px 0; /* footer height */
	width: 960px;
}

div#contentMessage {
    padding: 20px;
    width: 920px;
    height: 40px;
    margin: 0 0 20px 0;
    background-color: #f1f3f6;
    font-family: 'SourceSansProSemibold', Arial, sans-serif;
    font-size: 18px;
    color:#ed3434;
}

/* contentTop */

div#contentTop {
	width: 960px;
	height: 75px;
	margin: 0 0 20px 0;
	background-color: #f1f3f6;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 22px;
}
div#contentTop a {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 22px;
}

div#contentTop li.contentTop1 { /* week indicator */
	width: 125px;
	height: 50px;
	padding: 25px 0 0 25px;
	text-transform: uppercase;
	letter-spacing: 2px;
}

div#contentTop li.contentTop2 { /* progress bar*/
	width: 660px;
	height: 75px;
	background-color: #e6e6e7;

}
div#contentTop li.contentTop3 {
	width: 150px;
	height: 75px;
}
div#contentTop li.contentTop3 a { /* add notes link */
	width: 100px;
	height: 50px;
	display: block;
	padding: 25px 0 0 50px;
	color: #f9cac0;
	background-color: #e86f50;
	background-image: url(../images/icon_addNote.jpg);
	background-repeat: no-repeat;
	background-position: 10px 20px;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 22px;
}
div#contentTop li {
	float: left;
	display: block;
}
/* content */

div#content {
	width: 880px;
	min-height: 600px;
	height: auto !important;
	height: 600px;
	background-color: #f1f2f4;
	padding: 40px;
}
div#contentInner {
	min-height: 600px;
	height: auto !important;
	height: 600px;
	display: inline-block;
}
div#contentInner > ul {
	list-style-type: disc;
	list-style: disc;
 	list-style-position: outside;
    margin: 10px 0 20px 14px;
    padding: 0 2px 0 5px;
}
div#contentInner ol {
	margin: 10px 0 20px 14px;
    padding: 0 2px 0 5px;
	list-style-type: decimal;
	list-style: decimal;
	list-style-position: outside;
}
div#contentInner > ul > li, div#contentInner > ol > li {
	float: none;
	width: 635px;
	margin: 0 0 15px 20px;
	padding: 0 0 0 10px;
}
div#contentInner > ul > li > ul {
	padding: 0;
	margin: 0;
	list-style-type: disc;
	list-style: disc;
	list-style-position: inside;
}
div#contentInner > ul > li > ul > li {
	float: none;
	width: 635px;
	margin: 10px 0 5px 30px;
	padding: 0;
}

div#contentInner > ol > li > ul{
	padding: 0;
	margin: 0;
	list-style-type: lower-alpha;
	list-style: lower-alpha;
	list-style-position: outside;
}

div#contentInner > ol > li > ol {
	padding: 0;
	margin: 0;
	list-style-type: lower-roman;
	list-style: lower-roman;
	list-style-position: outside;
}
div#contentInner > ol > li > ul > li, div#contentInner > ol > li > ol > li {
	float: none;
	width: 635px;
	margin: 10px 0 5px 30px;
	padding: 0;
}
div#contentInner ul#webLinks {
	width: 635px;
	padding: 0;
	margin: 40px 0 0 0;
	list-style-type: disc;
	list-style: disc;
	list-style-position: inside;
}
div#contentInner ul#webLinks li {
	float: none;
	width: 635px;
	height: 30px;
	padding: 7px 12px 3px 15px;
	margin: 0 0 2px 0;
	background-color: #e3eef4;
	color: #25a0d9;
	background-image: url(../images/arrowBlue.png);
	background-repeat: no-repeat;
	background-position: 620px 5px;
}
div#contentInner ul#webLinks li:hover {
	background-color: #D6E7EF;
}
div#contentInner ul#webLinks li a {
	color: #25a0d9;
	text-decoration: none;
}
div#contentInner ul#webLinks li a:hover {
	text-decoration: underline;
}
div#contentTitle, div.item-page div.page-header {
	width: 880px;
	padding: 0 0 25px 0;
	margin: 0 0 25px 0;
	border-bottom: 7px solid #d8dbde;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 26px;
	color: #3e4a5c;
}
div.item-page div.page-header h2{
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 26px;
	color: #3e4a5c;
	margin: 0 !important;
	padding: 0 !important;
}
/* pageNav */

div#pageNav {
	width: 116px;
	height: 50px;
	margin: 30px 0 0 770px;
}
div#pageNav ul {
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
div#pageNav ul li {
	display: block;
	float: left;
}
div#pageNav a {
	text-indent: -9999px;
	display: block;
	width: 54px;
	height: 50px;
	background-position: 0 0;
}
div#pageNav a:hover, div#pageNav a.off {
	background-position: 0 -51px;
}
div#pageNav a.back {
	background-image: url(../images/pageNav_Back.png);
	background-repeat: no-repeat;
	margin: 0 6px 0 0;
	width: 54px;
	height: 50px;
}
div#pageNav a.next {
	background-image: url(../images/pageNav_Next.png);
	background-repeat: no-repeat;
	width: 54px;
	height: 50px;
}
/* top */

div#top {
	width: 960px;
	height: 106px;
	background-color: #3e4a5c;
	position: relative;
	margin: 0 0 20px 0;
}
div#home {
	position: absolute;
	width: 116px;
	height: 46px;
	top: 30px;
	left: 30px;
}
div#logout {
	position: absolute;
	width: 116px;
	height: 46px;
	top: 30px;
	right: 30px;
}
div#home a, div#logout a {
	width: 116px;
	height: 36px;
	display: block;
	color: #a9b6c7;
	font-size: 20px;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	background-color: #516076;
	text-align: center;
	padding: 10px 0 0 0;
	text-transform: uppercase;
}
div#home a:hover, div#logout a:hover {
	opacity: 0.8;
}
div#logo {
	position: absolute;
	left: 380px;
	top: 10px;
	width: 236px;
	height: 82px;
}

/* add new */
div#preNavigationConfirmation {
	float: right;
}
div#preNavigationConfirmation p {
	padding: 16px;
}

div#addNew {
	float: right;
	width: 150px;
	height: 50px;
}
div#addNew a {
	width: 150px;
	height: 50px;
	display: block;
	text-decoration: none;
	background-image: url(../images/button_addNew_normal.png);
	background-repeat: no-repeat;
	text-indent: -9999px;
}
div#addNew a:hover {
	background-image: url(../images/button_addNew_selected.png);
	background-repeat: no-repeat;
}

/* get Started */

div#getStarted {
	float: right;
	height: 150px;
	height: 50px;
	text-align: center;
	margin: 15px 0 10px 0;
}
div#getStarted a {
	width: 150px;
	padding: 13px 0 0 0;
	height: 35px;
	display: block;
	text-decoration: none;
	color: #FFFFFF;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 22px;
	background-color: #25A0D9;
}
div#getStarted a:hover {
	background-color: #2396CD;
	color: #FFFFFF;
}

/* Module Continue*/

div#continue {
	float: right;
	height: 150px;
	height: 50px;
	text-align: center;
	margin: 15px 0 10px 0;
}
div#continue a {
	width: 150px;
	padding: 13px 0 0 0;
	height: 35px;
	display: block;
	text-decoration: none;
	color: #FFFFFF;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 22px;
	background-color: #55BC75;
}
div#continue a:hover {
	background-color: #4DAF7C;
	color: #FFFFFF;
}


/* pageItem */
div.pageItem {
	height: 158px;
	margin: 0 0 15px 0;
}
div.pageItemL {
	float: left;
	width: 60px;
	height: 158px;
}
div.pageItemL ul {
	list-style: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	background-color: #eaecee;
}
div.pageItemL ul li {
	display: block;
	width: 60px;
	height: 77px;
	background-color: #ffffff;
}
div.pageItemL ul li a {
	display: block;
	background-repeat: no-repeat;
	background-position: 5px 12px;
	width: 55px;
	height: 65px;
}
div.pageItemL ul li.edit {
	margin: 0 0 4px 0;
}
div.pageItemL ul li.edit a {
	background-image: url(../images/icon_edit.jpg);
}
div.pageItemL ul li.delete a {
	background-image: url(../images/icon_delete.jpg);
}
div.pageItemL ul li a {
	display: block;
	width: 60px;
	height: 76px;
	text-indent: -9999px;
}
div.pageItemR {
	float: right;
	width: 820px;
	min-height: 158px;
	height: auto !important;
	height: 158px;
	padding: 0;
	background-color: #eaecee;
	color: #868a91;
}

/* footer */
div#footer {
	width: 100%;
	position: absolute;
	bottom: 0; /* stick to bottom */
}
div#footer div#footerInner {
	margin: 0 auto;
	width: 930px;
	padding: 15px;
	height: 104px;
	background-color: #FFFFFF;
}

div#footer div#footerInnerL{
	float: left;
	width: 250px;
	height: 64px;
	padding: 20px 0 0 0;
}

div#footer div#footerInnerL div#resources{
	float: left;
	width: 118px;
}

div#footer div#footerInnerL div#lifeline{
	float: right;
	width: 118px;
}

div#footer div#footerInnerL div#resources a{
	width: 116px;
	height: 34px;
	display: block;
	color: #9ba0a6;
	font-size: 18px;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	background-color: #e4e6e9;
	text-align: center;
	padding: 12px 0 0 0;
	text-transform: uppercase;
}

div#footer div#footerInnerL div#resources a:hover, div#footer div#footerInnerL div#lifeline a:hover {
	opacity: 0.8;
}


div#footer div#footerInnerR{
	float: right;
	width: 600px;
	height: 94px;
	text-align: right;
	padding: 10px 0 0 0;
}

div#footer div#footerInnerR img{
	margin: 0 5px 0 0;
	vertical-align: middle;
}

/*modal pop up*/

div.modalTitle {
	width: 100%;
	height: 42px; /* 62px */
	padding: 20px 0 0 0;
	color: #FFFFFF;
	font-size: 24px;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	text-align: center;
	background-color: #3e4a5c;
}
div.modalContent {
	padding: 20px 30px;
	min-height: 120px;
	max-height: 440px;
	overflow-x: hidden;
	overflow-y: auto;
	height: auto !important;
	height: 120px;
}
div.modalContentInner {
	padding: 0 0 30px 0;
}
div.modalContent h3, div.surveyQ h3 {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	color: #3e4a5c;
	font-size: 20px;
	padding: 0;
	margin: 10px 0 5px 0;
}
div.modalContent textarea {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	border: 1px solid #d9dadd;
	color: #3e4a5c;
	font-size: 16px;
	padding: 5px;
	width: 690px;
	background-color: #eceff2;
	height: 100px;
	width: 445px;
}
div.modalContent input[type=text] {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	border: 1px solid #d9dadd;
	color: #3e4a5c;
	font-size: 16px;
	padding: 5px;
	width: 690px;
	background-color: #eceff2;
	height: 20px;
	width: 445px;
}
div.modalContent p {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #3e4a5c;
	font-size: 22px;
	padding: 10px 0 0 0;
}
div.modalFooter {
	background-color: #f1f3f6;
	text-align: center;
	border-top: 2px solid #dadee3;
	height: 50px;
	padding: 15px 0 0 0;
}
div.modalFooter a {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 18px;
	background-color: #b7bec9;
	display: inline-block;
	text-align: center;
	color: #4f5b6d;
	height: 27px;
	width: 112px;
	padding: 7px 0 0 0;
	margin: 0 10px;
}

a.genericButton {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	font-size: 18px;
	background-color: #b7bec9;
	display: inline-block;
	text-align: center;
	color: #4f5b6d;
	height: 27px;
	width: 112px;
	padding: 7px 10px 0 10px;
	margin-bottom: 10px;
}
a.genericButton:hover {
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	background-color: #9ba7b9;
	color: #334560;
}
/* Survey Q and form */

div.surveyQ {
	margin: 0 0 20px 0;
}

div.surveyQ h3 {
    color: #3E4A5C;
	line-height: 20px;
    margin: 10px 0 5px;
    padding: 0;
}
div.surveyQ textarea, textarea {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	border: 1px solid #d9dadd;
	color: #3e4a5c;
	font-size: 16px;
	padding: 5px;
	background-color: #eceff2;
	height: 100px;
	width: 860px;
}
div.surveyQ input[type=text], input[type=text] {
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	border: 1px solid #d9dadd;
	color: #3e4a5c;
	font-size: 16px;
	padding: 5px;
	background-color: #eceff2;
	height: 20px;
	width: 860px;
}
input, button, select, textarea {
	font-size: 16px;
	font-weight: normal;
	background-color: #eceff2;
	border: 1px solid #d9dadd;
	padding: 8px;
	color: #3e4a5c;
}
option {
	padding: 0 15px 3px 0;
}
ul.date li, ul.time li {
	float: left;
	height: 35px;
	display: block;
	margin: 0 10px 0 0;
}
ul.date li.day, ul.time li.hour, ul.time li.minutes {
	width: 80px;
}
ul.date li.month {
	width: 130px;
}
ul.date li.year {
	width: 95px;
}
ul.time li.ampm {
	width: 115px;
}

/* Non-JS styling radio buttons and checkboxes */
/* radio buttons and checkboxes */
input[type='checkbox'], input[type='radio'] {
/* 	display: none; */
	position: absolute;
	left: -9999px;
	visibility: hidden;
}

input[type='radio'] + label span {
	display: inline-block;
	cursor: pointer;
	height: 40px;
	width: 40px;
	background-image: url(../images/btn_radioButton_normal.png);
	background-repeat: no-repeat;
	background-position: center top;
}

input[type='radio']:checked + label span {
	background-image: url(../images/btn_radioButton_selected.png);
	background-repeat: no-repeat;
	background-position: center top;
}

input[type='radio'].rating-input + label span {
	display: inline-block;
	cursor: pointer;
	height: 22px;
	width: 23px;
	background-image: url(../images/staroff.png);
	background-repeat: no-repeat;
	background-position: center top;
}

span.rating-input-selected {
	background-image: url(../images/staron.png) !important;
}

input[type='checkbox'] + label span {
	display: inline-block;
	cursor: pointer;
	height: 40px;
	width: 40px;
	background-image: url(../images/btn_tickBox_blank_unselected.png);
	background-repeat: no-repeat;
	background-position: center top;
	margin-right: 10px;
}

input[type='checkbox']:checked + label span {
	background-image: url(../images/btn_tickBox_blank_selected.png);
	background-repeat: no-repeat;
	background-position: center top;
}

span.checkboxSelected {
	background-image: url(../images/btn_tickBox_blank_selected.png) !important;
	background-repeat: no-repeat;
	background-position: center top;
}

span.radioSelected {
	background-image: url(../images/btn_radioButton_selected.png) !important;
	background-repeat: no-repeat;
	background-position: center top;
}

div.weekTools span.checkbox {
	display: inline-block;
	width: 40px;
	height: 40px;
	background-image: url(../images/btn_tickBox_blank_selected.png) !important;
	background-repeat: no-repeat;
	background-position: center top;
}

.modalContentInner h3 {
	clear: both;
}

.radioLabel, .checkboxLabel {
	height: 40px;
	padding: 10px 0 0 5px;
}

.radioLabel p, .checkboxLabel p {
	padding: 0 !important;
}

.radioLabel span, .checkboxLabel span {
	float: left;
}

table.radioGroup .radioLabel span {
	float: none;
}

table.grid .radioLabel span {
	float: none;
}

.radioLabel p {
	display: inline;
	float: left;
	margin-left: 10px;
	margin-top: 10px;
}

.checkboxLabel p {
	display: inline;
}

ul.rating li{
	float: left;
	width: 23px;
	height: 22px;
	margin: 0 3px 0 0;
}


/* surveyQ table grid layout */

h3.tableH{
	margin: 0 0 5px 20px !important;
}
div.surveyQ table.grid{
	margin: 0 0 20px 0;
	border-collapse:separate;
	border-spacing: 6px;  /* cellspacing="6"*/
	padding:0;
}

div.surveyQ table.grid th, div.surveyQ table.grid td{
	height: 80px;
	color: #3d4a5b;
}

div.surveyQ table.grid th{
	font-size: 14px;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	text-align: left;
	padding: 0 10px;
	width: 130px;
	background-color: #e4e6e7;
	vertical-align: middle;
}

div.surveyQ table.grid th.title {
	width: 290px;
}
div.surveyQ table.grid tbody td{
	text-align: center;
	vertical-align: middle;
	background-color: #eaecee;
}
div.surveyQ table.grid tbody td.tableQ{
	padding: 15px;
	text-align: left;
}

div.surveyQ table.grid label.radioLabel, div.surveyQ table.radioGroup label.radioLabel {
	width: 100%;
	padding: 0;
}

/* radioGroup */

div.surveyQ table.radioGroup{
	margin: 0 0 20px 0;
	border-collapse:separate;
	border-spacing: 6px;
	padding:0;
	width: 100%;
}

div.surveyQ table.radioGroup tr.questionRow td{
	text-align: left;
	padding: 0 10px;
	height: 80px;
	background-color: #e4e6e7;
	vertical-align: middle;
}

div.surveyQ table.radioGroup tr.radioRow td{
	text-align: center;
	height: 80px;
	width: 35px;
	background-color: #eaecee;
	vertical-align: middle;
}
div.surveyQ table.radioGroup tr.labelRow{
	background-color: #eaecee;
}
div.surveyQ table.radioGroup tr.labelRow td{
	height: 40px;
	width: 35px;
	background-color: #eaecee;
	vertical-align: middle;
}

div.surveyQ table.radioGroup tr.labelRow div.valueLabelL {
	float: left;
	text-align: center;
}

div.surveyQ table.radioGroup tr.labelRow div.valueLabelL:first-child {
	text-align: left;
	padding-left: 10px;
}

div.surveyQ table.radioGroup tr.labelRow div.valueLabelL:last-child, div.surveyQ table.radioGroup tr.labelRow div.valueLabelR:last-child  {
	text-align: right;
	padding-right: 10px;
}

/* module  spotlight tables */
table.spotlight {
	border-collapse:separate;
	border-spacing:  6px;  /* horizonal / vertical*/
	margin: 0 0 20px 0;
	width: 880px;
}
table.spotlight th {
	height: 80px;
	color: #4A596F;
	font-size: 18px;
	font-family: 'SourceSansProSemibold', Arial, sans-serif;
	background-color: #C8DDE8;
	text-align: left;
	vertical-align: middle;
	padding: 0 10px;
}
table.spotlight tr {
}
table.spotlight tbody td {
	font-size: 16px;
	font-family: 'SourceSansProRegular', Arial, sans-serif;
	color: #5B6C86;
	background-color: #DAE8EF;
	padding: 10px;
	margin: 0;
}

table.spotlight ul {
	list-style-type: disc;
	list-style: disc;
 	list-style-position: outside;
}
table.spotlight ol {
	list-style-type: decimal;
	list-style: decimal;
	list-style-position: outside;
}
table.spotlight ul > li,table.spotlight  ol > li {
	float: none;
	margin: 0 0 15px 15px;
	padding: 0 0 0 10px;
}

#moduleLockedError .modalContent {
	width: 80%;
}

.optionalBorder {
	border: 2px solid orange !important;
}

img, img a {
	max-width: 100%;
	height: auto;
}

div#ccsaBrand {
	text-align: right;
}

div#contentHolder {
	padding-bottom: 0;
}

div#footer,
div#welcomeFooter {
	height: auto;
}

div#footer {
	position: relative;
}

div#footer div#footerInner,
div#welcomeFooter div#footerInner {
	height: auto;
}

@media (max-width: 1215px) {
	div#welcomeFooter div#ccsaBrand {
		text-align: center;
	}
}

@media (max-width: 976px) {
	
	* {
		max-width: 100%;
	}

	div#top {
		text-align: center;
	}

	div#logo {
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	}

	div#contentHolder {
   		width: 100%;
   		padding-bottom: 0;
 }

	div#content {
		width: auto;
	}
	
	div#footer {
		position: relative;
		width: auto;
	}

	div#footer div#footerInner {
		height: auto;
		width: auto;
	}

	div#footer div#footerInnerL,
	div#footer div#footerInnerR {
		float: none;
		width: 100%;
		height: auto;
		text-align: center;
	}

	div#footer div#footerInnerL {
		
	}

	div#footer div#footerInnerR {
		
	}

	div#footer div#footerInnerL div#resources, div#footer div#footerInnerL div#lifeline {
		float: none;
		display: inline-block;
		vertical-align: top;
	}

	div.weekTools {
	    overflow-x: scroll;
	}

	table {
	    width: auto !important;
	}

	div#addNew {
	    float: none;
	    width: auto;
	}

	div#addNew a {
	    width: 100%;
	}

	div#experimentalTiles > ul > li {
	    float: none;
	    display: inline-block;
	    vertical-align: top;
	    margin-right: 1%;
	}

	div#experimentalTiles {
	    height: auto;
	    text-align: center;
	}

	div.toptileTitle {
	    width: auto;
	}

	div#homeProgressBar {
	    width: 60px;
	    display: inline-block;
	    float:  none;
	    margin-right: -4px;
	    position: absolute;
	    left: 0;
	}

	div#weeksItems {
	    float: none;
	    display: inline-block;
	    width: auto;
	    vertical-align: top;
	    margin-left: 48px;
	    padding-left: 12px;
	}

	div#weeksItems li {
	    width: auto;
	}

    div.weeksInnerL {
	    width: 34%;
	    margin-left: 1%;
	    float: none;
	    display: inline-block;
	    vertical-align: top;
	    padding-top: 20px;
	}

	div.weeksInnerR {
	    width: 62%;
	    margin-left: 1%;
	    vertical-align: top;
	    overflow-x: hidden;
	}

	div.weeksInner {
	    width: auto;
	    height: auto;
	}

	div.topicImage {
	    max-width: 100%;
	    height: auto;
	    width: auto;
	    margin-top: 0;
	}

	div.topicInfo {
	    width: auto;
	    height: auto;
	}
	
	div#weeksExperimental li {
	    vertical-align: top !important;
	}

	div.padlockTitle2 {
	    width: auto;
	    float: none;
	    display: inline-block;
	    padding-left: 20px;
	}

	div.weekTitle2 {
	    width: auto;
	    text-align: left;
	}

	div.week {
	    float: none;
	    display: inline-block;
	    vertical-align: top;
	}

	div.topicText {
	    height: auto;
	    margin-bottom: 10px;
	}

	div.topicTitle {
	    height: auto;
	}

	div.weekStatus {
	    height: auto;
	    padding-bottom: 10px;
	}

	div#contentTop {
	    height: auto;
	}

	div#contentInner ul#webLinks li {
	    height: auto;
	}

	div#contentTop li.contentTop3 a,
	div#contentTop li.contentTop1 a {
	    width: auto;
	    background-position: calc(50% - 45px) 20px;
	    text-align: center;
	    display: block;
	}

	div#contentTop li.contentTop2 a {
	    width: auto;
	}

	div#contentTop li.contentTop2 {
	    text-align: center;
	}

	div#contentTop li.contentTop3,
	div#contentTop li.contentTop2,
	div#contentTop li.contentTop1 {
	    width: 100%;
	}

	div#contentTop li.contentTop1 {
		padding-left: 0;
	}

	div#addNote {
	    width: auto !important;
	}

	div.modalContent textarea {
	    width: 100%;
	}
	
	fieldset {
	    width: auto;
	    min-width: auto;
	}

	input#username {
	    width: auto;
	}

	.control-label {
	    width: auto;
	}

	div#contentInner {
	    width: 100%;
	}
	/* bug: big images unreadable 
	#contentInner p > img:only-child {
	    max-width: none;
	}

	#contentInner > p {
	    overflow: auto;
	} */

	input#password {
		min-width: auto;
		width: auto;
	}

	div#contentInner > ul > li, div#contentInner > ol > li {
		width: auto;
	}

	div#contentInner > ul > li > ul > li {
		width: auto;
	}

	div#pageNav {
	    width: auto;
	    margin-left: 0;
	}

	div#pageNav ul {
	    float: right;
	}

	div#mostUsed {
	    height: auto;
	}

	div#mostUsed:after {
	    display: table;
	    content: "";
	    clear: both;
	}

	form#howDoYouFeelTodayForm {
	    width: auto;
	    max-width: none;
	    overflow-x: scroll;
	}

	div.moodSelector div:nth-child(3) label, div.moodSelector2 div:nth-child(3) label {
	    width: 7.2%;
	}

	input[type='radio'] + label span {
	    width: 93%;
	}

	div.moodSelector div:nth-child(3) span.radio, div.moodSelector2 div:nth-child(3) span.radio {
	    margin: auto 4%;
	}

	div.moodSelector div:nth-child(2) span:nth-child(1), div.moodSelector2 div:nth-child(2) span:nth-child(1) {
	    width: 32%;
	    margin-left: 2%;
	}

	div.moodSelector div:nth-child(2) span:nth-child(2), div.moodSelector2 div:nth-child(2) span:nth-child(2) {
	    width: 32%;
	}

	div.moodSelector div:nth-child(2) span:nth-child(3), div.moodSelector2 div:nth-child(2) span:nth-child(3) {
	    width: 32%;
	    margin-right: 2%;
	}

	div.moodSelector div:nth-child(3), div.moodSelector2 div:nth-child(3) {
	    text-align: center;
	}

	div#ccsaBrand {
		text-align: center;
	}
	
}

@media (max-width: 767px) {
	div#footer div#footerInnerR a {
		width: 100%;
		display: block;
		margin-bottom: 10px;
	}

	div#footer div#footerInnerR a:last-of-type {
		margin-bottom: 0;
	}

	div.topicImage {
		width: auto;
	}

	div.weeksInnerL {
		width: 47%;
	}

	div.weeksInnerR {
		width: 47%;
		overflow-x: hidden;
	}

	div#weeksExperimental li div.weeksInnerR li {
		width: 150px;
		height: 100px;
	}

	div.weeksInnerRInner {
		width: auto;
		height: 47px;
		font-size: 16px;
	}
}

@media (max-width: 575px) {
	div#home {
		top: 110px;
	}

	div#top {
		
		padding-bottom: 70px;
	}

	div#logo {
	}

	div#logout {
		
		top: 110px;
	}

	div#home a {
	}

	div#homeProgressBar {
		left: -4px;
		width: 53px;
	}

	div#weeksItems {
		padding-left: 0;
	}

	.fancybox-inner {
	    height: auto !important;
	}

	form#howDoYouFeelTodayForm {
	    width: auto;
	    max-width: none;
	    overflow-x: scroll;
	}

	div.moodSelector div:nth-child(3) label, div.moodSelector2 div:nth-child(3) label {
	    width: 100%;
	    height: 9.5%;
	    border-left: none;
	}

	input[type='radio'] + label span {
	    width: 93%;
	}

	div.moodSelector div:nth-child(3) span.radio, div.moodSelector2 div:nth-child(3) span.radio {
	    margin: auto 4%;
	}

	div.moodSelector div:nth-child(2) span:nth-child(1), div.moodSelector2 div:nth-child(2) span:nth-child(1) {
	    width: 100%;
	    margin-left: 0;
	    height: 290px;
	    text-align: center;
	}

	div.moodSelector div:nth-child(2) span:nth-child(2), div.moodSelector2 div:nth-child(2) span:nth-child(2) {
	    width: 100%;
	    height: 290px;
	}

	div.moodSelector div:nth-child(2) span:nth-child(3), div.moodSelector2 div:nth-child(2) span:nth-child(3) {
	    width: 100%;
	    /* height: 220px; */
	    margin-right: 0;
	    text-align: center;
	}

	div.moodSelector div:nth-child(3), div.moodSelector2 div:nth-child(3) {
	    text-align: center;
	    width: 50%;
	    height: 600px;
	    vertical-align: top;
	    float: left;
	    padding: 10px 0;
	}

	div.moodSelector div:nth-child(2), div.moodSelector2 div:nth-child(2) {
	    float: left;
	    width: 50%;
	    height: 600px;
	}

	div.moodSelector:After, div.moodSelector2:After {
	    display: table;
	    clear: both;
	    content: "";
	}
}

