/*
// Copyright (c) Just2easy Limited 2010,17 all rights reserved.
*/
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

#flash_camera {
	position: relative;
	width: 567px;
	height: 430px;
}
.attachmentsUpload {display:none;}

#webcam_movie {float:right;}
#webcam_movie.hidden {
	display:block !important;
	position:absolute;
	left:-9000px;
}

.captureimg {
	position: absolute;
	top: -999999px;
}
.representation {float:right;}

#camera_buttons ul {margin-top:20px;}
#camera_buttons li.first {margin-left:142px;}
#camera_buttons li {display: inline; padding-right: 50px;color:#727D8B;}
#camera_buttons li i.disabled, #camera_buttons li > span.disabled {color: #ccc;}

#filter_controls {display:none;}
#filter_controls ul {
	display:inline-block;
	vertical-align: middle;
	margin: 0px 0px 10px 0px;
}
#filter_controls li.first {margin-left: 20px;}
#filter_controls li {display: inline; padding-right: 35px;}

#filter_controls .slider_panel {
	width: 340px;
	height: 15px;
	background-color: #DEE8F0;
	display: inline-block;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border: 2px solid #D9E5F0;
	padding: 8px 35px;
	margin-right: 20px;
}

#slider {
	border-color: #5D88E3;
}
#slider .ui-slider-handle {
	background: #5D88E3;
	outline:0 solid transparent;
	border:2px solid #5D88E3;
}

#jcamera table {display:inline-block;vertical-align:top;}

#jcamera .filters {
	display: inline-block;
	height: 480px;
	width: 548px;
	background-color: #DEE8F0;
	border: 2px solid #D9E5F0;
	border-radius: 8px;
	overflow-y: scroll;
	margin-left: 10px;
	padding: 5px;
	white-space: normal;
}

#jcamera #photos.j2eListPanel {
	margin-left: 210px;
}

/*@media all and (max-width: 1230px){*/
/*	[aria-labelledby="ui-dialog-title-jcamera"], [aria-describedby="jcamera"] {*/
/*		width: 1032px !important;*/
/*	}*/
/*	*/
/*	#jcamera .filters {*/
/*		width: 414px;*/
/*	}*/
/*	*/
/*	#jcamera #photos.j2eListPanel {*/
/*		margin-left: 140px;*/
/*	}*/
/*}*/

@media all and (max-width: 11000px){
	[aria-labelledby="ui-dialog-title-jcamera"], [aria-describedby="jcamera"] {
		width: 900px !important;
	}
	
	.ui-dialog.smallCamera[aria-labelledby="ui-dialog-title-jcamera"], .ui-dialog.smallCamera[aria-describedby="jcamera"] {
		width: 618px !important;
	}
	
	#jcamera .filters {
		width: 282px;
	}
	
	#jcamera #photos.j2eListPanel {
		margin-left: 70px;
	}
}

@media all and (max-width: 940px){
	[aria-labelledby="ui-dialog-title-jcamera"], [aria-describedby="jcamera"] {
		width: 768px !important;
	}
	
	.ui-dialog.smallCamera[aria-labelledby="ui-dialog-title-jcamera"], .ui-dialog.smallCamera[aria-describedby="jcamera"] {
		width: 618px !important;
	}
	
	#jcamera .filters {
		width: 150px;
	}
	
	#jcamera #photos.j2eListPanel {
		margin-left: 0px;
	}
}

#jcamera .filters .filter {
	display: inline-block;
	margin: 4px;
	border: 1px solid #c3e4ff;
	height: 90px;
}

.filter canvas {
	margin: 0px auto;
	display: table;
}

.filter p {
	background-color: #f4f4f4;
	text-align: center;
	width: 110px;
	position: relative;
	font-size: 14px;
	margin: 0 auto;
	margin-top: -16px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	padding-top: 2px;
	overflow: hidden;
}

#jcamera #photos.j2eListPanel{
	max-width: 180px;
	overflow: hidden;
	display: inline-block;
}

#jcamera .j2eListPanel .closeButton {
	margin-top: 6px;
	float: right;
}

#jcamera .toolbarButton{
	width:32px;
	font-size: 26px;
	text-align:center;
	padding: 3px 2px 0px 2px;
}
#jcamera .google{
	font-size: 30px;
    color: #727d8b;
    height: 32px;
    margin-top: 0px;
}

.photoButton1, .shareButton1, .storeButton1, .plusButton{color:#727D8B;}

.smallCamera {display:none;}
#camera_buttons li.smallCamera {display: none!important;}
.filters.smallCamera {
	height: 0!important;
	width: 0!important;
	border: none!important;
	padding: 0!important;
	overflow: hidden!important;}

#camera_buttons #switch {
    cursor: pointer;
}
#camera_buttons #switch > span.count {
	color: white;
    margin-left: -22px;
    vertical-align: super;
    font-size: 12px;
    font-weight: bold;
}
form#userContactInformationForm input.error {
    border: 2px solid red;
    padding: 2px;
    margin-left: -1px;
}

form#userContactInformationForm label {
    width: 8em;
}/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

div#j2sound {
width:180px;
}

div#j2record, div#j2stop, div#j2play {
display:inline-block;
margin-left:20px;
font-size:30px;
touch-action:none;-ms-touch-action:none;
}

div#j2record {
margin-left:30px;
color:red;
}

#j2stop.disabled, #j2play.disabled, #j2record.disabled {
color:lightgrey;
}

.recorder_wrapper {
position:absolute;
z-index:2000
}

.recorder_wrapper_center {
left:50%;
top:50%;
margin-top:-120px;
margin-left:-80px;
}

.j2eAnimate {background-image: url('/e5/pbar-ani.gif') !important;}

div#sndname {margin-bottom: 15px;}
div#sndname > span {margin-right: 5px;}
div#sndname > input {
    width: 175px;
    border: 1px solid #a6c9e2;
    border-radius: 5px;
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

#j2signIn {
	font-size: 13px;
	min-width: 360px;
    max-width: 690px;
}

#j2signIn form.alignedForm fieldset {
	padding-left: 30px;
}

#j2signIn fieldset div.caWrap {
	text-align: center;
}

form.alignedForm fieldset {
	margin-bottom: 10px;
	border: none;
	text-align: left;
}

form.alignedForm legend {
	padding: 0 2px;
	font-weight: bold;
	text-align: left;
}

form.alignedForm label {
	display: inline-block;
	line-height: 1.8;
	vertical-align: middle;
	text-align: right;
	padding-right: 0.5em;
	white-space:nowrap;
	width: 18em; /* Width of labels */
}

form.alignedForm fieldset ol {
	margin: 0;
	padding: 0;
}

form.alignedForm fieldset li {
	list-style: none;
	padding: 2px;
	margin: 0;
}

form.alignedForm em {
	font-weight: bold;
	font-style: normal;
	color: #f00;
}

#j2signIn form.alignedForm label {
	width: 15em; /* Width of labels */
}

#dialogSignIn a {
	margin-right: 5px;
}

form.alignedForm fieldset fieldset {
	border: none;
	margin: 3px 0 0;
	text-align: center;
}

form.alignedForm fieldset fieldset legend {
	padding: 0 0 2px;
	font-weight: normal;
}

form.alignedForm fieldset fieldset label {
	display: block;
	width: auto;
}

form.alignedForm fieldset fieldset label {
	margin-left: 0; /* Width plus 3 (html space) */
}

/* .idp_rect {
	position:relative;
	cursor:default;
	left:0;
	top:0;
	width:462px;
	height:300px;
}

#j2signIn.j2launchV2 .idp_rect {
	position: relative;
    cursor: default;
    width: 650px;
    height: 145px;
}

.idp_rect div.j2rectangle.j2border {
	border: 1px solid #85dbc2;
}

.idp_rect div.j2rectangle {
	position:absolute;
	left:0;
	top:0;
	width: 460px;
	height:300px;
	background-color:white;
	border-top-left-radius:30px;
	border-top-right-radius:30px;
	border-bottom-right-radius: 30px;
	border-bottom-left-radius:30px;
} */

/* .idp_image.bgfl {left: 260px;top: 215px;width: 190px;height: 57px;}
.idp_image.Dudley {left: 318px;top: 199px;width: 80px;height: 80px;}
.idp_image.hwb {left: 46px;top: 82px;width: 80px;height: 80px;}
.idp_image.kentlz {left: 168px;top: 24px;width: 81px;height: 50px;}
.idp_image.lgfl {left: 24px;top: 24px;width: 125px;height: 50px;}
.idp_image.norfolk {left: 36px;top: 249px;width: 202px;height: 30px;}
.idp_image.RMUnify {left: 168px;top: 92px;width: 100px;height: 62px;}
.idp_image.somerset {left: 396px;top: 92px;width: 52px;height: 88px;}
.idp_image.swansea {left: 293px;top: 92px;width: 69px;height: 93px;}
.idp_image.worcs {left: 268px;top: 26px;width: 180px;height: 47px;}
.idp_image.google {left: 42px;top: 178px;width: 191px;height: 46px;}
.idp_image.microsoft {left: 250px;top: 178px;width: 164px;height: 49px;} */
/*.idp_image.ngn {left: 24px;top: 180px;width: 227px;height: 44px;}*/

/* img.idp_image {position:absolute; cursor:pointer;padding:0;} */
img.idp_image:hover {outline:3px solid rgb(133, 208, 243);}
/* #j2signIn.j2launchV2 img.idp_image:hover {outline-color:#83D04A;}
#j2signIn.j2launchV2.bloggy img.idp_image:hover {outline-color:#F34000;}
#j2signIn.j2launchV2.visualprod img.idp_image:hover {outline-color:#85DBC2;}
#j2signIn.j2launchV2.microbitprod img.idp_image:hover {outline-color:#38bad4;}
#j2signIn.j2launchV2.logoprod img.idp_image:hover {outline-color:#5c8ec2;}
#j2signIn.j2launchV2.dataprod img.idp_image:hover {outline-color:#5CB1C7;}
#j2signIn.j2launchV2.jit5prod img.idp_image:hover {outline-color:#FFCE1C;}
#j2signIn.j2launchV2.blastprod img.idp_image:hover {outline-color:#777777;}
#j2signIn.j2launchV2 .idp_image.bgfl {left: 190px;top: 24px;width: 128px;height: 41px;}
#j2signIn.j2launchV2 .idp_image.hwb {left: 380px;top: 88px;width: 125px;height: 45px;}
#j2signIn.j2launchV2 .idp_image.kentlz {left:452px; top:8px; width:63px; height:39px;display:none;}
#j2signIn.j2launchV2 .idp_image.lgfl {left: 40px;top: 21px;width: 128px;height: 55px;}
#j2signIn.j2launchV2 .idp_image.norfolk {left:399px; top:63px; width:162px; height:24px;display:none;}
#j2signIn.j2launchV2 .idp_image.RMUnify {left:350px; top:6px; width:77px; height:47px;display:none;}
#j2signIn.j2launchV2 .idp_image.school360 {display:none;}
#j2signIn.j2launchV2 .idp_image.somerset {left:230px; top:2px; width:31px; height:52px;display:none;}
#j2signIn.j2launchV2 .idp_image.worcs {left:123px; top:60px; width:115px; height:30px;display:none;}
#j2signIn.j2launchV2 .idp_image.google {left: 340px;top: 31px;width: 128px;height: 34px;}
#j2signIn.j2launchV2 .idp_image.microsoft {left: 500px;top: 29px;width: 122px;height: 39px;}
#j2signIn.j2launchV2 .idp_image.c2k {left: 170px;top: 90px;width: 149px;height: 41px;} */
/* .idp_image.Dudley {left: 318px;top: 199px;width: 80px;height: 80px;} */
/*.idp_image.ngn {left: 24px;top: 180px;width: 227px;height: 44px;}*/
/*.idp_image.swansea {left:286px; top:1px; width:40px; height:54px;}*/


.idp_rect {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
    margin: 15px 0px;
    position: relative;
    padding-top: 17px;
    border-top: 2px solid #f2f2f2;
    gap: 15px;
}

.idp_rect img.idp_image {
    max-height: 45px;
    cursor: pointer;
    border-radius: 6px;
    border: 1px solid transparent;
}
img.idp_image.border {
    border-color: #acb3b9;
}
.idp_rect span.or {
    position: absolute;
    top: -12px;
    background: #fff;
    padding: 5px 15px;
    color: #b4b4b4;
}
/** new just2easy dialogue css */
#j2signIn.j2launchV2 {background-color: white;}

#j2signIn.j2launchV2 .signinAsset 				{background-image:url(/assets/htmlsignin/assets3.png);background-size: 1024px 1120px;}

#j2signIn.j2launchV2 .alignedForm {
	background-position: 0px -260px;
    width: 690px;
    height: 238px;
}
#j2signIn.j2launchV2 form.alignedForm fieldset {
	padding-top: 11px;
    padding-left: 250px;
    width: 412px;
}
#j2signIn.j2launchV2 form.alignedForm fieldset li {margin: 7px 0;}
#j2signIn.j2launchV2 form.alignedForm fieldset li:first-child {margin-bottom: 23px;}
#j2signIn.j2launchV2 form.alignedForm fieldset li:nth-last-child(2) {margin:0;margin-bottom: 4px;}
#j2signIn.j2launchV2 form.alignedForm fieldset li:nth-last-child(3) {margin-bottom:4px;}
#j2signIn.j2launchV2 form.alignedForm fieldset li:last-child {
	text-align: right;
    margin: 0;
    padding: 0;
}
#j2signIn.j2launchV2 form.alignedForm label {color: white;}
#j2signIn.j2launchV2.bloggy form.alignedForm label {color: #384654;}
#j2signIn.j2launchV2 form.alignedForm input {
	width: 200px;
    border-radius: 5px;
    outline: none;
    border: none;
    margin: 0 2px;
    padding: 0;
    font-size: 12px;
}
#j2signIn.j2launchV2 form.alignedForm input.error {
	border: 2px solid red;
    padding: 2px;
    margin-left: -1px;
}
#j2signIn.j2launchV2 form.alignedForm font {color: #83D04A;}
#j2signIn.j2launchV2.bloggy form.alignedForm font {color: #F34000;}
#j2signIn.j2launchV2.microbitprod form.alignedForm font {color: #bef4ff;}
#j2signIn.j2launchV2.logoprod form.alignedForm font {color: #67c9ee;}
#j2signIn.j2launchV2.dataprod form.alignedForm font {color: #A5DEF4;}
#j2signIn.j2launchV2.jit5prod form.alignedForm font {color: #FFCE1C;}
#j2signIn.j2launchV2 .j2rememberwrap {float:right;margin-right:2px;}
#j2signIn.j2launchV2 label[for="j2remember"], #j2signIn.j2launchV2 input#j2remember {width:auto;}
#j2signIn.j2launchV2 #jremind {
	font-size: 12px;
    color: #BEF4FF;
    vertical-align: bottom;
    margin-right: 14px;
}
#j2signIn.j2launchV2.bloggy #jremind {color: #F34000;}
#j2signIn.j2launchV2 #jlang {background:none !important;border:none !important;outline:none !important;}
#j2signIn.j2launchV2 #jlang.flagButton>span.ui-icon {margin-left: -13px; margin-top: -7px;}
#j2signIn.j2launchV2 #singleSignIn {
	background: none;
    border: none;
    background-color: #83D04A;
    color: white;
    font-weight: normal;
    margin-right: 6px;
    font-size: 1em;
    float:none;
}
#j2signIn.j2launchV2 #qrSignIn {
	background-color: transparent;
    background-position: -693px -40px;
    padding-right: 32px;
    border: none;
    font-size: 1em;
    margin-right: 10px;
}
#j2signIn.j2launchV2.bloggy #singleSignIn {background-color: #F34000;}
#j2signIn.j2launchV2.visualprod #singleSignIn {background-color: #72D6B5;}
#j2signIn.j2launchV2.microbitprod #singleSignIn {background-color: #A5DEF4;}
#j2signIn.j2launchV2.logoprod #singleSignIn {background-color: #A3D72E;}
#j2signIn.j2launchV2.dataprod #singleSignIn {background-color: #A5DEF4;color:#007B95;}
#j2signIn.j2launchV2.jit5prod #singleSignIn {background-color: #FFCE1C !important;color: #333 !important;}
#j2signIn.j2launchV2.blastprod #singleSignIn {border-radius: 0;-ms-transform:skewX(-4deg);-webkit-transform:skewX(-4deg);transform:skewX(-4deg);}
#j2signIn.j2launchV2 #singleSignIn span {padding: 3px 8px;}

#j2signIn.j2launchV2 .signinstr {
    position: relative;
    top: -89px;
    left: 189px;
    color: #bef4ff;
    display: inline-block;
}
#j2signIn.j2launchV2.bloggy .signinstr {color:#F34000;}
#j2signIn.j2launchV2.blastprod .signinstr {
	top: -153px;
    left: 130px;
    color: #FCFCFC;
    font-size: 13px;
}
#j2signIn.j2launchV2.blastprod label[for="j2remember"], #j2signIn.j2launchV2.blastprod #jremind {color: #FCFCFC;font-size: 13px;text-decoration:none;}
#j2signIn.j2launchV2.blastprod .button_rect > div {background-color:transparent;}

/* #j2signIn.j2launchV2 .button_rect {
	text-align: center;
	width: 690px;
	position: relative;
    margin: 10px auto;
    margin-bottom: 0;
} */
.button_rect {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    margin: 15px 0px;
    border-top: 1px solid #eaeaea;
    padding-top: 10px;
    justify-content: space-around;
}
#j2signIn.j2launchV2 .button_rect > div {
	width: 156px;
	height: 50px;
	border: none;
	vertical-align: middle;
    display: inline-table;
    margin-bottom: 15px;
}
#j2signIn.j2launchV2 #singleSignIn.ui-state-active {color: #333;}
#j2signIn.j2launchV2 .button_rect > div:last-child {margin-right: 0;}
#j2signIn.j2launchV2 .button_rect > div#createAccount {background-position: 0 0;opacity: 0.88;}
#j2signIn.j2launchV2 .button_rect > div#videos {background-position: -141px 0;}
#j2signIn.j2launchV2 .button_rect > div#help {background-position: -177px 0;opacity: 0.88;}
#j2signIn.j2launchV2 .button_rect > div#appstore {background-position: -421px 0;}
#j2signIn.j2launchV2 .button_rect > div.company {background-position: -531px 0;opacity: 0.88;}
#j2signIn.j2launchV2 .button_rect > div#parentportal {background-position: -354px 0;opacity: 0.88;}
#j2signIn.j2launchV2 .button_rect > div:hover,
#j2signIn.j2launchV2 .button_rect > div:focus {
    opacity: 1 !important;
}

#j2signIn.j2launchV2 .button_rect > div > span {
	white-space: pre-line;
    color: white;
    font-weight: normal;
    margin: 0;
    padding: 0;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}
#j2signIn.j2launchV2 .button_rect > div > span:first-child {font-size:12px;}
#j2signIn.j2launchV2 .button_rect > div#videos > span:first-child,
#j2signIn.j2launchV2 .button_rect > div#help > span:first-child {
	font-size:16px;
}
#j2signIn.j2launchV2 #networkUsers {
    display: inline-block;
    vertical-align: middle;
    width: 205px;
    height: 23px;
}
#j2signIn.j2launchV2 #networkUsers > div {
	padding: 5px 0;
    font-size: 11px;
    cursor: pointer;
    color: #293a4a;
    text-align: center;
}
#j2signIn.j2launchV2 #networkUsers .sortdown {
	background-position: -845px 0px;
    float: right;
    margin: 3px 5px;
    width: 11px;
    height: 11px;
}

#j2signIn.j2launchV2 #qrcodereader video {
	width: 320px;
    position: relative;
    margin: 10px auto 0 auto;
    display: block;
}
#qrreader-canvas {display:none;}

.show-hidepw {
    display: block;
}
.showhidecontainer {
    position: fixed;
    margin-left: -20px;
    display: inline-block;
    width: 20px;
    height: 20px;
    padding-top: 3px;
}

#dialogueRegisterSchool li .wondecharge {
    color: #a0a0a0;
    float: right;
}


@media all and (max-width: 730px){
	div#j2signIn.j2launchV2 {
		width:400px;
		padding: 10px;
	}

	#j2signIn.j2launchV2 .alignedForm {
		width: 400px;
		height: 400px;
		background-position: 0 -517px;
	}

	#j2signIn.j2launchV2 form.alignedForm fieldset {
		padding-left: 0;
		padding-top: 174px;
    	width: 388px;
	}

	#j2signIn.j2launchV2 form.alignedForm label {width: 13em;}
	#j2signIn.j2launchV2 form .j2rememberwrap > label {width:11em;}

	/* #j2signIn.j2launchV2 .idp_rect {
	    width: 400px;
	    height: 190px;
	} */

	/* #j2signIn.j2launchV2 .idp_image.lgfl {left: 60px;top: 21px;width: 130px;height: 52px;}
    #j2signIn.j2launchV2 .idp_image.bgfl {left: 206px;top: 83px;width: 150px;height: 45px;}
    #j2signIn.j2launchV2 .idp_image.google {left: 42px;top: 92px;width: 150px;height: 36px;}
    #j2signIn.j2launchV2 .idp_image.microsoft {left: 130px;top: 140px;width: 122px;height: 39px;}
    #j2signIn.j2launchV2 .idp_image.hwb {left: 210px;top: 24px;width: 125px;height: 45px;} */

	/* #j2signIn.j2launchV2 .button_rect {
		width: 272px;
	    white-space: normal;
	} */
	/* #j2signIn.j2launchV2 .button_rect > div:nth-child(even) {margin-right: 0;}
	#j2signIn.j2launchV2 .button_rect > div {margin: 0 20px 10px 0;}
	#j2signIn.j2launchV2 .button_rect > div.company {width:272px; background-position: 0 -130px;} */
	#j2signIn.j2launchV2 .signinstr {display:none;}
}

.ui-autocomplete {
	max-height: 200px;
	overflow-y: auto;
	/* prevent horizontal scrollbar */
	overflow-x: hidden;
}
/* IE 6 doesn't support max-height we use height instead, but this forces the menu to always be this tall */
* html .ui-autocomplete {
  height: 200px;
}


/*
	Parent portal alert styles
*/

.alert_parent {
    width: calc(100vw / 2.6);
    background: #937cc5;
    padding: 15px 30px;
    position: fixed;
    top: 15px;
    left: 50%;
    transform: translate(-50%);
    color: #eef3f7;
    line-height: 1.3em;
    display: flex;
    flex-direction: column;
    border: 2px solid #8363c8;
}

.alert_parent > p {
    margin-bottom: 10px;
    text-align: center;
}

.alert_parent > a.continue {
    padding: 5px 11px;
    background: #fbf9ff;
    text-decoration: none;
    border: 2px solid #8363c8;
    color: #31b8cc;
    border-radius: 6px;
    align-self: center;
}

.alert_parent a.close {
    font-size: 20px;
    color: #fff;
    position: absolute;
    top: 10px;
    right: 10px;
    text-decoration: none;
}

.alert_parent > a.continue:hover {
    background: #f7f7f7;
    border-color: #6e52ab;
    color: #2698a8;
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

.j2eListPanel div#scroll .xxx_wrapper .label{
	margin-bottom:5px;
	font-weight:bold;
	word-break: break-word;
	text-align: center;
}

.j2eListPanel div#scroll .xxx_wrapper #j2dropmenu{
	position:absolute;
	right:1px;
	top:1px;
}

.j2eListPanel div#scroll .xxx_wrapper .j2dropmenu{
	position:absolute;
	right:1px;
	top:1px;
}

.j2eListPanel div#scroll .xxx_wrapper .label b{
	margin-left:5px;
}

.j2eListPanel div#scroll .xxx_wrapper{
	display:inline-block;margin-top:5px; position:relative; cursor:move;
}
	
.j2eListPanel div#scroll .j2graphic{
	cursor:move !important;
}
	
.j2eListPanel.displayRight div#scroll .xxx_wrapper{
	display:block;
	width:130px;
	margin-left:auto;
	margin-right:auto;
}
	
.j2eListPanel div#scroll .xxx_wrapper .public, .j2eListPanel div#scroll .xxx_wrapper .public.moderate{
	background-image: url('/e5/images/markShapes.png');
	background-size: 336px 96px;
	background-position: -144px 0;	
	background-repeat: no-repeat;
	position:absolute;
	width:48px;
	height:48px;
	left:-15px;
	top:8px;
}

.j2eListPanel div#scroll .xxx_wrapper .moderate{
	background-image: url('/e5/images/markShapes.png');
	background-size: 336px 96px;
	background-position: 0 -48px;	
	background-repeat: no-repeat;
	position:absolute;
	width:35px;
	height:35px;
	left:-5px;
	top:8px;
}

.j2eListPanel div#scroll .xxx_wrapper .shared{
	background-image: url('/e5/images/markShapes.png');
	background-size: 336px 96px;
	background-position:0 -48px;	
	background-repeat: no-repeat;
	position:absolute;
	width:48px;
	height:48px;
	left:-15px;
	top:8px;
}

.j2eListPanel div#scroll .xxx_wrapper .mark{
	background-repeat: no-repeat;
	position:absolute;
	width:50px;
	height:50px;
	left: -5px;
	top: 25px;
}

.j2eListPanel div#scroll .xxx_wrapper .goldstar{
	background-image: url('/markShapes/gold+star.png');
}

.j2eListPanel div#scroll .xxx_wrapper .ten{
	background-image: url('/markShapes/ten.png');
}

.j2eListPanel div#scroll .xxx_wrapper .silverstar{
	background-image: url('/markShapes/silver+star.png');
}

.j2eListPanel div#scroll .xxx_wrapper .bronzestar{
	background-image: url('/markShapes/bronze+star.png');
}

.j2eListPanel div#scroll .xxx_wrapper .smile{
	background-image: url('/markShapes/smile.png');
}

.j2eListPanel div#scroll .xxx_wrapper .wink{
	background-image: url('/markShapes/wink.png');
}

.j2eListPanel div#scroll .xxx_wrapper .correct{
	background-image: url('/markShapes/correct.png');
}

.j2eListPanel div#scroll .xxx_wrapper .sad{
	background-image: url('/markShapes/sad.png');
}

.j2eListPanel div#scroll .xxx_wrapper .wrong{
	background-image: url('/markShapes/wrong.png');
}

.j2eListPanel div#scroll .xxx_wrapper .pin{
	background-image: url('/markShapes/pin.png');
}

.j2eListPanel #scrollPrev{width:16px;height:16px;display:inline-block;top:4px;margin-right:5px;}
.j2eListPanel #scrollNext{width:16px;height:16px;display:inline-block;top:4px;margin-left:5px;}
.j2eListPanel #scrollUp{width:16px;height:16px;display:inline-block;top:4px;margin-left:5px;}

.j2eListPanel {
	position:fixed;
	z-index:900;
}

.j2eListPanel.displayRight {
	max-width:170px;
	position:relative;
}

/*.j2eListPanel #tabs {height:170px;}*/

.j2eListPanel.displayRight #tabs {height:100%;}

.j2filepreview{cursor:pointer !important}
/*.j2eListPanel:not(.displayRight) .j2filepreview,.j2eListPanel:not(.displayRight) .j2photo,.j2eListPanel:not(.displayRight) .lpcontent {height:80px;width:auto;padding-bottom:0}*/
.j2eListPanel.displayRight .j2filepreview,.j2eListPanel.displayRight .j2photo,.j2eListPanel.displayRight .j2graphic,.j2eListPanel.displayRight .j2audiojp,.j2eListPanel.displayRight .j2videojp,.j2eListPanel.displayRight .lpcontent {position:relative !important;width:auto;height:auto;padding-bottom:0}

.j2eListPanel .ui-tabs .ui-tabs-panel {padding:0;padding-bottom:0;font-size:1em;}
.j2eListPanel:not(.displayRight) .ui-tabs .ui-tabs-panel {height:100%;}

.j2eListPanel div#scroll >*{margin-right:10px; padding-bottom:5px; }

.j2eListPanel.displayRight .ui-tabs .ui-tabs-panel #scroll {vertical-align:middle; display:inline-block; overflow-x:auto; overflow-y:hidden; height:100%; width:100%}

.j2eListPanel.displayRight .ui-tabs .ui-tabs-panel #scroll {display:block; overflow-y:auto; overflow-x:hidden;}

.j2eListPanel.displayRight .ui-tabs .ui-tabs-panel #scroll.showDrag {margin-left:0;margin-top:0; overflow-y:visible; overflow-x:visible;}
.j2eListPanel .ui-tabs .ui-tabs-panel .scrollButton{vertical-align:middle;}
.j2eListPanel .ui-tabs .ui-tabs-panel .scrollButton.vertical{display:block;width:100%;height:20px;}
.j2eListPanel .ui-tabs .ui-tabs-panel .scrollButton.horizontal{display:inline;width:20px;height:100%;}

.j2eListPanel.displayRight .ui-tabs .ui-tabs-nav li {display:inline-block; float:none;}
.j2eListPanel .ui-tabs .ui-tabs-nav li a.iconTabs {padding:0;outline:none;}
.j2eListPanel .ui-tabs .ui-tabs-nav li .ui-icon {width:32px;}
.j2eListPanel .tabTitle{padding:5px 0 5px 5px;border:0;background-image:none;background-color:transparent}

.j2eListPanel .crumb{cursor:pointer;}
.j2eListPanel .crumb:hover{text-decoration:underline !important;}

.j2eListPanel .closeButton {margin-right:5px; margin-top:10px;position:absolute;left:150px}
.j2eListPanel .j2searchBar {margin-top: -1px; padding-top: 5px;}

.displayPanel .j2searchBar {
position: absolute;
padding-top: 0px;
margin-top: 0px;
left: 160px;
z-index: 10;
}

.displayPanel {
position: relative;
white-space: normal;
height: 300px;
}

.displayPanel .ui-tabs-nav.ui-helper-reset.ui-helper-clearfix.ui-widget-header.ui-corner-all {
background: none;
border: none;
border-bottom: 1px solid #4297d7;
border-radius: 0;
}

.displayPanel #tabs {
border: none;
}

.displayPanel #tabs-0, .displayPanel #tabs-1, .displayPanel #tabs-2, .displayPanel #tabs-3{
border: 1px solid #4297d7;
}

.displayPanel .ui-tabs-nav.ui-helper-reset.ui-helper-clearfix.ui-widget-header.ui-corner-all {
background: none;
border: none;
border-radius: 0;
}

.j2eListPanel.displayPanel .ui-tabs .ui-tabs-panel #scroll {
margin:10px;
margin-right:18px;
overflow-y:scroll;
height:315px;
}

.j2eListPanel img {
margin-bottom: 20px;
max-width: 130px;
max-height: 100px;
}

.displayPanel img {
margin-bottom: 20px;
max-width: 180px;
max-height: 100px;
}

#filer {
min-width: 674px;
}

.displayPanel .tabTitle {
padding-right: 10px;
padding-left: 10px;
}

.displayPanel div#scroll .xxx_wrapper {
margin-top: 0px;
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

/* flag for languages menu */
.flag {
	width:16px; 
	height:11px; 
	display:inline-block;
	
	/* inline block fix */
	zoom:1;
	*display:inline;
}
/* flag for button bar */
.flagButton {
	height: 22px;
	vertical-align: middle;
	/*width: 18px;
	background-position:center center;
	display:inline-block;/*
	
	/* inline block fix */
	/*zoom:1;
	*display:inline;*/
}
.flagButton>span.ui-icon {height: 11px; margin-top: -6px; background-image: url('/e5/images/flags-11.png') !important;}
#menuLanguage .flag {background-image: url('/e5/images/flags-11.png') !important;}
.english {background-position: -2px -2px;}
.german {background-position: -22px -1px;}
.turkish {background-position: -42px -1px;}
.portuguese {background-position: -62px -1px;}
.spanish {background-position: -82px -1px;}
.dutch {background-position: -102px -1px;}
.french {background-position: -122px -1px;}
.italian {background-position: -142px -1px;}
.cantonese {background-position: -162px -1px;}
.norwegian {background-position: -182px -1px;}
.welsh {background-position: -202px -1px;}
.danish {background-position: -222px -1px;}
.finnish {background-position: -242px -1px;}
.russian {background-position: -262px -1px;}
.swedish {background-position: -282px -1px;}

.arabic {background-position: -2px -16px;}
.azerbaijani {background-position: -22px -16px;}
.bulgarian {background-position: -42px -16px;}
.croatian {background-position: -62px -16px;}
.czech {background-position: -82px -16px;}
.estonian {background-position: -102px -16px;}
.georgian {background-position: -122px -16px;}
.hungarian {background-position: -142px -16px;}
.kazakh {background-position: -162px -16px;}
.latvian {background-position: -182px -16px;}
.lithuanian {background-position: -202px -16px;}
.macedonian {background-position: -222px -16px;}
.maltese {background-position: -242px -16px;}
.polish {background-position: -262px -16px;}
.romanian {background-position: -282px -16px;}

.serbian {background-position: -2px -32px;}
.slovak {background-position: -22px -32px;}
.slovenian {background-position: -42px -32px;}
.turkmen {background-position: -62px -32px;}
.englishUS {background-position: -82px -32px;}
.brazilian {background-position: -102px -32px;}
.thai {background-position: -122px -32px; }
.vietnamese {background-position: -142px -32px;}
.mandarin {background-position: -162px -32px;}
.irish {background-position: -182px -32px;}
.malay {background-position: -202px -32px;}
.ukrainian {background-position: -222px -32px;}

/*
// Copyright Just2easy Limited 2016 all rights reserved.
*/

#menuNetworkUsers {
	background-color: #293A4A;
	border-color: #293A4A;
	padding: 0;
}
#menuNetworkUsers .j2eMenuItem {
	color: white;
    background-color: #354350;   
}
#menuNetworkUsers .j2eMenuItem:first-child > div {
	color: #293A4A;
    background-color: white;
    font-family: 'Lucida Grande', 'Lucida Sans', Arial;
    font-size: 11px;
    background-position: -443px -125px;
    padding: 5px 0;
    text-align: center;
}
#menuNetworkUsers span.sortup {
	background-position: -866px 0px;
    float: right;
    margin: 3px 5px;
    width: 11px;
    height: 11px;
}
#menuNetworkUsers .j2eMenuOver {
	background-color: #43576C;
}

#menuNetworkUsers img {
	height: 20px;
	margin-right: 10px;
	vertical-align: middle;
}

#menuNetworkUsers span {
	vertical-align: middle;
	font-size: 11px;
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

.j2eMenu {
	z-index:2000;
	position:absolute;
	/*padding:5px;*/
	font-family: "Lexend", 'ABeeZee', sans-serif;
	font-size: 14px;
	background:white;
}
.j2eMenuItem {
	text-align:left;
	cursor:pointer;
	list-style-type:none;
	padding:5px 15px;
	border:0;
	color:#555;
	background:white;
	white-space:nowrap;
	display:list-item;
}
.j2eMenuItem.disabled {color:#BBB;}
.j2eMenuItem.cheveron {padding-right:10px;}
.j2eMenuItem.cheveron div {font-size: 100%;color: #555;}
.j2eMenuItem.cheveron span.right {float: right;}
.j2eMenuItem.cheveron span.left {float: left;margin-right:15px;}
.j2eMenuItem.cheveron div.both {clear: both;}
.j2MenuText {
	color: #1D5987;
}
.j2eMenuSeparator {
	text-align:left;
	cursor:default;
	list-style-type:none;
	padding:0;
	border:0;
	border-bottom:1px solid #A6C9E2;
	margin-top:2px;
	margin-bottom:2px;
	background:white
}
.j2eMenuOver {
	background:lightblue;
	color:white;
}
.colourMenu {
	width:20px;
	height:15px;
	border:1px solid black;
	display:inline-block;
	margin-right:5px;
	position:relative;
	top:3px;
}
.menuTick {
	position:relative;
	display:inline-block;
	margin-left:-20px;
	margin-right:4px;
	left:4px;
}

.j2eMenuItem .deleteButton {
	float: right;
	display: inline-block;
	opacity: 0;
}

.menuRevision {
	color:#2b8ad4;
	font-weight:bold;
}

#menuRevisions .j2eMenuItem {
	text-align:right;
}

.j2eMenuOver .deleteButton {
	opacity: 1;
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

/* SndJPlayer css */
.j2audiojp {width:120px !important;}
.j2audiojp .jp-controls {width:90px !important;}
.j2audiojp-link {position:absolute !important;left:-10000px !important;top:-10000px !important;border:none !important;}

/* VideoJPlayer css */
.j2videojp {margin-bottom:5px;}

/* myfiles css */
#content #scroll .j2videojp {width:160px !important;}
#content #scroll .j2videojp .jp-interface {position:absolute; top:49px; display:none;}
#content #scroll .j2videojp .jp-controls {margin-left: 55px !important;}

#scroll .j2videojp .jp-controls-holder {top: 0px; width:160px;}
#scroll .j2videojp .jp-mute, #scroll .j2videojp .jp-unmute {left: 20px;}
#scroll .j2videojp .jp-progress,
#scroll .j2videojp .jp-current-time,
#scroll .j2videojp .jp-duration,
#scroll .j2videojp .jp-volume-max,
#scroll .j2videojp .jp-volume-bar,
#scroll .j2videojp .jp-toggles {
	display:none !important;
}

div.j2videojp .jp-jplayer img {
	width: auto !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
/**
 * Farbtastic Color Picker 1.2
 * © 2008 Steven Wittens
 *
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program; if not, write to the Free Software
 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
 */
.farbtastic {
  position: relative;
}
.farbtastic * {
  position: absolute;
  cursor: crosshair;
}
.farbtastic, .farbtastic .wheel {
  width: 195px;
  height: 195px;
}
.farbtastic .color, .farbtastic .overlay {
  top: 47px;
  left: 47px;
  width: 101px;
  height: 101px;
}
.farbtastic .wheel {
  background: url(wheel.png) no-repeat;
  width: 195px;
  height: 195px;
}
.farbtastic .overlay {
  background: url(mask.png) no-repeat;
}
.farbtastic .marker {
  width: 17px;
  height: 17px;
  margin: -8px 0 0 -8px;
  overflow: hidden; 
  background: url(marker.png) no-repeat;
}

.tooltipster-sidetip.tooltipster-punk .tooltipster-box{border-radius:5px;border:none;border-bottom:3px solid #f71169;background:#2a2a2a}.tooltipster-sidetip.tooltipster-punk.tooltipster-top .tooltipster-box{margin-bottom:7px}.tooltipster-sidetip.tooltipster-punk .tooltipster-content{color:#fff;padding:8px 16px}.tooltipster-sidetip.tooltipster-punk .tooltipster-arrow-background{display:none}.tooltipster-sidetip.tooltipster-punk.tooltipster-bottom .tooltipster-arrow-border{border-bottom-color:#2a2a2a}.tooltipster-sidetip.tooltipster-punk.tooltipster-left .tooltipster-arrow-border{border-left-color:#2a2a2a}.tooltipster-sidetip.tooltipster-punk.tooltipster-right .tooltipster-arrow-border{border-right-color:#2a2a2a}.tooltipster-sidetip.tooltipster-punk.tooltipster-top .tooltipster-arrow-border{border-top-color:#f71169}.tooltipster-fall,.tooltipster-grow.tooltipster-show{-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1);-moz-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-ms-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-base{display:flex;pointer-events:none;position:absolute}.tooltipster-box{flex:1 1 auto}.tooltipster-content{box-sizing:border-box;max-height:100%;max-width:100%;overflow:auto}.tooltipster-ruler{bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;visibility:hidden}.tooltipster-fade{opacity:0;-webkit-transition-property:opacity;-moz-transition-property:opacity;-o-transition-property:opacity;-ms-transition-property:opacity;transition-property:opacity}.tooltipster-fade.tooltipster-show{opacity:1}.tooltipster-grow{-webkit-transform:scale(0,0);-moz-transform:scale(0,0);-o-transform:scale(0,0);-ms-transform:scale(0,0);transform:scale(0,0);-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform;-webkit-backface-visibility:hidden}.tooltipster-grow.tooltipster-show{-webkit-transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);transform:scale(1,1);-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-swing{opacity:0;-webkit-transform:rotateZ(4deg);-moz-transform:rotateZ(4deg);-o-transform:rotateZ(4deg);-ms-transform:rotateZ(4deg);transform:rotateZ(4deg);-webkit-transition-property:-webkit-transform,opacity;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform}.tooltipster-swing.tooltipster-show{opacity:1;-webkit-transform:rotateZ(0);-moz-transform:rotateZ(0);-o-transform:rotateZ(0);-ms-transform:rotateZ(0);transform:rotateZ(0);-webkit-transition-timing-function:cubic-bezier(.23,.635,.495,1);-webkit-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);-moz-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);-ms-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);-o-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);transition-timing-function:cubic-bezier(.23,.635,.495,2.4)}.tooltipster-fall{-webkit-transition-property:top;-moz-transition-property:top;-o-transition-property:top;-ms-transition-property:top;transition-property:top;-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-fall.tooltipster-initial{top:0!important}.tooltipster-fall.tooltipster-dying{-webkit-transition-property:all;-moz-transition-property:all;-o-transition-property:all;-ms-transition-property:all;transition-property:all;top:0!important;opacity:0}.tooltipster-slide{-webkit-transition-property:left;-moz-transition-property:left;-o-transition-property:left;-ms-transition-property:left;transition-property:left;-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1);-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-moz-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-ms-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-slide.tooltipster-initial{left:-40px!important}.tooltipster-slide.tooltipster-dying{-webkit-transition-property:all;-moz-transition-property:all;-o-transition-property:all;-ms-transition-property:all;transition-property:all;left:0!important;opacity:0}@keyframes tooltipster-fading{0%{opacity:0}100%{opacity:1}}.tooltipster-update-fade{animation:tooltipster-fading .4s}@keyframes tooltipster-rotating{25%{transform:rotate(-2deg)}75%{transform:rotate(2deg)}100%{transform:rotate(0)}}.tooltipster-update-rotate{animation:tooltipster-rotating .6s}@keyframes tooltipster-scaling{50%{transform:scale(1.1)}100%{transform:scale(1)}}.tooltipster-update-scale{animation:tooltipster-scaling .6s}.tooltipster-sidetip .tooltipster-box{background:#565656;border:2px solid #000;border-radius:4px}.tooltipster-sidetip.tooltipster-bottom .tooltipster-box{margin-top:8px}.tooltipster-sidetip.tooltipster-left .tooltipster-box{margin-right:8px}.tooltipster-sidetip.tooltipster-right .tooltipster-box{margin-left:8px}.tooltipster-sidetip.tooltipster-top .tooltipster-box{margin-bottom:8px}.tooltipster-sidetip .tooltipster-content{color:#fff;line-height:18px;padding:6px 14px}.tooltipster-sidetip .tooltipster-arrow{overflow:hidden;position:absolute}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow{height:10px;margin-left:-10px;top:0;width:20px}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow{height:20px;margin-top:-10px;right:0;top:0;width:10px}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow{height:20px;margin-top:-10px;left:0;top:0;width:10px}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow{bottom:0;height:10px;margin-left:-10px;width:20px}.tooltipster-sidetip .tooltipster-arrow-background,.tooltipster-sidetip .tooltipster-arrow-border{height:0;position:absolute;width:0}.tooltipster-sidetip .tooltipster-arrow-background{border:10px solid transparent}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background{border-bottom-color:#565656;left:0;top:3px}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background{border-left-color:#565656;left:-3px;top:0}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background{border-right-color:#565656;left:3px;top:0}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background{border-top-color:#565656;left:0;top:-3px}.tooltipster-sidetip .tooltipster-arrow-border{border:10px solid transparent;left:0;top:0}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border{border-bottom-color:#000}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border{border-left-color:#000}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border{border-right-color:#000}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border{border-top-color:#000}.tooltipster-sidetip .tooltipster-arrow-uncropped{position:relative}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped{top:-10px}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped{left:-10px}/*
// Copyright (c) Just2easy Limited 2010,17 all rights reserved.
*/

@-ms-viewport{ width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; }

@media all and (max-width: 970px){
  .ui-tabs-nav {
    display:none;
  }
  #photos .ui-tabs-nav {
  	display:block; /*for camera dialogue myfiles tabs*/
  }

  #tabsDropdown {
  	display:block;
  }

  #dropTabs {
  	display:none;
  }
}

@media all and (min-width: 969px){
  #tabsDropdown {
  	display:none;
  }
}

@font-face{
	font-family: writingFont;
	src: local('writingFont'), url('/e5/fonts/testfont-webfont.eot?ver=2');
    src: local('writingFont'), url('/e5/fonts/testfont-webfont.eot?ver=2#iefix') format('embedded-opentype'),
         url('/e5/fonts/testfont-webfont.woff2?ver=2') format('woff2'),
         url('/e5/fonts/testfont-webfont.woff?ver=2') format('woff'),
         url('/e5/fonts/testfont.ttf?ver=2') format('truetype'),
         url('/e5/fonts/testfont-webfont.svg?ver=2#testfontregular') format('svg');
}

@font-face {
    font-family: 'comicFont';
    src: local('comicFont'), url('/assets/jit/fonts/jitfont-webfont.eot?ver=2');
    src: local('comicFont'), url('/assets/jit/fonts/jitfont-webfont.eot?ver=2#iefix') format('embedded-opentype'),
         url('/assets/jit/fonts/jitfont-webfont.woff2?ver=2') format('woff2'),
         url('/assets/jit/fonts/jitfont-webfont.woff?ver=2') format('woff'),
         url('/assets/jit/fonts/jITFont.ttf?ver=2') format('truetype'),
         url('/assets/jit/fonts/jitfont-webfont.svg?ver=2#jitfontregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* http://www.gaelchlo.com/urgc.html */
@font-face {
    font-family: 'gaelicFont';
    src: url('/e5/fonts/UrchloGC.woff') format('woff'),
         url('/e5/fonts/UrchloGC.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

#tabs:not(.ui-tabs) > ul > li > a {display:none;}

.noselection {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

body.capturing div#tabsDropdown,
body.capturing div#j2buttonBar,
body.capturing div#buttonBarRight,
body.capturing ul.ui-tabs-nav,
body.capturing div.toolbar,
body.capturing div#titleContainer,
body.capturing div#speakwrite,
body.capturing div#savepic,
body.capturing div#savestamp,
body.capturing div#savegif,
body.capturing div.turtleDragBox > div,
body.capturing div#instruction,
body.capturing div#qhistory,
body.capturing div#bucketButton {
	display: none;
}
body.capturing div#content {
	border: none;
	box-shadow: none;
	-webkit-border-radius: 0px;
}

body.blog div#tabs div.ui-tabs-panel {
	background: none;
}
body.blog div#tabsDropdown,
body.blog div#j2buttonBar,
body.blog div#buttonBarRight,
body.blog ul.ui-tabs-nav,
body.blog div.toolbar,
body.blog div#speaktext,
body.blog:not(.viewonly) div#speakwrite,
body.blog div#savepic,
body.blog div#savegif,
body.blog div#savestamp,
body.blog div.turtleDragBox > div,
body.blog .hideshowanimate,
body.blog div.animatecontrols #play~*,
body.blog div#instruction,
body.blog div#qhistory
body.blog div.toolbar.branch #media-tabs,
body.blog div.toolbar.branch button {
	display: none;
}
body.blog div.toolbar.branch {display:block;}
body.blog div.toolbar.branch .treeItemsWrap {
	position: absolute;
    top: 385px;
    left: 150px;
    height: 60px;
    width: 500px;
}
body.blog div.toolbar.branch .treeItems {white-space: nowrap;}
body.blog div.toolbar.branch .treeItems .branchCardWrap img {width: 30px;}
body.blog div.toolbar.branch .branchCardWrap, .branchCard {
    margin: 0 2px;
    padding: 4px;
}

body.blog #goBlog.goTurtle {
	margin-left: 40%;
	margin-top: 60%;
	background-color:white;
	color: #69C325;
	border: 5px solid #E80067;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	behavior: url(./e5/css3pie/PIE.htc);
}


@media screen and (max-width: 299px) {
    body.blog #goBlog.goTurtle {
        font-size: 0.7em;
    }
}

@media screen and (max-width: 799px) and (min-width: 400px) {
    body.blog #goBlog.goTurtle {
        font-size: 2em;
        padding: 0px 0px 0px 0px;
    }
}

@media screen and (min-width: 800px) {
    body.blog #goBlog.goTurtle {
        font-size: 3em;
    }
}
#tabs .toolbar button span {padding:5px;}
#tabs .toolbar button.plusSize span,
#tabs .toolbar button.minusSize span,
#tabs .toolbar button.flip span,
#tabs .toolbar button.rotate span {padding:3px;}

.round{
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	behavior: url(./e5/css3pie/PIE.htc);
}

#tabsDropdown {
	float: right;
	position: relative;
    width: 205px;
    z-index: 999;
}

#currentDropTab {
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	margin-top: 5px;
}

#tabArrow {
	float: right;
	margin-right: 10px;
	cursor:pointer;
}

.dropTabs {
	font-family: "Lexend", ABeeZee, sans-serif;
	font-size: 16px;
	margin-top: 5px;
}
.dropTabStyle {
	width: 200px;
	height: 27px;
	text-align: center;
	list-style: none;
	padding-top: 10px;
	cursor:pointer;
	color: #fff;
}

.lastTab {
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

.firstTab {
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
}

body{
	font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
	font-size: 10pt;
	overflow-x: hidden;
}

.toolbarButton.ui-button-icon-only .ui-icon,
.clickspeak, #wordtopicspeak,
.mixLayoutDia .tickButton, 	/* update background-size when jit-icons changes size */
#mixButtons > .new,			/* update background-size when jit-icons changes size */
#mixButtons > .load {		/* update background-size when jit-icons changes size */
	background-image:url('/assets/jit/jit-icons-10.png');
}

button.uiButton {outline: 0 solid transparent;}

#j2buttonBar {position:absolute; background:none; border:none; margin-left: 20px;}
#j2buttonBar button.toolbarButton{width:auto;height:auto;}
.toolbarButton{
	position:relative;
	margin:0 1px 0 0;
	vertical-align:middle;
	outline:0 solid transparent;
}
.toolbarButton.ui-button-icon-only .ui-icon{
	padding:0;
	left:0px;
	margin-left:0;
	margin-top:0;
	margin-right:2px;
	position:relative;
	-webkit-filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.5));
	-ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=2, OffY=2, Color='#444')";
	filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=2, OffY=2, Color='#444')";
}

.toolbarButton.ui-button-icon-only .ui-icon:active{
	-webkit-filter: drop-shadow(0px 0px 0px rgba(0,0,0,0.5));
	-ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=0, OffY=0, Color='#444')";
	filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=0, OffY=0, Color='#444')";
}
.toolbarButton.ui-button-icon-only .newButton{
	height:60px;
	width:60px;
	margin-top:-15px;
	margin-left:-2px;
	background-position: -2px -1px;
}
.toolbarButton.ui-button-icon-only .loadButton{
	height:80px;
	width:73px;
	background-position: -62px -2px;
	margin-top:10px;
}
.toolbarButton.ui-button-icon-only .saveButton{
	height:77px;
	width:76px;
	background-position: -136px -1px;
	margin-top: 10px;
	margin-left: 1px;
}
.toolbarButton.ui-button-icon-only .saveButton.changed{
	background-position: -583px -1px;
}

.toolbarButton.ui-button-icon-only .signinButton{
	height:77px;
	width:79px;
	background-position: -357px -1px;
	margin-top: 10px;
}
.toolbarButton.ui-button-icon-only .printButton{
	height:50px;
	width:54px;
	background-position: -211px -1px;
	margin-top:-30px;
}
.toolbarButton.ui-button-icon-only .undoButton{
	height:50px;
	width:46px;
	background-position: -266px -3px;
}

.toolbarButton.ui-button-icon-only .redoButton{
	height:50px;
	width:46px;
	background-position: -314px -3px;
}
.toolbarButton.ui-button-icon-only.webby, .toolbarButton.ui-button-icon-only.itsLearning {
	position: relative;
}
.toolbarButton.ui-button-icon-only .webbyButton{
	height: 64px;
	width: 64px;
	background-position: -436px -2px;
	margin-top: 0px;
}
.toolbarButton.ui-button-icon-only.publishJournal {
	position: relative;
	display: none;
}
.toolbarButton.ui-button-icon-only .journalButton{
	height: 64px;
	width: 64px;
	background-position: -844px 0px;
	margin-top: 0px;
}

.toolbarButton.ui-button-icon-only .itsButton{
	height: 64px;
	width: 64px;
	background-position: -702px -2px;
	margin-top: 0px;
}

button.ui-button.ui-widget {background:none; border:none;outline:none;}

body > #tabs {
    padding: 0px;
    background: none;
    border-width: 0px;
    position: absolute;
    width: 100%;
    height: 100%;
    min-height:600px;
}

body > #tabs .ui-tabs-nav {
    float: right;
    border-left: none;
    padding-left: 0px;
    background: transparent;
    border-width: 0px 0px 1px 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    position: absolute;
    top:0;
    right:0;

    /* IE fix */
	list-style: none;
    list-style-image: none;
    list-style-type: none;
}

body > #tabs.ui-tabs .ui-tabs-panel {
	padding: 0px;
	height: 100%;
}

.ui-tabs-panel .toolbar {
	position: absolute;
	top: 90px;
	width: 210px;
	min-height: 480px;
	padding-left: 20px;
	height: 80%;
}

.ui-tabs-panel .panel {
	position: absolute;
	margin: 0px 5px 20px 0px;
	top: 100px;
	left: 240px;
	right: 0px;
	bottom: 0px;
	background-color: white;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	border:2px;
	border-style:solid;
	border-color:#D9DF33;

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.ui-dialog .ui-dialog-titlebar .tab1, .ui-dialog .ui-dialog-titlebar .tab2, .ui-dialog .ui-dialog-titlebar .tab3 {
	display: inline-block;
	width: 120px;
	height: 40px;
	margin-left: 10px;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
	cursor: pointer;
}

.newDocumentDialog .tabSelected {
	background-color: white;
	color: black;
}

#newDocumentDialog .j2audiojp {
	position:relative;
	top:-50%;
	margin-top:50%;
	margin-left:auto;
	margin-right:auto;
}

.newDocumentDialog .tabNormal {
	background-color: #709302;
	color: white;
}
.newDocumentDialog.paint .tabNormal {background-color: #0A53A8;}
.newDocumentDialog.turtle .tabNormal {background-color: #107800;}
.newDocumentDialog.chart .tabNormal {background-color: #E24807;}
.newDocumentDialog.pictogram .tabNormal {background-color: #AB0001;}
.newDocumentDialog.animate .tabNormal {background-color: #B30054;}
.newDocumentDialog.branch .tabNormal {background-color: #7F0F7C;}
.newDocumentDialog.mix .tabNormal {background-color: #000000;}

.ui-dialog-titlebar .tab1 h3, .ui-dialog-titlebar .tab2 h3, .ui-dialog-titlebar .tab3 h3 {
	float: left;
	width: 120px;
	margin-top: 10px;
	text-align: center;
	font-family: "Lexend", ABeeZee, sans-serif;
	font-size: 17px;
}

.ui-dialog .ui-dialog-titlebar-close i {
    margin-left: 8px;
    margin-top: 8px;
    color: white;
}

.ui-dialog-content .contentBlock {
    margin-top: 30px;
    margin-left: -15px;
    max-height: 270px;
    width: 415px;
    overflow-y: auto;
    overflow-x: hidden;
}
.turtle .ui-dialog-content .contentBlock {
	margin-top: 15px;
	margin-left: 0;
}

.templateImages {
	margin-left: 20px;
	margin-bottom: 15px;
	width: 160px;
	height: 120px;
	display: inline-block;
	background-size: 100%;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	behavior: url(./e5/css3pie/PIE.htc);
	box-shadow: 2px 2px 5px #888888;
	cursor:pointer;
	background-size: cover; /* using cover for pictures tab */
	border: 1px solid #7B8C9D;
}
.templateImages.trans {
	background-image: -moz-linear-gradient(45deg, #CCC 25%, transparent 25%), -moz-linear-gradient(-45deg, #CCC 25%, transparent 25%), -moz-linear-gradient(45deg, transparent 75%, #CCC 75%), -moz-linear-gradient(-45deg, transparent 75%, #CCC 75%);
    background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, #CCC), color-stop(.25, transparent)), -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, #CCC), color-stop(.25, transparent)), -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.75, transparent), color-stop(.75, #CCC)), -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.75, transparent), color-stop(.75, #CCC));
    -moz-background-size: 100px 100px;
    background-size: 100px 100px;
    -webkit-background-size: 30px 31px;
    background-position: 0 0, 15px 0, 15px -15px, 0px 15px;
}
.templateImages > div.timg {
	background-size: cover; /* using cover for pictures tab */
	width: 100%;
	height: 100%;
	border-radius: 10px;
    -webkit-border-radius: 10px;
    overflow: hidden;
}

.templateLabel {
	width: 130px;
	text-align: center;
	margin-top: 89px;
	margin-left: 10px;
	background-color: white;
	padding: 5px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	behavior: url(./e5/css3pie/PIE.htc);
	box-shadow: 2px 2px 5px #CECECE;
	font-family: "Lexend", ABeeZee, sans-serif;
}

.nextBlock, #nextBlock {
	width: 50%;
	margin: 0 auto;
	text-align: right;
	font-size: 20px;
	font-family: "Lexend", ABeeZee, sans-serif;
	color: #40aaf6;
	margin-top: -5px;
}

.nextButton, .prevButton, #prevButton, #nextButton {
	width: 30px;
	height: 30px;
	border: 2px;
	border-style: solid;
	border-color: #3fa9f5;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: green;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #3fa9f5;
	float: right;
	cursor:pointer;
}

.prevButton, #prevButton {
	float: left;
}

#nextText, .nextText {
	margin-left:44px;
	padding-top: 5px;
	float: left;
}

.prevIcon {
	margin-left: 4px;
	display: block;
	width: 20px;
	height: 20px;
	margin-top: 5px;
	color: rgb(255, 175, 55);
}

.nextIcon {
	margin-left: 7px;
	display: block;
	width: 20px;
	height: 20px;
	margin-top: 5px;
	color: rgb(255, 175, 55);
}

.j2text {
	position: relative;
	margin: 0 20px 20px 0;
	font-family: comicFont;
	font-size:36pt;
	outline:1px none #ccc;
	height:auto;
	white-space:pre-wrap;
}
body.j2textgaelic .j2text {font-family: gaelicFont, Georgia;}

.j2tcontent{
	font-size:36pt;
}

.j2text p[placeholder]:only-child:empty:before{
	content: attr(placeholder);
	color:lightgray;
}

.j2text.scrollable {word-wrap: break-word;overflow-y: scroll;}
.j2text p {outline: 0 solid transparent;margin:0;min-height:20px;/*line-height:160%;*/line-height:100%;}
.j2text p *{line-height:100%;}
.j2text p:focus {outline:0 solid transparent;}
.j2text[data-link] {color:#0E80CD;} /* Same colour as a:link a:visited a:hover styles */
.j2text[data-link]:hover {color:#0E80CD; text-decoration:underline !important;}
.j2tcontent {outline:none; min-width:25px; /*padding-right:25px;*/}


.ui-tabs .ui-tabs-nav {
	padding: 0;
}

.ui-corner-top {
	-moz-border-radius-topleft: 0px;
	-webkit-border-top-left-radius: 0px;
	border-top-left-radius: 0px;
	-moz-border-radius-topright: 0px;
	-webkit-border-top-right-radius: 0px;
	border-top-right-radius: 0px;
}

.ui-tabs .ui-tabs-nav li {
	margin: 0 2px 0 3px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    top: 0;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
	background:none;
	border:none;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus {
	background:none;
	border:none;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
	background:none;
	border:none;
}

.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
	color: #FFF;
}

.ui-state-default a:hover {
	color: #000;
}

.ui-widget-header {
	border: none;
}

.ui-tabs a {font-family: "Lexend", ABeeZee, sans-serif;font-size:14px;}
.ui-tabs a {font-family: "Lexend", ABeeZee, sans-serif;font-size:14px;}
.ui-tabs .ui-tabs-nav .writeTab, .writeDrop {background-color: #C6E700;}
.ui-tabs .ui-tabs-nav .paintTab, .paintDrop {background-color: #30A3FC;}
.ui-tabs .ui-tabs-nav .turtleTab, .turtleDrop {background-color: #59DE00;}
.ui-tabs .ui-tabs-nav .branchTab, .branchDrop {background-color: #C625C0;}
.ui-tabs .ui-tabs-nav .chartTab, .chartDrop {background-color: #FE931E;}
.ui-tabs .ui-tabs-nav .pictogramTab, .pictogramDrop {background-color: #FF1D24;}
.ui-tabs .ui-tabs-nav .animateTab, .animateDrop {background-color: #ED1F79;}
.ui-tabs .ui-tabs-nav .mixTab, .mixDrop {background-color: #333333;}

/*.ui-tabs .ui-tabs-nav .writeTab.ui-tabs-active a {color: #439300;}
.ui-tabs .ui-tabs-nav .paintTab.ui-tabs-active a {color: #00488D;}
.ui-tabs .ui-tabs-nav .turtleTab.ui-tabs-active a {color: #007400;}
.ui-tabs .ui-tabs-nav .branchTab.ui-tabs-active a {color: #62006C;}
.ui-tabs .ui-tabs-nav .chartTab.ui-tabs-active a {color: #913B11;}
.ui-tabs .ui-tabs-nav .pictogramTab.ui-tabs-active a {color: #650000;}
.ui-tabs .ui-tabs-nav .animateTab.ui-tabs-active a {color: #6F0040;}
.ui-tabs .ui-tabs-nav .mixTab.ui-tabs-active a {color: #7B8B9B;}*/

@media screen and (max-width: 1045px) {
	.ui-tabs .ui-tabs-nav li a {padding: .5em .65em;}
}
#buttonBarRight {
	height: 34px;
	position: absolute;
	top: 80px;
	right: 5px;
	color:#3fa9f5;
}
@media screen and (max-width: 970px) {
	#buttonBarRight {
		top: 120px;
	}
}

.buttonBarRightButton {
	background-color: white;
	padding: 4px 8px;
	font-family: "Lexend", ABeeZee, sans-serif;
	text-align: center;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	behavior: url(./e5/css3pie/PIE.htc);
	border: solid medium #7ac943;
	-webkit-filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.5));
	-ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=2, OffY=2, Color='#444')";
	filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=2, OffY=2, Color='#444')";
	cursor: pointer;
	font-size: 12px;
	color:#3fa9f5;
	font-weight: 100;
}

#infoBut {
	padding-left: 11px;
	padding-right: 11px;
}

#upgradeBut {
	border: solid medium #3fa9f5;
	color:#FFF;
	background-color: #3fa9f5;
	background-image: -webkit-linear-gradient(top, #6dbef7, #3fa9f5);
	background-image: -moz-linear-gradient(top, #6dbef7, #3fa9f5);
	background-image: -ms-linear-gradient(top, #6dbef7, #3fa9f5);
	background-image: -o-linear-gradient(top, #6dbef7, #3fa9f5);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#6dbef7,endColorStr=#3fa9f5);
}

.j2custom .ui-button-text {
	padding: .2em;
}

div.recorderButton {
	display:none;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	behavior: url(./e5/css3pie/PIE.htc);
	width: 30px;
	height: 30px;
	background-color: #FFF;
	float: left;
	box-shadow: 2px 2px 5px #273B4C;
	cursor: pointer;
	border: solid thick #007ACF;
	margin-top: -7px;
	margin-right: 5px;
	color: #868686;
}

#micButton, #delButton {
	display:block;
}

#recProgressbar {
	width: 80px;
	margin-left: 10px;
	margin-top: 8px;
	float: left;
	background: white;
	border: 1px solid black;
}

#recProgressbar > div {
	width: 100%;
	background-color: red;
	height: 13px;
}

#micButton i {
	font-size: 21px;
	padding-left: 8px;
	padding-top: 5px;
}

#recButton i {
	color: red;
	font-size: 21px;
	padding-left: 6px;
	padding-top: 4px;
}

#playButton i, #playLoadedAudio i {
	font-size: 21px;
	padding-left: 9px;
	padding-top: 4px;
	color: #6AC234;
}

#playLoadedAudio {display:block;}

.slideshow-container {
    position: absolute;
	overflow: hidden;
	z-index: 2;
}

.slideshow-controls {
    display: flex;
    align-items: center;
    justify-content: center;
	gap: .2em;
	background-color: rgba(0,0,0,0.5);
	transition: transform .3s ease-out;
}

.slideshow-container,
.slideshow-controls {
    bottom: 0;
	width: 100%;
	height: 5em;
	-webkit-border-radius: 0px 0px 15px 15px ;
	-moz-border-radius: 0px 0px 15px 15px;
	border-radius: 0px 0px 15px 15px;
}

.slideshow-play-pause,
.slideshow-reset {
    width: 3em;
    height: 3em;
	border: .4em solid #007ACF;
	background-color: #fff;
	-webkit-border-radius: 32px;
	-moz-border-radius: 32px;
	border-radius: 32px;
    display: flex;
	flex-shrink: 0;
    align-items: center;
    justify-content: center;
	cursor: pointer;
}

.slideshow-play-pause img,
.slideshow-reset img {
	height: 65%;
	width: 65%;
}

.slideshow-pages{
	display: flex;
	justify-content: flex-start;
	align-items: center;
	max-width: 40%;
	overflow-x: auto;
	gap: .2em;
	position: relative;
  	-ms-overflow-style: none;  /* IE and Edge */
  	scrollbar-width: none;  /* Firefox */
	scroll-behavior: smooth;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.slideshow-pages::-webkit-scrollbar {
	display: none;
}

/* .slideshow-pages-overlay {} */

.slideshow-dot{
	background-color: #fff;
	border: .3em solid #007ACF;
	-webkit-border-radius: 32px;
	-moz-border-radius: 32px;
	border-radius: 32px;
	cursor: pointer;
	flex-shrink: 0;
	height: 1.2em;
	width: 1.2em;
}

.slideshow-dot-selected {
	background-color: #007ACF;
}

#stopButton i, #playLoadedAudio i.fa-square {
	font-size: 19px;
	padding-left: 7px;
	padding-top: 5px;
	color: #868686;
}

#delButton i {
	font-size: 21px;
	padding-left: 7px;
	padding-top: 4px;
}

.ui-dialog .ui-dialog-titlebar {
	background:none;
	height: 30px;
}

.ui-dialog-title {
	display:none;
}

.ui-dialog {
	background-color: #3fa9f5;
	background-image: none;
	border: none;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	behavior: url(./e5/css3pie/PIE.htc);
	border-radius: 20px;
	box-shadow: 5px 5px 20px #888888;
	overflow: visible;
	z-index: 5;
	cursor: default;
}

.ui-dialog[aria-describedby="j2signIn"] {overflow:hidden;} /*why overflow is hidden above? for autocomplete on sigin dialog set hidden*/

.ui-dialog[aria-describedby="dColour"] .ui-dialog-buttonpane{
	margin: -20px -3px -12px -3px;
    padding-top: 15px;
 }

.ui-dialog.newDocumentDialog {background-color: #D1DF00;}
.ui-dialog.newDocumentDialog.paint {background-color: #31A3FC;}
.ui-dialog.newDocumentDialog.turtle {background-color: #7ac943;}
.ui-dialog.newDocumentDialog.chart {background-color: #fe931e;}
.ui-dialog.newDocumentDialog.pictogram {background-color: #ff1d25;}
.ui-dialog.newDocumentDialog.animate {background-color: #ed1e79;}
.ui-dialog.newDocumentDialog.branch {background-color: #C626C0;}
.ui-dialog.newDocumentDialog.mix {background-color: #333333;}

.ui-dialog #newDocumentDialog.ui-dialog-content {
	border: none;
	box-shadow: none;
}

.ui-dialog .ui-dialog-content {
	overflow: visible;
}

.ui-dialog-titlebar .ui-state-hover {
	background-color:#FFF;
}

.ui-dialog .ui-dialog-titlebar-close {
	padding:0;
	margin-top: -16px;
}

.ui-dialog.openDocumentDialog .ui-dialog-titlebar .tabSelected {
	background-color: white;
	color: black;
}

.openFile {
	width: 124px;
	height: 84px;
	display: inline-block;
	background-size: 100%;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	behavior: url(./e5/css3pie/PIE.htc);
	box-shadow: 2px 2px 5px #888888;
	cursor: pointer;
	margin: 4px;
	margin-bottom: 10px;
}

.openFile span {
	width: 100px;
	text-align: center;
	margin-top: 60px;
	margin-left: 7px;
	height: 15px;
	display: inline-block;
	color: #53b2f6;
	font-family: "Lexend", ABeeZee, sans-serif;
	font-size: 14px;
}

#fileNameTitle {
	width: 100px;
	text-align: center;
	margin-top: 60px;
	margin-left: 7px;
	background-color: white;
	padding: 3px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	behavior: url(./e5/css3pie/PIE.htc);
	box-shadow: 2px 2px 5px #CECECE;
	display: inline-block;
	color: #53b2f6;
	font-family: "Lexend", ABeeZee, sans-serif;
	font-size: 14px;
}

/* #createAccount {
	border: 1px solid #fad42e;
	background-color: #fbec88 !important;
	color: #363636 !important;
	font-size: 12px;
	margin-bottom: 5px;
	/* margin-top: 10px;
} */

#singleSignIn {
	border: 1px solid #c5dbec;
	background-color: #dfeffc;
	font-weight: bold;
	color: #2e6e9e;
	font-size: 12px;
}

form.alignedForm label {
	display: inline-block;
	line-height: 1.8;
	text-align: right;
	padding-right: 0.5em;
	width: 150px;
}

/* #j2signIn input[type=text], #j2signIn input[type=password] {
	width: 170px !important;
} */

#juser input[type=text] {
	width: 230px !important;
}

.openDocumentDialog .ui-dialog-titlebar-close {
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	behavior: url(./e5/css3pie/PIE.htc);
	width: 30px;
	height: 30px;
	background-color: #FFF;
	margin-top: -16px;
	box-shadow: 2px 2px 5px #2C8ACE;
}

.ui-dialog-titlebar-close {
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	behavior: url(./e5/css3pie/PIE.htc);
	width: 30px !important;
	height: 30px !important;
	background-color: #FFF;
	margin-top: -16px;
	box-shadow: 2px 2px 5px #2C8ACE;
}

.openDocumentDialog .tabNormal {
	background-color: #0A53A8;
	color: white;
}

#newDocumentDialog.ui-dialog-content,
#openDocumentDialog.ui-dialog-content {
	height: 315px !important;
}

#openDocumentDialog .contentBlock {
	margin-top: 14px;
    margin-left: -10px;
    margin-right: -10px;
    height: 290px;
}

.disabled {
	opacity: 0.4;
}

#dialog-modal-prompt {
	display: table;
    width: 100%;
}
#dialog-modal-prompt > div {
	vertical-align: middle;
    height: 60px;
    text-align: center;
    display: table-cell;
}
#dialog-modal-prompt > div > p {padding-right:8px;}
#dialog-modal-prompt > div > * {
	display:inline-block;

	/* inline block fix */
	zoom:1;
	*display:inline;
}

#jmodal.ui-dialog-content,
#jmodalconfirm.ui-dialog-content,
#jmodalprompt.ui-dialog-content,
#dialoguePurchase.ui-dialog-content,
#j2setPW.ui-dialog-content,
#dialogueRegister.ui-dialog-content,
#dialogueRegisterSchool.ui-dialog-content,
#dialogueRegisterSU.ui-dialog-content,
#jcamera.ui-dialog-content,
#mixLayoutDialog.ui-dialog-content {
	background-color: #FFF;
	margin-left: -10px;
	border: solid 8px #3fa9f5;
	box-shadow: 0px -3px 3px #3fa9f5;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	margin-right: -12px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-bottom: 0;
	padding-right: 15px;
}

#jbranchqhistory.ui-dialog-content {
	border: solid 8px #3fa9f5;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom: 0;
}

.ui-dialog .ui-dialog-content {
	background-color: #FFF;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	margin: 0px 5px 5px 5px;
}

.ui-dialog .j2e-modal-upload.ui-dialog-content {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.ui-dialog .ui-dialog-buttonpane {
	margin: -12px -12px -12px -10px;
	background-color: #FFF;
	border: solid 8px #3fa9f5;
	box-shadow: 0px -3px 3px #3fa9f5;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-top: 0;
}

.ui-dialog .j2e-modal-upload~.ui-dialog-buttonpane{
    margin: -12px -3px -12px -3px;
}

#dRecord.ui-dialog-content ~ .ui-dialog-buttonpane {
    margin: -25px -3px 0 -3px;
}

#jbranchqhistory.ui-dialog-content ~ .ui-dialog-buttonpane {
	margin: -12px 5px 0 5px;
}

.ui-dialog .ui-dialog-content button,
.ui-dialog .ui-dialog-buttonpane button {
	background-color: #3fa9f5 !important;
	color: #FFF !important;
}

.ui-dialog .ui-dialog-content button:hover,
.ui-dialog .ui-dialog-buttonpane button:hover {
	background-color: #79b7e7 !important;
}

.ui-dialog .ui-dialog-title{
	display:block;
	font-family: "Lexend", ABeeZee, sans-serif;
}

.ui-dialog-titlebar-close {
	box-shadow: none !important;
}

.ui-dialog-titlebar, .turtleDragBox {
	-ms-touch-action:none;
	touch-action:none;
}

#credits {
	margin-top: 10px;
}

#credits li {
	list-style: none;
	margin-bottom: 5px;
}

#titleContainer {
	margin-top: -30px;
	width: 100%;
	z-index: 2;
	position: absolute;
	display: block;
}

#titlebox {
	margin: 0 auto;
	width: 340px;
	height: 30px;
	border-radius: 13px;
	-webkit-border-radius: 13px;
	-moz-border-radius: 13px;
	behavior: url(./e5/css3pie/PIE.htc);
	box-shadow: 2px 2px 5px #585858;
	display: table;
}

body.blog #titlebox {
	width: 280px;
}

#titlebox.small {width:260px !important;}

#title {
	border-radius: 13px;
	-webkit-border-radius: 13px;
	-moz-border-radius: 13px;
	behavior: url(./e5/css3pie/PIE.htc);
	float: right;
	padding-left: 10px;
	width: 180px;
	margin-right: 5px;
	margin-top: 2px;
	font-family: "Lexend", ABeeZee, sans-serif;
}

#spinner-div {
	position: absolute;
	width:100%;
	height:100%;
	z-index: 10000;
	text-align: center;
}

#spinner-div div{
  position:relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

#spinner-dix img{
	margin: auto;
  	display: block;
}

#spinner-div span{
	font-family: "Lexend", ABeeZee, sans-serif;
	font-size:20px;
	color:#3fa9f5;
	position:relative;
}

#maincanvas,
#onionskin,
#mainPictogramCanvas {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width:100%;
    height:100%;
    border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	-webkit-tap-highlight-color: rgba(0,0,0,0);

	-ms-touch-action:none;
	touch-action:none;
}

#newDocumentDialog #Tab2Content .contentBlock {
	margin-top: 10px;
}

#newPicBlock {
	margin: 5px 0px 0px 30px;
}

#newPicBlock .wrap{
    display: inline-block;
    margin: 0px;
    border: solid 2px #4297d7;
    background-color: transparent;
    vertical-align: bottom;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    behavior: url(./e5/css3pie/PIE.htc);
    position: relative;
}

#newPicBlock .wrap input{
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
    border: none;
    padding: 4px 0 4px 5px;
    width: 165px;
    font-family: "Lexend", ABeeZee, sans-serif;
}

.picture-buttons {
	font-size: 20px;
	margin-right: 20px;
	color: #40aaf6;
}


#newPicUser, .picture-buttons.bank, #newPicShared, #newPicGoogle {
	color: rgb(255, 175, 55);
}

.picture-buttons.bank.selected {
	color:red;
}


.clickero{background:#DBEEF4}
.speaking{color:red !important;}
.clickspeak, #wordtopicspeak{
	position:fixed;
	width: 36px;
  	height: 30px;
	float: left;
	cursor: pointer;
	background-position: -660px -3px;
}

#speakwrite {
	display: block;
	position: absolute;
	top: -20px;
  	right: 0px;
	z-index: 5;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

div#speaktext {
    width: 26px;
    height: 26px;
    display: flex;
    position: absolute;
    top: -20px;
    left: 0px;
    z-index: 5;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    background: white;
    border: 5px solid #00a7ff;
    border-radius: 50%;
    box-shadow: 2px 2px 5px #273b4c;
}

div#speaktext > svg {
    width: 70%;
    margin: 4px;
}

.clickspeak > .j2changed {
	left: 22px;
	top: 6px;
}

#write .j2text{
	overflow-y: auto;
	-webkit-transform-origin:0 0;
	-moz-transform-origin:0 0;
	-o-transform-origin:0 0;
	-ms-transform-origin:0 0;
	transform-origin:0 0;
	padding-bottom: 1em;
}

#write .dfTxtSize14pt p, #write .dfTxtSize39em p, #mix .dfTxtSize14pt p, #mix .dfTxtSize39em p {
	font-size: 0.39em;
	min-height: 14pt;
}

#write .dfTxtSize20pt p, #write .dfTxtSize57em p, #mix .dfTxtSize20pt p, #mix .dfTxtSize57em p{
	font-size: 0.57em;
	min-height: 20pt;
}

#write .dfTxtSize36pt p, #write .dfTxtSize1em p, #mix .dfTxtSize36pt p, #mix .dfTxtSize1em p{
	font-size:1em;
	min-height: 36pt;
}

#write .dfTxtSize55pt p, #write .dfTxtSize152em p, #mix .dfTxtSize55pt p, #mix .dfTxtSize152em p{
	font-size: 1.52em;
	min-height: 55pt;
}

#write .dfTxtSize84pt p, #write .dfTxtSize84em p, #mix .dfTxtSize84pt p, #mix .dfTxtSize84em p{
	font-size: 2.3em;
	min-height: 84pt;
}


#openDocumentDialog .filterTitle label{
	width:auto;
}

#openDocumentDialog .filterTitle select, .filterTitle label{
	color: #3fa9f5;
	width: 30%;
	margin-left: 2%;
	margin-right: 2%;
	display: inline-block;
	font-family: "Lexend", ABeeZee, sans-serif;
	font-size: 17px;
}

#openDocumentDialog #Tab2Content div.contentBlock{
	margin-top:5px;
}

.j2changed{
	position: absolute;
	left: 57px;
	top: 32px;
}

#jvideoplayer {
	padding:5px;
}

.newDocumentDialog .xxx_wrapper .j2dropmenu,.pbwrap .xxx_wrapper .j2dropmenu{
	position:absolute;
	right:1px;
	top:1px;
}

/* DialogueCamera CSS changes */
#jcamera .ui-tabs .ui-tabs-nav {
	background-color: #3fa9f5;
	background-image: none;
}
#jcamera .photoButton1, #jcamera .shareButton1, #jcamera .storeButton1, #jcamera .plusButton, #jcamera .google{color:white;}
#jcamera .google {
    height: 27px;
    font-size: 28px;
}
.j2searchBar > input {width: 130px;}

#dColour div#cvalue{
	height:20px;
}
#media-tabs .etabs { margin: 0; padding: 0; }
#media-tabs .tab { display: inline-block; zoom:1; *display:inline;}
#media-tabs .tab .icon {
	width:60px;
	height: 75px;
    margin-left: 5px;
    margin-right: 5px;}
#media-tabs .tab .icon.pic {background-position:-170px -5px;}
#media-tabs .tab.active .icon.pic {background-position:-170px -85px;}
#media-tabs .tab .icon.google {background-position:-245px -5px;}
#media-tabs .tab.active .icon.google {background-position:-245px -85px;}
#media-tabs .tab .icon.word {background-position:-320px -5px;}
#media-tabs .tab.active .icon.word {background-position:-320px -85px;}

#media-tabs .btab-panel {
	padding: 1px 0;
    background-color: #fff;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
    min-height: 115px;
}
#media-tabs .btab-panel li {
    -webkit-column-break-inside:avoid;
    -moz-column-break-inside:avoid;
    -o-column-break-inside:avoid;
    -ms-column-break-inside:avoid;
    column-break-inside:avoid;
    width: 96px;
    display: inline-block;
    text-align: center;
    overflow:hidden;
}


#media-tabs ul.etabs li{
	width:auto;
}

#media-tabs .btab-panel .pictureBankCell.loaded {
	margin: 2px;
    border: 1px solid #a6c9e2;
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px;
    border-top-left-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
    border-top-right-radius: 5px;
    height: 61px;
    overflow: hidden;
}

#media-tabs #btab-word .pictureBankCell .wbitem {
	margin-bottom: 10px;
	cursor: pointer;
}
#media-tabs .pictureBankCellText, #media-tabs #btab-word .pictureBankCellText {
    width: 100px;
    text-align: center;
    margin-bottom: 5px;
    max-height: 20px;
    font-weight:bold;
}

.typeWrap {
	padding-top: 5px;
    text-align: center;
}

#btab-word .fa-spinner{
	text-align: center;
	width: 100%;
	display: inline-block;
}

#media-tabs .bankPrev, #media-tabs .bankNext,
#media-tabs .googlePrev, #media-tabs .googleNext {
	height: 25px;
    width: 200px;
    margin: 5px;
    background-color: #EDB9EC;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
    text-align: center;
}
#media-tabs .bankPrev.enabled, #media-tabs .bankNext.enabled,
#media-tabs .googlePrev.enabled, #media-tabs .googleNext.enabled {
	background-color: #C526BF;
}
#media-tabs .bankPrev .fa, #media-tabs .bankNext .fa,
#media-tabs .googlePrev .fa, #media-tabs .googleNext .fa {
	color: white;
    font-size: 25px;
    line-height: 25px;
    margin-top: 5px;
}
#media-tabs .bankNext .fa, #media-tabs .googleNext .fa {margin-top: -5px;}
#media-tabs .bankTabPanel  #back, .wordbankopen #back{
	font-size: 24px;
	text-align:left;
    color: #535353;
    margin: 8px 0 8px 5px;
}
.wordbankopentopics .wbcwrap {margin: 8px 0 10px 5px;}

#media-tabs .wrap {
	background-color: #7F107D;
    border: 12px solid #7F107D;
    border-left-width: 10px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    behavior: url(./e5/css3pie/PIE.htc);
    margin-top: -2px;
    position: relative;
}

#media-tabs .bankTabPanel .wrap{
	width: 178px;
	margin:5px;
}

#media-tabs .wrap input{
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
    border: none;
    padding: 4px 0 4px 5px;
    width: 165px;
    font-family: "Lexend", ABeeZee, sans-serif;
}

.wrap #searchIcon, #media-tabs .wrap #addWordIcon, #media-tabs .wrap #addSoundIcon {
	width: 38px;
    height: 38px;
    position: absolute;
    top: -5px;
    right: -7px;
    background-position: -840px -5px;
}

#media-tabs .wrap #addWordIcon {
	background-position: -782px -5px;
}

#googlebranding, #googleresultsempty {
    padding: 5px;
    cursor: default;
    color: #999999;
    font-family: "Lexend", ABeeZee, sans-serif;
}
#googlebranding .fa-caret-square-o-down {font-size: 18px;}
div#googlefilters {margin-top: 5px;text-align:center;}
.googlesearchicon {
	margin-right:8px;
	width:50px;
	height:50px;
	background: url('/assets/jit/jit-googlesearch-icons-0.png');
    display: inline-block;
}
.googlesearchicon:first-of-type {margin-right: 20px;}
.googlesearchicon.gallstamp {background-position:50px 0;}
.googlesearchicon.gallphoto {background-position:50px -50px;}
.googlesearchicon.gclipart {background-position:50px -100px;}
.googlesearchicon.glineart {background-position:50px -150px;}

.googlesearchicon.gallstamp.checked {background-position:0 0;}
.googlesearchicon.gallphoto.checked {background-position:0 -50px;}
.googlesearchicon.gclipart.checked {background-position:0 -100px;}
.googlesearchicon.glineart.checked {background-position:0 -150px;}

#btab-pic .pictureBankCell img {max-height: 70px;}
#btab-pic > .wrap {
	text-align: center;
    border-top-width: 6px;
    border-bottom-width: 6px;
}
.toolbar.branch #newPicCamera.picture-buttons {
    font-size: 26px;
    margin-right: 0;
    color: white;
}

.xxx_wrapper{
	display:inline-block;;
	position:relative;
}

.xxx_wrapper #j2dropmenu{
	position:absolute;
	right:1px;
	top:1px;
}

#btab-google img.lpcontent, .typeWrap img.lpcontent{
    padding: 4px 2px;
    vertical-align: middle;
    max-width: 100px;
    max-height: 80px;
}

#media-tabs .tab .icon{
    background-image: url('/assets/jit/jit-branch-2.png');
}

@media screen and (max-height: 769px) {
	#btab-pic .pictureBankCell img, .typeWrap .pictureBankCell img {max-height: 40px;}
	#btab-google img.lpcontent,.typeWrap img.lpcontent {max-height: 55px;padding: 2px;}
	#btab-word .pictureBankCell img {width: 50px;}
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

#tabs .toolbar.write button span {color:#343434;}

#write {
	background-color: #D1DF0f0;
	background-image: -webkit-linear-gradient(top, #D1DF00, #EEF2A0);
	background-image:    -moz-linear-gradient(top, #D1DF00, #EEF2A0);
	background-image:     -ms-linear-gradient(top, #D1DF00, #EEF2A0);
	background-image:      -o-linear-gradient(top, #D1DF00, #EEF2A0);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#D1DF00,endColorStr=#EEF2A0);
	width:100%;
}

.toolbar.write .fontsize span {font-family:comicFont;}
.toolbar.write .fontsize.s1 span {font-size:20px;}
.toolbar.write .fontsize.s2 span {font-size:28px;}
.toolbar.write .fontsize.s3 span {font-size:36px;}
.toolbar.write .fontsize.s4 span {font-size:42px;}
.toolbar.write .fontsize.s5 span {font-size:50px;}

.toolbar.write .fontfamily span {font-weight:normal; font-size:18px;}
.toolbar.write .fontplain span {font-family:Arial;}
.toolbar.write .fontcool span {font-family:Verdana;}
.toolbar.write .fontposh span {font-family:Times New Roman;}
.toolbar.write .fontcomic span {font-family:comicFont;}
.toolbar.write .fontfancy span {font-family:Georgia;}
.toolbar.write .fontfancy.gaelic span {font-family:gaelicFont, Georgia;}
.toolbar.write .fontwriting span {font-family:writingFont;}

.toolbar.write .fontcolor {
	width: 32px;
	height: 35px;
	box-shadow: 2px 2px 2px #CED36B;
	margin: 7px;
	margin-top: 0;
	border-radius: 5px;
}
.toolbar.write .redfont {background-color:#FF1D25;}
.toolbar.write .darkbluefont {background-color:#2E3192;}
.toolbar.write .darkpinkfont {background-color:#ED1E79;}
.toolbar.write .lightbluefont {background-color:#3FA9F5;}
.toolbar.write .orangefont {background-color:#FF931E;}
.toolbar.write .purplefont {background-color:#662D91;}
.toolbar.write .pinkfont {background-color:#FF7BAC;}
.toolbar.write .lilacfont {background-color:#A381BD;}
.toolbar.write .yellowfont {background-color:#FCEE21;}
.toolbar.write .blackfont {background-color:#000000;}
.toolbar.write .brownfont {background-color:#C69C6D;}
.toolbar.write .darkgreyfont {background-color:#4D4D4D;}
.toolbar.write .greenfont {background-color:#7AC943;}
.toolbar.write .greyfont {background-color:#B3B3B3;}
.toolbar.write .darkyellowfont {background-color:#D9E021;}
.toolbar.write .whitefont {background-color:#FFFFFF;}

.toolbar.write .wordbankButtons {
	overflow-y: viisible;
    width: 220px;
    height: 45px;
    margin-left: -20px;
}

.toolbar.write .wordbank {
	width:230px;
	background-color:#FFFFFF;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	border:3px;
	border-style:solid;
	border-color:#D9DF33;
}

.toolbar.write .wordbank {
	font-size:17px;
	font-family:Verdana;
	font-weight:bold;
}

.toolbar.write .wordbankleft span, .toolbar.write .wordbankright span{
	background-color:#FFFFFF;
	border:3px;
	border-style:solid;
	border-color:#D9DF33;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behaviour: url(./e5/css3pie/PIE.htc);
    box-shadow: 1px 1px 1px #C6CC2E;

	font-size:18px;
	font-family:"Lexend", ABeeZee, sans-serif;
	font-weight:bold;
	width: 30px;
}

.toolbar.write .wordbankleft{
	margin-left: 0px;
	position: relative;
	left: 0px;
	top: -40px;
	z-index: 1;
}
.toolbar.write .wordbankright{
	float:right;
	right:-10px;
	position: relative;
	top: -40px;
	margin-bottom: -75px;
}

.toolbar.write .wordbankright .ui-icon.word{
	height: 32px;
    width: 28px;
	background-image: url('/assets/jit/jit-branch-2.png');
    background-position: -328px -12px;
}



.toolbar.write div.wordbankopen, .toolbar.write div.wordbankopentopics {
	width:200px;
	background-color:#FFFFFF;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	border:3px;
	border-style:solid;
	border-color:#D9DF33;
	overflow-y: auto;
	padding: 10px 10px 5px 10px;
	margin-left: -18px;
}

.toolbar.write div.wordbankopentopics .contentBlock {
	margin-top:5px;
	overflow-y: auto;
}

.toolbar.write div.wordbankopentopics .fa-spinner {
	width: 100%;
	margin-top:10px;
	text-align: center;
}

.toolbar.write .contentBlock .j2wordpreview b, .toolbar.write .contentBlock .j2wordpreview span{
	white-space:nowrap;
}

.toolbar.write .contentBlock .j2wordpreview b{
	top:0px;
}

.toolbar.write .contentBlock .j2wordpreview img {
	top:20px;
	left:0px;
	width:70px;
	position:absolute;
}

.toolbar.write .contentBlock .j2wordpreview {
	display:inline-block;
	width: 80px;
	overflow:hidden;
	margin:2px;
    height: 70px;
    padding: 2px;
    border: 1px solid #a6c9e2;
    -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px;
    border-top-left-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
    border-top-right-radius: 5px;
    cursor: pointer!important;
    position:relative;
}

.toolbar.write div.wordbankopen li {
    -webkit-column-break-inside:avoid;
    -moz-column-break-inside:avoid;
    -o-column-break-inside:avoid;
    -ms-column-break-inside:avoid;
    column-break-inside:avoid;
}
.toolbar.write div.wordbankopen ul {
    list-style: none;
    -moz-column-count: 3;
	-webkit-column-count: 3;
	column-count: 3;
	-webkit-column-gap: 20px; /* Chrome, Safari, Opera */
    -moz-column-gap: 20px; /* Firefox */
    column-gap: 20px;

	font-family:"Lexend", ABeeZee, sans-serif;
	line-height:1.4em;
	font-size: 21px;
}

#write #titlebox {
	background-color: #709302;
}

#write #wordtopicspeak, #mix #wordtopicspeak {position: relative;left: 160px;margin-top: -40px;}
#write .wbcwrap .clickspeak, #mix .wbcwrap .clickspeak {position: absolute;right: 15px;margin-top: -10px;}

@media screen and (max-height: 740px) {
	.toolbar.write .fontcolor {
		width: 22px;
		height: 25px;
	}
	.toolbar.write .redfont,
	.toolbar.write .pinkfont,
	.toolbar.write .greenfont {margin-left:-10px;}
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

#tabs .toolbar.paint button span {color:#343434;}

#paint {
	background-color: #31A3FC;
	background-image: -webkit-linear-gradient(top, #31A3FC, #B6DEF8);
	background-image:    -moz-linear-gradient(top, #31A3FC, #B6DEF8);
	background-image:     -ms-linear-gradient(top, #31A3FC, #B6DEF8);
	background-image:      -o-linear-gradient(top, #31A3FC, #B6DEF8);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#31A3FC,endColorStr=#B6DEF8);
}

#paint.ui-tabs-panel .panel {
	border-color: #2E94F7;
	-webkit-background-size: auto;
	-moz-background-size: auto;
	-o-background-size: auto;
	background-size: auto;
    background-image: url(/assets/jit/paint/background.png);
}

.colourModal {
	width: 65px;
	height: 176px;
	display: block !important;
	position: absolute;
	z-index: 999;
	margin-left: 30px;
	background-color: #40aaf6;
	padding: 3px;
	border-radius: 5px;
	margin-top: -30px;
}

.colourModal div#scroll{
	overflow-y:auto;
	overflow-x:hidden;
	height:100%;
	width:100%;

}

.colourModal .paintPalBlock{
	width:150px;
	height:100px;
	box-shadow: 2px 2px 2px #273B4C;
	margin: 7px;
	margin-top: 0;
	border-radius: 5px;
	display: inline-block;
}

.toolbar.paint .plusSize,
.toolbar.paint .minusSize,
.toolbar.paint .flip,
.toolbar.paint .rotate{
	margin-left: 170px;
    top: -20px;
    width: 31px;
    height: 31px;
    border-radius: 15px;
    -moz-border-radius: 15px;
    border: 4px;
    border-style: solid;
    border-color: #007ACF;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    background-color: #FFFFFF;
    margin-top: 5px;
    box-shadow: 1px 1px 1px #273B4C;
}

.toolbar.paint .reset{
    position: absolute;
    top: -14px;
    left: 6px;
    width: 27px;
    height: 27px;
	background-image: url(/assets/jit/paint/paintbuttons7.png);
	background-color: transparent;
	-webkit-filter: none;
	background-position: -212px -351px;
	opacity: 0.7;
}

.toolbar.paint .reset:hover{
	opacity: 0.8;
}

.toolbar.paint .editStamp{
	display: inline-block;
    position: absolute;
    left: 30px;
    width:160px;
    top: 175px;
    padding-left:2px;
	-moz-border-radius-bottomleft:10px;
	-webkit-border-bottom-left-radius:10px;
	border-bottom-left-radius:10px;
	-moz-border-radius-bottomright:10px;
	-webkit-border-bottom-right-radius:10px;
	border-bottom-right-radius:10px;
	resize:none;
	z-index:1;
	font-family: "Lexend", ABeeZee;
}

.toolbar.paint .plusSize span,
.toolbar.paint .minusSize span,
.toolbar.paint .flip span,
.toolbar.paint .rotate span{
	margin-top:0px;
	margin-left: 3px;
	top:0px;
	box-shadow:none;
}

.toolbar.paint .picturebank {
	position: absolute;
	margin-left: -20px;
	margin-top:175px;
	z-index: 5;
	overflow:hidden;
}

.toolbar.paint .picturebank span {
	width: 200px;
	height:20px;
	background-color:#FFFFFF;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	border: 5px;
	border-style:solid;
	border-color: #007ACF;
	margin-left: 3px;
	padding: 4px !important;
}

.toolbar.paint .picturebank .ui-button-text {
	font-size:17px;
	font-family:Verdana;
	font-weight:bold;
	height: 25px;
}

.toolbar.paint .picturebank .ui-button-text > div {
	 padding: 0 30px;
    overflow: hidden;
    white-space: nowrap;
}

.toolbar.paint .picturebankleft,.toolbar.paint .picturebankright {
	position: absolute;
	margin-left: -22px;
	margin-top: 174px;
    z-index: 5;
}

.toolbar.paint .picturebankright {
	margin-left:165px;
}

.toolbar.paint .picturebankleft span, .toolbar.paint .picturebankright span, .toolbar.paint .picturebankright span {
	width: 18px;
	height: 18px;
	background-color:#FFFFFF;
	border: 6px;
	border-style:solid;
	border-color: #007ACF;
	box-shadow: 2px 2px 2px #273B4C;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
}

.toolbar.paint .stamp-next,
.toolbar.paint .stamp-prev,
.toolbar.paint .stamp-arrows,
.toolbar.paint .stamp-plus,
.toolbar.paint .stamp-minus{
	background-image: url(/assets/jit/paint/paintbuttons7.png);
	background-color: transparent;
	-webkit-filter: none;
	width: 10px;
	height: 10px;
	padding: 3px;
}

.toolbar.paint .stamp-rotate{
	background-image: url(/assets/jit/paint/paintbuttons7.png);
	background-color: transparent;
	-webkit-filter: none;
	width: 10px;
	height: 10px;
	padding: 3px;
	transform: scaleX(-1);
}


.toolbar.paint .stamp-next{background-position: -162px -252px;}
.toolbar.paint .stamp-prev {background-position: -62px -252px;}
.toolbar.paint .stamp-arrows {background-position: -318px -258px;}
.toolbar.paint .stamp-plus {background-position: -18px -308px;}
.toolbar.paint .stamp-rotate {background-position: -218px -308px;}
.toolbar.paint .stamp-minus {background-position: -118px -308px;}


.toolbar.paint .picturebankopen {
	width:213px;
	background-color:#f0f8ff;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	border:3px;
	border-style:solid;
	border-color:#273B4C;
	position:absolute;
	margin-top:200px;
	z-index: 3;
	margin-left: -18px;
	padding-top:18px;
}

.toolbar.paint .texturebankopen .texturebankwrap{
	overflow-y:scroll;
}

.toobar.paint #paintPaletteSizes, .toobar.paint #paintTextureSizes{
	behavior: url(./e5/css3pie/PIE.htc);
	text-align:center;
}

.toolbar.paint .texturebankopen {
	width:250px;
	behavior: url(./e5/css3pie/PIE.htc);
	z-index: 1;
}

.toolbar.paint #picturestamp{
    margin: auto;
    left:0;
    right:0;
}

.toolbar.paint .picturestampwrap {
    position: absolute;
    left: 0px;
    top: -15px;
    width: 220px;
    height: 160px;
}

.toolbar.paint .picturestampwrap > div{
    left: 50%;
    top: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
}

.toolbar.paint #picturestamp textarea, .toolbar.paint #activestamp textarea{
	position:absolute;
    resize: none;
    overflow: hidden;
    border: none;
}

.toolbar.paint #picturestamp{
    width:220px;
	display:inline-block;
}

.toolbar.paint #activestamp{
	position:absolute;
	display:inline-block;
}

.picturebankopen li {
    -webkit-column-break-inside:avoid;
    -moz-column-break-inside:avoid;
    -o-column-break-inside:avoid;
    -ms-column-break-inside:avoid;
    column-break-inside:avoid;
    width: 100px;
    display: inline-block;
}


.picturebankopen {
    list-style: outside disc;
    /*padding-left: 0.5em;*/
    margin-top: 1em;
    -webkit-column-width: 81px;
    -webkit-column-gap:1px;
    -moz-column-width: 150px;
    -moz-column-gap:1.5em;
    -o-column-width: 150px;
    -o-column-gap:1.5em;
    column-width: 150px;
    column-gap:1.5em;
}

.toolbar.paint .pictureBankCellText {
	width:100px;
	text-align:center;
	margin-bottom: 20px;
	max-height: 20px;
	font-family: "Lexend", ABeeZee, sans-serif;
}

.ui-tabs-panel .toolbar.paint {
	top: 120px;
}

.toolbar.paint .paintPalBlock.optional {
	display:none;
}

.toolbar.paint .paintPalBlock{
	width:35px;
	height:35px;
	box-shadow: 2px 2px 2px #273B4C;
	margin: 7px;
	margin-top: 0;
	border-radius: 50%;
	display: inline-flex;
}

.toolbar.paint .texturePickerPreview, .toolbar.paint .forColourInput, .toolbar.paint .forColourPicker {
    width: 45px;
    height: 45px;
    border-radius: 30px;
    border: solid 4px;
    margin-right: -31px;
}

.toolbar.paint .texturePickerPreview{
	border-color:#FF8B00;
}

.toolbar.paint .forColourPicker{
	border-color:#007BD6;
}

.toolbar.paint .red {
	background-color:#ff1d25;
	border: solid #f70f17;
}

.toolbar.paint .darkpink {
	background-color:#ed1e79;
	border: solid #f1096f;
}

.toolbar.paint .orange {
	background-color:#ff931e;
	border: solid #f7860d;
}

.toolbar.paint .pink {
	background-color:#ff7bac;
	border: solid #f971a3;
}

.toolbar.paint .yellow {
	background-color:#fcee21;
	border: solid #f5e606;
}

.toolbar.paint .beige {
	background-color:#c69c6d;
	border: solid #c39561;
}

.toolbar.paint .green {
	background-color:#7ac943;
	border: solid #70c734;
}

.toolbar.paint .darkyellow {
	background-color:#d9e021;
	border: solid #d8df14;
}

.toolbar.paint .darkblue {
	background-color:#2e3192;
	border: solid #20238e;
}

.toolbar.paint .lightblue {
	background-color:#3fa9f5;
	border: solid #2ea2f5;
}

.toolbar.paint .purple {
	background-color:#662d91;
	border: solid #632393;
}

.toolbar.paint .lightpurple {
	background-color:#a381bd;
	border: solid #9b6fbc;
}

.toolbar.paint .black {
	background-color:#000000;
	border: solid #212121;
}

.toolbar.paint .darkgrey {
	background-color:#4d4d4d;
	border: solid #333333;
}

.toolbar.paint .lightgrey {
	background-color:#b3b3b3;
	border: solid #9a9a9a;
}

.toolbar.paint .white {
	background-color:#ffffff;
	border: solid #ededed;
}

.toolbar.paint .skin1 {
	background-color:#ffd7c2;
	border: solid #f5ccb6;
}
.toolbar.paint .skin2 {
	background-color:#e0ae90;
	border: solid #daa88a;
}
.toolbar.paint .skin3 {
	background-color:#e2a669;
	border: solid #dda062;
}
.toolbar.paint .skin4 {
	background-color:#94471b;
	border: solid #8b4217;
}
.toolbar.paint .skin5 {
	background-color:#492103;
	border: solid #441f02;
}



.toolbar.paint .grass, .colourModal .grass{background-image: url('/assets/jit/paint/textures/grass.jpg');}
.toolbar.paint .mud, .colourModal .mud{background-image: url('/assets/jit/paint/textures/mud.jpg');}
.toolbar.paint .wall, .colourModal .wall{background-image: url('/assets/jit/paint/textures/wall.jpg');}
.toolbar.paint .road, .colourModal .road{background-image: url('/assets/jit/paint/textures/road.jpg');}
.toolbar.paint .planks, .colourModal .planks{background-image: url('/assets/jit/paint/textures/planks.jpg');}
.toolbar.paint .pavement, .colourModal .pavement{background-image: url('/assets/jit/paint/textures/pavement.jpg');}
.toolbar.paint .bricks,  .colourModal .bricks{background-image: url('/assets/jit/paint/textures/bricks.jpg');}
.toolbar.paint .bark,  .colourModal .bark{background-image: url('/assets/jit/paint/textures/bark.jpg');}
.toolbar.paint .waves,  .colourModal .waves{background-image: url('/assets/jit/paint/textures/waves.jpg');}
.toolbar.paint .lights,  .colourModal .lights{background-image: url('/assets/jit/paint/textures/lights.jpg');}
.toolbar.paint .snow,  .colourModal .snow{background-image: url('/assets/jit/paint/textures/snow.jpg');}
.toolbar.paint .checks,  .colourModal .checks{background-image: url('/assets/jit/paint/textures/checks.jpg');}
.toolbar.paint .concrete,  .colourModal .concrete{background-image: url('/assets/jit/paint/textures/concrete.jpg');}
.toolbar.paint .fence,  .colourModal .fence{background-image: url('/assets/jit/paint/textures/fence.jpg');}
.toolbar.paint .hedge,  .colourModal .hedge{background-image: url('/assets/jit/paint/textures/hedge.jpg');}
.toolbar.paint .leaf,  .colourModal .leaf{background-image: url('/assets/jit/paint/textures/leaf.jpg');}
.toolbar.paint .leather,  .colourModal .leather{background-image: url('/assets/jit/paint/textures/leather.jpg');}
.toolbar.paint .leather_purple,  .colourModal .leather_purple{background-image: url('/assets/jit/paint/textures/leather_purple.jpg');}
.toolbar.paint .leaves,  .colourModal .leaves{background-image: url('/assets/jit/paint/textures/leaves.jpg');}
.toolbar.paint .leaves2,  .colourModal .leaves2{background-image: url('/assets/jit/paint/textures/leaves2.jpg');}
.toolbar.paint .long_grass,  .colourModal .long_grass{background-image: url('/assets/jit/paint/textures/long_grass.jpg');}
.toolbar.paint .metal,  .colourModal .metal{background-image: url('/assets/jit/paint/textures/metal.jpg');}
.toolbar.paint .metal2,  .colourModal .metal2{background-image: url('/assets/jit/paint/textures/metal2.jpg');}
.toolbar.paint .paper,  .colourModal .paper{background-image: url('/assets/jit/paint/textures/paper.jpg');}
.toolbar.paint .paper2,  .colourModal .paper{background-image: url('/assets/jit/paint/textures/paper2.jpg');}
.toolbar.paint .rain,  .colourModal .rain{background-image: url('/assets/jit/paint/textures/rain.jpg');}
.toolbar.paint .red_dots,  .colourModal .red_dots{background-image: url('/assets/jit/paint/textures/red_dots.jpg');}
.toolbar.paint .redCheck,  .colourModal .redCheck{background-image: url('/assets/jit/paint/textures/redCheck.jpg');}
.toolbar.paint .redPlanks,  .colourModal .redPlanks{background-image: url('/assets/jit/paint/textures/redPlanks.jpg');}
.toolbar.paint .wood,  .colourModal .wood{background-image: url('/assets/jit/paint/textures/wood.jpg');}
.toolbar.paint .smoke,  .colourModal .smoke{background-image: url('/assets/jit/paint/textures/smoke.jpg');}
.toolbar.paint .cardboard,  .colourModal .cardboard{background-image: url('/assets/jit/paint/textures/cardboard.jpg');}
.toolbar.paint .honey,  .colourModal .honey{background-image: url('/assets/jit/paint/textures/honey.jpg');}
.toolbar.paint .lego,  .colourModal .lego{background-image: url('/assets/jit/paint/textures/lego.jpg');}
.toolbar.paint .texture.none {display:none !important;}

.toolbar.paint .selectedColor{
  border: solid medium white;
}

#activepaint {
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	behavior: url(./e5/css3pie/PIE.htc);
	position:absolute;
	border: thin solid #000;
}

#activefill {
	position:absolute;
	width: 49px;
	height: 50px;
}

#activepicker {
	position:absolute;
	background-image: url(/assets/jit/paint/paintbuttons7.png);
	background-position: -210px -150px;
	width: 30px;
	height: 30px;
}


#paintPaletteSizes .paintSize {
	background-color: #ff1d25;
	border: solid black thin;
}

#paintPaletteSizes div.holder, #paintTextureSizes div.holder {
	position: relative;
	height:75px;
	width:100%;
}


.toolbar.paint .sizeIcon{
    width: 20px;
    height: 20px;
    margin-left: 20px;
    display: inline-block;
    background-image: url(/assets/jit/paint/paintbuttons7.png);
    background-position: -120px -165px;
    vertical-align: text-bottom;
}

.toolbar.paint #paintTextureSizes .sizeIcon{
	background-position: -68px -215px;
}

.toolbar.paint .sizeIcon.large{
    width: 50px;
    height: 50px;
    background-position: -50px -140px;
    vertical-align: middle;
    margin-top: -20px;
    margin-left: 10px;
}

.toolbar.paint #paintTextureSizes .sizeIcon.large{
	background-position: -0px -190px;
	margin-top: -10px;
}

#paintPaletteSizes div.holder .paintSize {
    position: absolute;
    margin-left: -21px;
    margin-top: -21px;
    top: 50%;
    left: 50%;
}

#paintTextureSizes div.holder canvas{
	width: 40%;
	margin-left: 30%;
	margin-top: 10px;
}

#sizeSlider .ui-slider-handle, #textureSizeSlider .ui-slider-handle{
	background-color:#01A7FF;
	border:solid 5px #36485A;
	border-radius:50%;
	width:10px;
	height:10px;
}

 #textureSizeSlider .ui-slider-handle{
 	background-color:#FFCE00;
 }

#paintPaletteSizes, #paintTextureSizes {
	margin-left: -3px;
}

#paintPaletteSizes .one {
	width: 6px;
	height: 6px;
	margin: 40px 10px;
}

#paintPaletteSizes .two {
	width: 14px;
	height: 14px;
	margin: 35px 5px;
}

#paintPaletteSizes .three {
	width: 31px;
	height: 31px;
	margin: 25px 2px;
}

#paintPaletteSizes .four {
	width: 48px;
	height: 48px;
	margin: 16px 2px;
}
#paintPaletteSizes .five {
	width: 65px;
	height: 65px;
	margin: 5px 2px;
}

#paintPaletteSizes #sizeSlider, #paintTextureSizes #textureSizeSlider{
	width: 110px;
    margin: auto;
    display: inline-block;
}

#paintTextureSizes #textureSizeSlider{
	margin-top:15px;
}

.toolbar.paint .shadowCSS { box-shadow: 0px 0px 60px #FFF; }
.toolbar.paint .shadowfilter {
	-webkit-filter: drop-shadow(0px 0px 60px #FFF);
	-ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=2, OffY=2, Color='#FFF')";
	filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=2, OffY=2, Color='#FFF')";
	filter: url(/e5/images/shadow.svg#drop-shadow); /* Firefox */
	filter: drop-shadow(0px 0px 60px #FFF);
}

#paint #titlebox {
	background-color: #0A53A8;
}

#paintTypeButtons {
	position: absolute;
	top: 240px;
	left: -25px;
	width:120%;
	text-align:center;
}

#paintTypeButtons.hideeraser {
	left: 67px;
}

#paintTypeButtons.hideeraser #paintEraseBut {display:none;}

#paintTypeButtons div {
	background-image: url('/assets/jit/paint/paintbuttons7.png');
	width: 70px;
	height: 70px;
	cursor:pointer;
	display:inline-block;
	margin: -5px;
}

#paintEraseBut{
    background-position: -111px -352px;
    border:solid medium transparent;
    background-image: url('/assets/jit/paint/paintbuttons7.png');
	cursor:pointer;
}

#paintPaletteBut {
	background-position: -70px -0px;
}

#paintPaletteBut.selectedButton {
	background-position: -70px -70px;
}

#paintFillBut {
	background-position: -140px 1px;
}

#paintFillBut.selectedButton {
	background-position: -140px -70px;
}

#paintPalettes, #paintFills {
	margin-top: 195px;
	margin-left: 3px;
}

.toolbar.paint .editStamp {
	top: 175px;
}

#paintPalettes .pal_divider{
	width: 80%;
    height: 3px;
    opacity: 0.5;
    margin: auto;
    margin-top: 5px;
    margin-bottom: 5px;
}

#paintPalettes .pal_divider.line{
    border-top: dashed 3px grey;
    margin-bottom: 0px;
}

#paintPalettes .extraColours{
    display: inline-block;
    vertical-align: top;
    overflow: hidden;
    width: 200px;
    text-align:center;
	/*-moz-border-radius-bottomleft: 10px;
	-webkit-border-bottom-left-radius: 10px;
	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-bottom-right-radius: 10px;
	border-bottom-right-radius: 10px;
	background-color: #B6DEF8;
	border: solid 1px white;
	border-top: dashed 3px grey;*/
    margin-top: 3px;
}

#paintPalettes .extraColours.extended{
	position: relative;
    z-index: 3;
    margin-bottom: -100px;
}

#paintPalettes .moreExtraColours{
	margin-top: 5px;
	padding-top: 5px;
	min-height: 35px;
}

#paintPalettes .moreExtraColours.some{
    display:none;
}

.paintBrushActive, .paintFillActive {
	border: solid rgb(255, 255, 255) !important;
}

.paintSizeActive {
	border-width: medium !important;
}

.toolbar.paint.writing #picturestamp,
.toolbar.paint.writing .picturebank,
.toolbar.paint.writing .picturebankleft,
.toolbar.paint.writing .picturebankright,
.toolbar.paint.writing .plusSize,
.toolbar.paint.writing .minusSize,
.toolbar.paint.writing .flip,
.toolbar.paint.writing .rotate,
.toolbar.paint.writing #paintPalettes{
	display:none;
}

#paintWriteTools{
	display:none;
}

.toolbar.paint.writing #paintTypeButtons{
	margin-top:-200px
}

.toolbar.paint.writing #paintWriteTools{
	display:block;
	margin-top:-220px
}

	.toolbar.paint .extraColours button{
		vertical-align:bottom;
		display:inline-block;
		box-shadow: 2px 2px 2px #273B4C;
	}

  .toolbar.paint .chooseColour.ui-state-hover,.toolbar.paint .chooseTexture.ui-state-hover {
   	border-color:white;
   	transform: scale(1.1);
  }

  .toolbar.paint .chooseTexture, .toolbar.paint .chooseColour {
    	background-image: url(/assets/jit/paint/paintbuttons7.png);
    	background-position: -38px -498px;
    	border-color: #007BD6;
}

   .toolbar.paint .chooseTexture, .toolbar.paint .chooseColour, .toolbar.paint .colourInput {
    	margin-left: 10px;
    	margin-bottom: 6px;
     	background-color:white;
     	border: solid 2px;
     	width: 22px;
     	height: 22px;
	}

    .toolbar.paint .chooseColour {
    	background-position: -248px -498px;
    	border-color: #BEE900;
    }

    #tabs .toolbar.paint button.colourInput span{
        padding: 2px;
    }

    .toolbar.paint .picturebank,
    .toolbar.paint .picturebankleft,
    .toolbar.paint .picturebankright {margin-top:145px;}
	.toolbar.paint .picturebankopen {margin-top: 165px;}

    .toolbar.paint .picturebankleft span.ui-button-text {margin-left:-25px;}

     .toolbar.paint .editStamp {
		top: 185px;
	}

	 #paintTypeButtons {top:215px;}

	  #paintPalettes, #paintFills {
    	margin-top:165px;
    	margin-left: -7px;
 	}

@media screen and (max-height: 740px) {

    .toolbar.paint .paintPalBlock {
		width: 25px;
		height: 25px;
    }

    .toolbar.paint .texturePickerPreview, .toolbar.paint .forColourInput, .toolbar.paint .forColourPicker{
    	width: 35px;
		height: 35px;
    }

    #paintEraseBut {
		background-position: -80px -252px;
		background-size:251px 380px;
	}


    #paintPalettes .extraColours{
	    width: 237px;
	}

    .toolbar.paint .paintPalBlock.optional {
		display:inline-flex;
	}

	 #paintPalettes, #paintFills {
    	margin-left: -23px;
    	width:250px;
	 }

	 #tabs .toolbar.paint button.colourInput span{
        padding: 5px;
        padding-top: 2px;
    }
}


#savepic, #savestamp, #savegif {
	display: block;
	position: absolute;
	top: -14px;
	right: -7px;
	z-index: 5;
	background-image: url(/assets/jit/paint/paintbuttons7.png);
    background-position: -6px -346px;
    border: none;
    width: 40px;
    height: 40px;
}

#savestamp {
    background-position: -56px -346px;
    right: 37px;
}

#savegif {
    background-position: -156px -346px;
}


#savepic > i {
	font-size: 18px;
	padding-left: 8px;
	padding-top: 6px;
}


#paintWriteTools{
	position: absolute;
	top: 250px;
	margin-left: 10px;
}

.toolbar.paint .fontsize span {font-family:comicFont;}
.toolbar.paint .fontsize.s1 span {font-size:20px;}
.toolbar.paint .fontsize.s2 span {font-size:28px;}
.toolbar.paint .fontsize.s3 span {font-size:36px;}
.toolbar.paint .fontsize.s4 span {font-size:42px;}
.toolbar.paint .fontsize.s5 span {font-size:50px;}

.toolbar.paint .fontfamily span {font-weight:normal; font-size:18px;}
.toolbar.paint .fontplain span {font-family:Arial;}
.toolbar.paint .fontcool span {font-family:Verdana;}
.toolbar.paint .fontposh span {font-family:Times New Roman;}
.toolbar.paint .fontcomic span {font-family:comicFont;}
.toolbar.paint .fontfancy span {font-family:Georgia;}
.toolbar.paint .fontfancy.gaelic span {font-family:gaelicFont, Georgia;}
.toolbar.paint .fontwriting span {font-family:writingFont;}

.toolbar.paint .fontcolor{
	width: 32px;
    height: 35px;
    box-shadow: 2px 2px 2px #273B4C;
    margin: 7px;
    margin-top: 0;
    border-radius: 5px;
    display: inline-flex;
}
.toolbar.paint .redfont {background-color:#FF1D25;}
.toolbar.paint .darkbluefont {background-color:#2E3192;}
.toolbar.paint .darkpinkfont {background-color:#ED1E79;}
.toolbar.paint .lightbluefont {background-color:#3FA9F5;}
.toolbar.paint .orangefont {background-color:#FF931E;}
.toolbar.paint .purplefont {background-color:#662D91;}
.toolbar.paint .pinkfont {background-color:#FF7BAC;}
.toolbar.paint .lilacfont {background-color:#A381BD;}
.toolbar.paint .yellowfont {background-color:#FCEE21;}
.toolbar.paint .blackfont {background-color:#000000;}
.toolbar.paint .brownfont {background-color:#C69C6D;}
.toolbar.paint .darkgreyfont {background-color:#4D4D4D;}
.toolbar.paint .greenfont {background-color:#7AC943;}
.toolbar.paint .greyfont {background-color:#B3B3B3;}
.toolbar.paint .darkyellowfont {background-color:#D9E021;}
.toolbar.paint .whitefont {background-color:#FFFFFF;}

.toolbar.paint .bankPrev, .toolbar.paint .bankNext,
.toolbar.paint .googlePrev, .toolbar.paint .googleNext {
	height: 25px;
    width: 200px;
    margin: 0px;
    background-color: #B6DEF8;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
    text-align: center;
}
.toolbar.paint .bankPrev, .toolbar.paint .googlePrev {margin: 5px 0;}
.toolbar.paint .bankNext, .toolbar.paint .googleNext {margin-bottom: 5px;}
.toolbar.paint .bankPrev.enabled, .toolbar.paint .bankNext.enabled,
.toolbar.paint .googlePrev.enabled, .toolbar.paint .googleNext.enabled {
	background-color: #31A3FC;
}
.toolbar.paint .bankPrev .fa, .toolbar.paint .bankNext .fa,
.toolbar.paint .googlePrev .fa, .toolbar.paint .googleNext .fa {
	color: white;
    font-size: 25px;
    line-height: 25px;
    margin-top: 5px;
}
.toolbar.paint .bankNext .fa, .toolbar.paint .googleNext .fa {
    margin-top: -5px;
}

.toolbar.paint .typeWrap .pictureBankCell {
    text-align:center;
    vertical-align: middle;
}
.toolbar.paint .typeWrap .pictureBankCell img {max-height: 70px; max-width:70px;}
@media screen and (max-height: 769px) {
	.toolbar.paint .typeWrap .pictureBankCell img, .toolbar.paint .typeWrap .pictureBankCell img.lpcontent{max-height: 40px;}
}

.toolbar.paint .ppcwrap {
	text-align: center;
    padding-right: 0.5em;
}

.toolbar.paint #paintpiccamera {
    color: #31A3FC;
}

.toolbar.paint #media-tabs .wrap {
	background-color: #3fa9f5;
    border-color: #3fa9f5;
}

/*
Colours for media chooser
*/
.toolbar.paint #media-tabs .bankPrev, .toolbar.paint #media-tabs .bankNext{
    background-color: #a0d3fa;
}

.toolbar.paint #media-tabs .bankPrev.enabled, .toolbar.paint #media-tabs .bankNext.enabled{
	background-color: #3fa9f5;
}

.toolbar.paint #media-tabs .wrap {
	background-color: #3fa9f5;
    border-color: #3fa9f5;
}

#pickerdot{
	margin-left:30px;
	margin-top:30px;
	border:solid grey 1px;
}

.tooltipster-sidetip.tooltipster-punk.tooltipster-jitpaint .tooltipster-box {border-bottom: 6px solid #a0d3fa;}
.tooltipster-sidetip.tooltipster-punk.tooltipster-jitpaint .tooltipster-arrow-border {border-top-color:#a0d3fa;}
/*
// Copyright Just2easy Limited 2014-15 all rights reserved.
*/
body.capturing.services-thumbnailing #content {
	max-width: 1024px;
	left: 128px !important;
}

body.capturing.services-thumbnailing #chart {
	background-color: #fff;
	background-image: none;
}

#tabs .toolbar.chart button span.ui-icon {
	padding: 0px;
	position: relative;
}
#tabs .toolbar.chart button span.ui-button-text {
	padding:.4em 1em .4em 2.1em;
	margin-top: -20px;
	margin-left: -25px;
	font-family: "Lexend", ABeeZee, sans-serif;
	font-size: 16px;
	color: #2E94F7;
}
#tabs .toolbar.chart button.table span.ui-button-text {margin-left: -12px;}

#chart {
	background-color: #fe931e;
	background-image: -webkit-linear-gradient(top, #fe931e, #fed8b1);
	background-image:    -moz-linear-gradient(top, #fe931e, #fed8b1);
	background-image:     -ms-linear-gradient(top, #fe931e, #fed8b1);
	background-image:      -o-linear-gradient(top, #fe931e, #fed8b1);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#fe931e,endColorStr=#fed8b1);
}

#chart.ui-tabs-panel .panel {
	border-color: #FF8200;
}

.toolbar.chart .chart {
	position: absolute;
	width: auto;
	height: auto;
}

.toolbar.chart  .ui-icon {
	height:75px;
	width:90px;
	padding:0px;
	background-image:url('/assets/jit/jit-icons-chart-0.png');
}

.toolbar.chart .chart.table {left:77px;top:100px;}
.toolbar.chart .chart.pie {left:30px;top:190px;}
.toolbar.chart .chart.bar {left:130px;top:190px;}
.toolbar.chart .chart.line {left:30px;top:280px;}
.toolbar.chart .chart.block {left:130px;top:280px;}

.toolbar.chart .chart.table .ui-icon {background-position: 0px -225px;}
.toolbar.chart .chart.pie .ui-icon {}
.toolbar.chart .chart.bar .ui-icon {background-position: 0px -75px;}
.toolbar.chart .chart.line .ui-icon {background-position: 0px -300px;}
.toolbar.chart .chart.block .ui-icon {background-position: 0px -150px;}

.toolbar.chart .chart.table.ui-state-selected .ui-icon {background-position: -90px -225px;}
.toolbar.chart .chart.pie.ui-state-selected .ui-icon {background-position: -90px 0px;}
.toolbar.chart .chart.bar.ui-state-selected .ui-icon {background-position: -90px -75px;}
.toolbar.chart .chart.line.ui-state-selected .ui-icon {background-position: -90px -300px;}
.toolbar.chart .chart.block.ui-state-selected .ui-icon {background-position: -90px -150px;}

#chart .panel div.table,
#chart .panel div.charts,
#mix .panel .chartwrapper > div {display:inline-block;font-size:0px;}
.panel .table{
	overflow:hidden;
    width:25%;
    height:100%;
    z-index: 1;
	position: relative;
}

.panel .table table {
	width: 95%;
	margin-left: 5px;
	margin-top: 50%;
	font-size: 16px;
}

.panel .table table input {
	width:100%;
	background: transparent;
	border: 0;
	text-align: center;
	font-family: "Comic Sans MS", comicFont;
	color: #40aaf6;
	padding: 2px 0;
}

.panel .charts {
    width:75%;
    height:99%;
    top:1%;
    position:absolute;
    z-index: 1;
}

.panel .charts > div {
	position:absolute;
	width:50%;
    height:50%;
}
.panel .charts .pie {
	top:0px;
	left:0px;
}
.panel .charts .bar {
	top:0px;
	left:50%;
}
.panel .charts .line {
	top:50%;
	left:0px;
}
.panel .charts .block {
	top:50%;
	left:50%;
}

.panel table {
	font-family: comicFont;
	border-collapse: separate;
	border-bottom: solid thick #40aaf5;
}
.panel table tbody tr:nth-child(even) {background: #e7eef4}
.panel table tbody tr:nth-child(odd) {background: #FFF}
.panel table thead {
	color:#FFF;
}
.panel table thead td{
	text-align:center;
}

.panel table tbody td {
	border-left: thin solid #cccccc;
}

.panel table tbody tr:hover {
	background-color:#b2e1ff;
}

.panel .table table thead input {
	color: #FFF;
}

.panel .table .chartColourBox {
	margin-right: 4px;
	margin-top: 4px;
	-moz-box-shadow: 0px 0px 4px #FFF;
	-webkit-box-shadow: 0px 0px 4px #FFFFFF;
	box-shadow: 0px 0px 4px #FFFFFF;
	cursor:pointer;
	border-left-width: 22px;
	border-left-style: solid;
}

.panel .table .chartColourContainer {
	background-color:#3fa9f5;
	border-left: none;
}

.panel .table .borderLeft {
	border-top-left-radius: 5px;
	-webkit-border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	behavior: url(./e5/css3pie/PIE.htc);
	border: solid #40aaf5;
	background-color: #40aaf5;
	width: 50%;
}

.panel .table .borderRight {
	border-top-right-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	behavior: url(./e5/css3pie/PIE.htc);
	border: solid #40aaf5;
	background-color: #40aaf5;
}

.panel table tbody td:nth-child(1) {
	border-left: solid thick #40aaf5;
}

.panel table tbody td:nth-child(2) {
	border-right: solid thick #40aaf5;
}

#chart #titlebox {
	background-color: #E24807;
	display: table;
}

#chart .chartColourModal {
	width: 59px;
	height: 176px;
	display: block !important;
	position: absolute;
	z-index: 999;
	margin-left: 30px;
	background-color: #40aaf6;
	padding: 3px;
	border-radius: 5px;
	margin-top: -30px;
}

.chartColourModalColour {
	width: 25px !important;
	height: 25px;
	border-radius: 5px;
	display: inline-block !important;
	margin: 2px;
	cursor:pointer;
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

#turtle {
	background-color: #7ac943;
	background-image: -webkit-linear-gradient(top, #7ac943, #d1e7bd);
	background-image:    -moz-linear-gradient(top, #7ac943, #d1e7bd);
	background-image:     -ms-linear-gradient(top, #7ac943, #d1e7bd);
	background-image:      -o-linear-gradient(top, #7ac943, #d1e7bd);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#7ac943,endColorStr=#d1e7bd);
}

#turtle.ui-tabs-panel .panel {
	border-color: #69C325;
}

.toolbar {
	height: 80%;
	height: calc(100% - 130px);
}

#turtle #content {
	background-size: cover;
}

.toolbar.turtle .instruction {
	width: 140px;
	background-color:#FFF;
	border:2px;
	border-style:solid;
	border-color:#3fa9f5;
	box-shadow: 1px 1px 1px #3fa9f5;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
    margin-top: 5px;
    float:left;
    overflow-y: auto;
	overflow-x: hidden;
	cursor:pointer;
}

.toolbar.turtle .instruction::-webkit-scrollbar {
    width: 14px;
}

.toolbar.turtle .instruction::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #3fa9f5;
    border-radius: 10px;
    border-top-left-radius: 0;
     border-bottom-left-radius: 0;
}

.toolbar.turtle .instruction::-webkit-scrollbar-thumb {
    border-radius: 10px;
    border-radius: 10px;
    border-top-left-radius: 0;
     border-bottom-left-radius: 0;
    -webkit-box-shadow: inset 0 0 6px #3fa9f5;
}

.turtleDragBox {
	width: 170px;
	position: absolute !important;
	z-index: 4;
	opacity: 1 !important;
}

.toolbar.turtle .switchMode {
	height: 39px;
	border: 3px;
	width: 204px;
	border-style: solid;
	border-color: #3fa9f5;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #7ac943;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #3fa9f5;
	font-size: 12px;
	bottom: 98px;
	position: absolute;
	margin-left: -8px;
}


.toolbar.turtle .addTurtle {
	width:60px;
	height:60px;
	border:5px;
	border-style:solid;
	border-color:#3fa9f5;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	behavior: url(./e5/css3pie/PIE.htc);
    color:#7ac943;
    background-color:#FFFFFF;
    box-shadow: 1px 1px 1px #3fa9f5;
    margin-top: 40px;
    font-size: 25px;
    float:left;
	margin-left: -10px;
	bottom: 0;
	position: absolute;
}

.toolbar.turtle .clearTurtle, .toolbar.turtle .homeTurtle {
	width:50px;
	height:50px;
	border:5px;
	border-style:solid;
	border-color:#ed1e79;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
    background-color:#FFFFFF;
    box-shadow: 1px 1px 1px #686868;
    margin-top: 20px;
    font-size: 25px;
    color:#ff931e;
	position: absolute;
	margin-left: 60px;
}

.toolbar.turtle .clearTurtle{
	bottom: -17px;
}

.toolbar.turtle .homeTurtle{
	bottom: 35px;
}


.toolbar.turtle .resetTurtle {
	width:50px;
	height:50px;
	border:5px;
	border-style:solid;
	border-color:#ed1e79;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
    color:#333333;
    background-color:#FFFFFF;
    box-shadow: 1px 1px 1px #686868;
    font-size: 25px;
    /*margin-top: 75px;*/
	margin-left: -135px;
	margin-left: 60px;
	bottom: -25px;
	position: absolute;
}

.toolbar.turtle .goTurtle {
	width:80px;
	height:80px;
	border:5px;
	border-style:solid;
	border-color:#ed1e79;
	border-radius: 40px;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	behavior: url(./e5/css3pie/PIE.htc);
    color:#7ac943;
    background-color:#FFFFFF;
    box-shadow: 1px 1px 1px #686868;
    margin-top: 30px;
    font-size: 25px;
    float:left;
    bottom: -8px;
	position: absolute;
	margin-left: 120px;
}

.newTurtleDialog {
	border: solid 8px #AAEB7D;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	behavior: url(./e5/css3pie/PIE.htc);
	box-shadow: 5px 5px 20px #888888;
	overflow: visible;
}

.ui-dialog #newTurtleDialog.ui-dialog-content {
	border-color: #7ac943;
	box-shadow: 0px -3px 3px #18702A;
}

ul.turtleBank li {
    -webkit-column-break-inside:avoid;
    -moz-column-break-inside:avoid;
    -o-column-break-inside:avoid;
    -ms-column-break-inside:avoid;
    column-break-inside:avoid;
}
ul.turtleBank {
    list-style: none;
    padding-left: 0.5em;
    margin-top: 1em;
    -webkit-column-width: 100px;
    -webkit-column-gap:1px;
    -moz-column-width: 100px;
    -moz-column-gap:1px;
    -o-column-width: 100px;
    -o-column-gap:1px;
    column-width: 100px;
    column-gap: 1px;
    margin: 15px 0px;
}

ul.turtleBank li img {
	max-width:100px;
	max-height:100px;
	cursor:pointer;
	vertical-align: middle;
}

ul.turtleBank li.turtleBankCell {
	text-align: center;
	min-height: 115px;
    line-height: 115px;
}

.toolbar.turtle #instructionContainer {
	width:139px;
	height: 100%;
    /*margin-top: 40px;*/
}

.instructionImg {
	float: right;
	margin-right: -90px;
	margin-top: 20px;
}

.instructionImg img {
	max-width: 60px;
	margin-right: 22px;
	max-height: 119px;
	margin-top: 5px;
}

.deleteTurtle {
	width: 20px;
	height: 20px;
	border: 3px;
	border-style: solid;
	border-color: #ed1e79;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #333333;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #686868;
	font-size: 15px;
	position: absolute;
	cursor:pointer;
	float: left;
	margin-left: 200px;
	margin-top: 40px;
}
.deleteTurtle i {
	margin-left: 4px;
	margin-top: 2px;
}

.turtleDragBoxUp {
	width: 20px;
	height: 20px;
	border: 5px;
	border-style: solid;
	border-color: #ed1e79;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #333333;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #686868;
	font-size: 15px;
	position: absolute;
	left: 70px;
	top: -15px;
	cursor:pointer;
}
.turtleDragBoxUp i {
	margin-left: 3px;
	margin-top: 2px;
}

.turtleDragBoxLeft {
	width: 20px;
	height: 20px;
	border: 5px;
	border-style: solid;
	border-color: #ed1e79;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #333333;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #686868;
	font-size: 15px;
	position: absolute;
	top: 80px;
	left: -15px;
	cursor:pointer;
}
.turtleDragBoxLeft i {
	margin-left: 2px;
	margin-top: 3px;
}

.turtleDragBoxRight {
	width: 20px;
	height: 20px;
	border: 5px;
	border-style: solid;
	border-color: #ed1e79;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #333333;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #686868;
	font-size: 15px;
	position: absolute;
	top: 80px;
	right: -15px;
	cursor:pointer;
}
.turtleDragBoxRight i {
	margin-left: 3px;
	margin-top: 3px;
}

.turtleDragBoxDown {
	width: 20px;
	height: 20px;
	border: 5px;
	border-style: solid;
	border-color: #ed1e79;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #333333;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #686868;
	font-size: 15px;
	position: absolute;
	bottom: -15px;
	left: 70px;
	cursor:pointer;
}
.turtleDragBoxDown i {
	margin-left: 3px;
	margin-top: 2px;
}

.instructionList {
	overflow: scroll;
}

.instructListItem {
	padding: 5px;
	list-style: none;
	font-family: comicFont;
	border-bottom: solid thin #40aaf5;
	padding-left: 15px;

	-ms-touch-action:none;
	touch-action:none;
}

#turtle #titlebox {
	background-color: #107800;
}

.newTurtleDialog .ui-dialog-title {
	display: block !important;
	font-size: 18px;
	margin-top: 6px;
}

#instructButtons {
	float: right;
}

#instructButtons i {
	opacity: 0.2;
	cursor: pointer;
}

#instructButtons i:hover {
	opacity: 1;
}

.commandArrow {
	margin-right: 5px;
	opacity: 1 !important;
}

.turtleDragBox img {
	width: 100%;
}

.turtlePenDown {
	position: absolute;
	left: -5px;
	top: -10px;
	letter-spacing: -15px;
	font-size: 19px;
	width: 23px;
	height: 23px;
	border: 5px;
	border-style: solid;
	border-color: #38EB28;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #333333;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #686868;
	cursor: pointer;
}

.turtlePenDown > i {
	padding-left: 4px;
	padding-top: 2px;
}

.turtlePenUp {
	position: absolute;
	right: -5px;
	top: -10px;
	font-size: 19px;
	width: 23px;
	height: 23px;
	border: 5px;
	border-style: solid;
	border-color: #FF0000;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #333333;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #686868;
	cursor: pointer;
}

.turtlePenUp > i {
	padding-left: 4px;
	padding-top: 2px;
}

.turtlePenColour {
	position: absolute;
	margin-left: 198px;
	margin-top: 70px;
	font-size: 27px;
	width: 23px;
	height: 23px;
	color: #FF0000;
	cursor: pointer;
}

.turtlePenColour > i {
	padding-left: 4px;
	padding-top: 2px;
}


.turtleDragBox.moving .turtlePenUp,
.turtleDragBox.moving .turtlePenDown,
.turtleDragBox.moving .turtleDragBoxUp,
.turtleDragBox.moving .turtleDragBoxLeft,
.turtleDragBox.moving .turtleDragBoxRight,
.turtleDragBox.moving .turtleDragBoxDown {
	display:none;
}

.turtleDragBox.small .turtleDragBoxLeft,
.turtleDragBox.small .turtleDragBoxRight,
.turtleDragBox.small .turtleDragBoxUp,
.turtleDragBox.small .turtleDragBoxDown,
.turtleDragBox.small .turtlePenDown,
.turtleDragBox.small .turtlePenUp {
	border-width: 2px;
	width: 15px;
	height: 15px;
	font-size: 10px;
}

[aria-labelledby="ui-dialog-title-newTurtleDialog"] {
	background-color: #7ac943 !important;
}


.switchModeSimple {
	height: 39px;
	border: 3px solid #3fa9f5 !important;
	width: 95px;
	border-radius: 30px !important;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #7ac943;
	box-shadow: 1px 1px 1px #3fa9f5;
	font-size: 12px !important;
	bottom: 85px;
	position: absolute;
	margin-left: -10px;
	background-color: #FFF !important;
	float: left;
	text-align: left;
	padding-left: 6px;
}
.switchModeSimple span, .switchModeAdvanced span {font-family: "Lexend", ABeeZee, sans-serif;font-size: 14px;}

.switchModeAdvanced {
	height: 39px;
	border: 3px solid #3fa9f5 !important;
	width: 95px;
	border-radius: 30px !important;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #7ac943;
	box-shadow: 1px 1px 1px #3fa9f5;
	font-size: 12px !important;
	bottom: 85px;
	position: absolute;
	margin-left: 95px;
	background-color: #FFF !important;
	float: left;
	text-align: left;
	padding-left: 6px;
}

.modeCheck {
	display: none;
	font-size: 36px;
	position: absolute;
	right: -11px;
	top: -6px;
	color: #7ac943;
	text-shadow: 2px 2px #69AC3B;
}

.buttonDisable {
	opacity: 0.6;
}

.paint-icon{
	font-size: 0.6em;
}

.paint-icon .pencil{
	color: white;
}

.paint-icon .pencil.black{
	color: black;
}

.paint-icon .border{
	color: #ed1e79;
	font-size: 2.2em;
}

.paintButtons{
	position: absolute;
	width:200px;
	top:10px;
	z-index:1;
}

.paintButtons .paintPalBlock{
	width:22px;
	height:25px;
	box-shadow: 2px 2px 2px #3fa9f5;
	margin: 7px;
	margin-top: 0;
	border-radius: 5px;
	display: inline-flex;
}

.paintButtons .red {
	background-color:#ff1d25;
}

.paintButtons .darkpink {
	background-color:#ed1e79;
}

.paintButtons .orange {
	background-color:#ff931e;
}

.paintButtons .pink {
	background-color:#ff7bac;
}

.paintButtons .yellow {
	background-color:#fcee21;
}

.paintButtons .beige {
	background-color:#c69c6d;
}

.paintButtons .green {
	background-color:#7ac943;
}

.paintButtons .darkyellow {
	background-color:#d9e021;
}

.paintButtons .darkblue {
	background-color:#2e3192;
}

.paintButtons .lightblue {
	background-color:#3fa9f5;
}

.paintButtons .purple {
	background-color:#662d91;
}

.paintButtons .lightpurple {
	background-color:#a381bd;
}

.paintButtons .black {
	background-color:#000000;
}

.paintButtons .darkgrey {
	background-color:#4d4d4d;
}

.paintButtons .lightgrey {
	background-color:#b3b3b3;
}

.paintButtons .white {
	background-color:#ffffff;
}

.toolbar.turtle .selectedColor{
  border: solid medium white;
}

.turtleDragBox.turtle_townman img,
.turtleDragBox.turtle_cinderella img{
	transform:scale(0.5);
	-webkit-transform: scale(0.5);
    -ms-transform: scale(0.5);

}

/* Design mode styles */
div.designimgwrap, button.ui-button.designimgwrap {
	border: 3px solid #3fa9f5 !important;
	border-radius: 30px !important;
	text-align: center;
	padding: 7px;
	background-color: white;
	margin-top:40px;
}
div.designimgwrap.m10, button.designimgwrap.m10 {
	margin-top: 10px;
}

div.designimgwrap input {
	opacity: 0;
    width: 0.1px;
    height: 0.1px;
}
/*
// Copyright Just2easy Limited 2015 all rights reserved.
*/
.toolbar.branch .switchBranchModeSimple,
.toolbar.branch .switchBranchModeAdvanced,
.wrap #searchIcon,
.toolbar.branch .wrap #addWordIcon,
#branch #content .hint,
.toolbar.branch .branchCardWrap .thinkofyourown
{
	background-image:url('/assets/jit/jit-branch-2.png');
}

#branch {
	background-color: #C626C0;
	background-image: -webkit-linear-gradient(top, #C626C0, #FC59FF);
	background-image:    -moz-linear-gradient(top, #C626C0, #FC59FF);
	background-image:     -ms-linear-gradient(top, #C626C0, #FC59FF);
	background-image:      -o-linear-gradient(top, #C626C0, #FC59FF);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#C626C0,endColorStr=#FC59FF);
}
#branch #titlebox {background-color: #7F0F7C}

#branch.ui-tabs-panel .panel {
	border-color: #A146FF;
}

.toolbar.branch .switchBranchModeSimple, .toolbar.branch .switchBranchModeAdvanced {
	width: 90px;
    height: 60px;
    vertical-align: middle;
    margin: 10px 5px;
}
.toolbar.branch .switchBranchModeSimple.buttonDisable, .toolbar.branch .switchBranchModeAdvanced.buttonDisable {
	width: 85px;
    height: 55px;
    opacity: 1;
}
.toolbar.branch .switchBranchModeSimple.buttonDisable {background-position: -395px -5px;}
.toolbar.branch .switchBranchModeAdvanced.buttonDisable {background-position: -495px -5px;}
.toolbar.branch .switchBranchModeSimple {background-position: -395px -80px;margin-left: 15px;}
.toolbar.branch .switchBranchModeAdvanced {background-position: -500px -80px;}

#tabs .toolbar.branch .switchBranchModeSimple span,
#tabs .toolbar.branch .switchBranchModeAdvanced span {
	font-size: 10px;
    padding: 0;
    margin-top: 14px;
    margin-left: -4px;
    color: #333;
}

#content #instruction {
	text-align: center;
    margin-top: 15px;
    font-family: "Lexend", ABeeZee, sans-serif;
    font-size: 18px;
    color: #3C3C3C;
}
#content #instruction span {
	background-color: white;
    padding: 2px 10px;
    border-radius: 8px;
}
#content #instruction > .clickspeak {
	position: relative;
    display: inline-block;
    vertical-align: bottom;
    float: none;
    margin-left: 15px;
}

#bucket {
    overflow-y: auto;
    margin: 20px;
    margin-bottom: 0;
    border: 3px solid #7F0F7C;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
}
#bucket.sorting, #bucket.editing {
	border-bottom: none;
	border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
#bucket.capturingsvg {border:none;overflow: hidden !important;}
#content #question {
	margin: 0 20px 0 20px;
    height: 80px;
    border-left: 3px solid #7F0F7C;
    border-right: 3px solid #7F0F7C;
    background-color: #FEDAFF;
    text-align: center;
}
#content #question input {
	font: 20px "Lexend", ABeeZee, sans-serif;
    padding: 10px;
    margin: 16px;
    width: 50%;
    text-align: center;
    border-radius: 25px;
    border: 2px solid #DB57D9;
    outline: none;
}
#content #question #qrecording {
    margin-top: -53px;
    position: absolute;
    left: 30px;
}
#content #question #qrecording i.fa {padding-left:0;}
#content #yes {
	margin-left: 20px;
    width: 46%;
    display: inline-block;
    overflow-y: auto;
    border-left: 3px solid #7F0F7C;
    border-bottom: 3px solid #7F0F7C;
    border-bottom-left-radius: 8px;
    vertical-align: top;
}
#content #no {
	margin-right: 20px;
    width: 48%;
    display: inline-block;
    overflow-y: auto;
    border-right: 3px solid #7F0F7C;
    border-bottom: 3px solid #7F0F7C;
    border-bottom-right-radius: 8px;
    border-left: 4px dashed #FEDAFF;
    vertical-align: top;
}
#yes.ui-state-highlight, #no.ui-state-highlight {border:none;background:none;background-color:#c6dcfa;}
#yes.drop-hover, #no.drop-hover {background: none; background-color: #f1c8ef;}
#content #yes > .hint, #content #no > .hint {
	position: absolute;
    top: 75%;
    font-size: 60px;
    font-family: "Lexend", ABeeZee, sans-serif;
    color: #FEDAFF;
    width: 64px;
    height: 64px;
}
#content #yes > .hint {left: 20%;background-position: -610px -69px;}
#content #no > .hint {left: 70%;background-position: -689px -69px;}
#content #yes.ui-state-highlight > .hint, #content #no.ui-state-highlight > .hint {color:white;}

#bucketButton {
	float: right;
	background-color: white;
    border: 5px solid #15A9FE;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
    margin-top: 10px;
    margin-right: 20px;
    padding: 8px 15px;
    cursor: pointer;
    font-family: "Lexend", ABeeZee, sans-serif;
}

.branchCard {
	width: 200px;
    text-align: center;
}

.branchCard div.mainItem .j2audiojp{
	display:inline-block;
}

div.mainItem .jp-title{
	display:none;
}

.branchCard div.mainItem ~ input {
	display:none;
}

.branchCardWrap, .branchCard {
	position: relative;
	display: inline-block;
	margin: 10px;
    padding: 10px;
    background-color: white;
    border: 2px solid #7F0F7C;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
	cursor: pointer;
}
.branchCardWrap[id^="word"], .branchCard {
	padding: 10px 25px;
}
#bucket > img {margin: 5px;}
#bucket img[src$='.svg'], #yes img[src$='.svg'], #no img[src$='.svg'], .branchCardWrap img[src$='.svg']{
	width:100px;
}
#bucket img, #yes img, #no img, .branchCardWrap img, .mainItem {max-width:100px; max-height: 70px;}
.branchCard input, .branchCard textarea {
    width: 180px;
    margin-bottom: 5px;
    border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	behavior: url(./e5/css3pie/PIE.htc);
    border: 1px solid #E7E7E7;
    text-align: center;
    font-family: "Lexend", ABeeZee, sans-serif;
}

.branchCardWrap .fa-trash, .branchCard .fa-trash,
.branchCardWrap .fa-recycle, .branchCard .fa-recycle {
    top: 2px;
    left: 1px;
    position: absolute;
    cursor: pointer;
    z-index: 1;
    display: none;
    color: #7F0F7C;
}
.branchCardWrap:hover .fa-trash, .branchCard:hover .fa-trash,
.branchCardWrap:hover .fa-recycle, .branchCard:hover .fa-recycle {
	display: block;
}
#bucket.sorting .fa-trash, .branchCardWrap[data-parent] .fa-trash {display:none !important;}

.treeItems .branchCardWrap {cursor: default;}
.treeItems .branchCardWrap.selected {background-color: #EDB9EC;}
.toolbar.branch .branchCardWrap.toyoWrap {vertical-align: middle;}
.toolbar.branch .branchCardWrap.toyoWrap .thinkofyourown {
	background-position: -593px -160px;
	width: 60px;
	height: 40px;
	margin: 5px 0;
}

#qhistory {
	display: block;
	position: absolute;
	top: 51%;
	right: 25px;
	z-index: 5;
}
.addingedit ~ #qhistory {
	top: 10%;
}

#qhistory > i {
	font-size: 18px;
	padding-left: 8px;
	padding-top: 6px;
}
#jbranchqhistory .columns {
    font-family: "Lexend", ABeeZee, sans-serif;
    margin-top: 5px;
    border-bottom: 1px dashed #9FD4FA;
}
.columns:first-child {margin-top: 15px;}
#jbranchqhistory .columns > div{
	vertical-align: middle;
    display: inline-block;
}
#jbranchqhistory .column-left {width: 10%;}
#jbranchqhistory .column-center {width: 70%;}
#jbranchqhistory .column-right {width: 20%;}

.toolbar.branch .pbwrap img {cursor: move;}

.toolbar.branch .treeItemsWrap {
	overflow-y: auto;
    height: 80%;
    border-radius: 8px;
}
.toolbar.branch .treeItems {
	background-color: white;
	border-radius: 8px;
}

.toolbar.branch .treeItems .branchCardWrap img {
	vertical-align: middle;
	width: 60px;
}
.toolbar.branch .treeItems.win .branchCardWrap img {width: 50px;}
.toolbar.branch .treeItems .branchCardWrap .treeItemInfo {
	position: absolute;
    top: -5px;
    right: -5px;
    width: 21px;
    height: 21px;
    background-color: #7F0F7C;
    border-radius: 5px;
    color: white;
    text-align: center;
}
.toolbar.branch .treeItems .branchCardWrap .treeItemInfo .fa {margin: 3px 0;}

#jbranchanswerinfo img {
    max-width: 250px;
}
#jbranchanswerinfo p {font-family: "Lexend", ABeeZee, sans-serif;}
#jbranchanswerinfo p.title {
	font-size: 20px;
	font-weight: bold;
    line-height: 25px;
    margin-bottom: 10px;
}
#jbranchanswerinfo p.description {
	font-size: 14px;
}

/*
Colours for media chooser
*/
.toolbar.branch #media-tabs .bankPrev, #media-tabs .bankNext,
.toolbar.branch #media-tabs .wordBankPrev, #media-tabs .wordBankNext,
.toolbar.branch #media-tabs .googlePrev, #media-tabs .googleNext {
    background-color: #EDB9EC;
}

.toolbar.branch #media-tabs .bankPrev.enabled, #media-tabs .bankNext.enabled,
.toolbar.branch #media-tabs .wordBankPrev.enabled, #media-tabs .wordBankNext.enabled,
.toolbar.branch #media-tabs .googlePrev.enabled, #media-tabs .googleNext.enabled {
	background-color: #C526BF;
}

.toolbar.branch #media-tabs .wrap {
	background-color: #7F107D;
    border-color: #7F107D;
}

@media screen and (max-width: 1120px) {
	.branchCardWrap, .branchCard {
		margin: 5px;
    	padding: 5px;
	}
}

@media screen and (max-width: 970px) {
	#content #instruction {
		margin-top:5px;
		font-size: 14px;
	}
	#bucket {margin-top: 10px;}
	#content #question {height: 50px;}
	#content #question input{
		margin: 8px;
		padding: 5px;
    	font-size: 16px;
    }
    #content #question #qrecording {
	    margin-top: -34px;
	}
    #content #question .recorderButton, #content #qhistory {
    	border-radius: 15px;
	    -webkit-border-radius: 15px;
	    -moz-border-radius: 15px;
	    behavior: url(./e5/css3pie/PIE.htc);
	    width: 20px;
	    height: 20px;
    }
    #content #question .recorderButton i.fa {
	    font-size: 14px;
	    padding-left: 1px;
	    padding-top: 3px;
    }
    #content #qhistory.recorderButton i.fa {
	    font-size: 14px;
	    padding-left: 5px;
	    padding-top: 4px;
	}

	#bucket img, #yes img, #no img, .mainItem {
	    max-width: 70px;
	    max-height: 49px;
	}
}

.tooltipster-sidetip.tooltipster-punk.tooltipster-jitbranch .tooltipster-box {border-bottom: 6px solid #FC59FF;}
.tooltipster-sidetip.tooltipster-punk.tooltipster-jitbranch .tooltipster-arrow-border {border-top-color:#FC59FF;}

#branch #media-tabs .btab-panel {background-color:#fff1ff;}
/*
// Copyright Just2easy Limited 2014-15 all rights reserved.
*/

#pictogram {
	background-color: #ff1d25;
	background-image: -webkit-linear-gradient(top, #ff1d25, #f7aeb1);
	background-image:    -moz-linear-gradient(top, #ff1d25, #f7aeb1);
	background-image:     -ms-linear-gradient(top, #ff1d25, #f7aeb1);
	background-image:      -o-linear-gradient(top, #ff1d25, #f7aeb1);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ff1d25,endColorStr=#f7aeb1);
}

#pictogram.ui-tabs-panel .panel {
	border-color: #FF0015;
}

#pictogram .toolbar.paint .plusSize,
#pictogram .toolbar.paint .minusSize,
#pictogram .toolbar.paint .rotate,
#pictogram .toolbar.paint .colourInput,
#pictogram .toolbar.paint .chooseTexture,
#pictogram .toolbar.paint .chooseColour {
	border-color:#F50023;
    box-shadow: 1px 1px 1px #F50023;
}

/*
Colours for media chooser
*/
#pictogram .toolbar.paint #media-tabs .bankPrev, #pictogram .toolbar.paint #media-tabs .bankNext{
    background-color: #f7aeb1;
}

#pictogram .toolbar.paint #media-tabs .bankPrev.enabled, #pictogram .toolbar.paint #media-tabs .bankNext.enabled{
	background-color: #F50023;
}

#pictogram .toolbar.paint #media-tabs .wrap {
	background-color: #F50023;
    border-color: #F50023;
}

#pictogram .toolbar.paint .picturebank span,
#pictogram .toolbar.paint .picturebankopen {
	background-color:#ffeced;
	border-color:#F50023;
}


#pictogram .toolbar.paint .picturebankleft span,
#pictogram .toolbar.paint .picturebankright span {
	border-color:#F50023;
    box-shadow: 2px 2px 2px #F50023;
}

#pictogram .toolbar.paint .paintPalBlock{
	box-shadow: 2px 2px 2px #F50023;
}

#pictogram .toolbar.paint .flip {
	margin-bottom:70px;
}

#pictogram #titlebox {
	background-color: #AB0001;
}

/* Pictogram Styles */

#pictogram .pictoControls {
	position: absolute;
	bottom: 0;
	width: 100%;
}

#pictogramItems {
	list-style: none;
	position: absolute;
	bottom: 0;
}

#pictogramItems li {
	display: inline-block;
	padding-right: 10px;
}

#pictogramItems canvas {
	-ms-touch-action:none;
	touch-action:none;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	behavior: url(./e5/css3pie/PIE.htc);
	border: solid 3px #3fa9f5;
	box-shadow: 2px 2px 2px rgba(0,0,0,0.5);
}

#pictogramItems li.stampOver > canvas {
	border-color: red;
}

.pictoAxis {
  top: 0px;
  position: absolute;
  display:none;
}

.pictoAxis div {
  position: absolute;
}

.pictoAxis div label {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  color:#b3b3b3;
  font-family:"Lexend", ABeeZee, sans-serif;
}

#pictogramItems input {
	margin-bottom: 10px;
	width: 100%;
	background: transparent;
	border: 0;
	text-align: center;
	font-family: "Lexend", ABeeZee, sans-serif;
	color: #40aaf6;
}

#pictogramItems .itemButtons {
	text-align: center;
	position: absolute;
	top: -25px;
}

.pictoControls .small i.fa {
	margin-top: 8px;
}

#pictogramItems .itemButtons .addVote,
.pictoControls #addItem {
	color:#7ac943;
}
#pictogramItems .itemButtons .delVote,
.pictoControls #delItem {
	color:red;
}

button#addItem,
button#delItem,
button.addVote,
button.delVote {
    box-sizing: content-box;
    font-size: 20px;
    margin:0px;
	padding:0px;
}


#addItem, #delItem, .addVote, .delVote {
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	behavior: url(./e5/css3pie/PIE.htc);
	border: solid thick #3fa9f5;
	-webkit-filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.5));
	width: 35px;
	height: 35px;
	background-color: #FFF;
	font-size: 20px;
	display: inline-block;
}

.addVote.small, .delVote.small {
	border: none;
	margin-right: 10px;
	background-color: transparent;
}

#addDelItems {
	width: 60px;
	float: right;
	text-align: center;
}

#addDelItems > .wrapper {width: 60px;height:90px;}

#editTickSpan {
	padding: .4em 1em;
	display: block;
	line-height: 1.4;
	font-family: "Lexend", ABeeZee, sans-serif;
}

#editTick {
	width: 15px;
	height: 15px;
	position: relative;
    border: none;
	background-color: transparent;
	display: block;
}

.editTick {float:left;}
#editTick > i.editTick {margin-top:0}

#pictogram .toolbar.paint .bankPrev.enabled, #pictogram .toolbar.paint .bankNext.enabled,
#pictogram .toolbar.paint .googlePrev.enabled, #pictogram .toolbar.paint .googleNext.enabled {
	background-color:#F50023;
}
#pictogram .toolbar.paint .bankPrev, #pictogram .toolbar.paint .bankNext,
#pictogram .toolbar.paint .googlePrev, #pictogram .toolbar.paint .googleNext {
    background-color: #F7AEB1;
}

#pictogram .toolbar.paint #paintpiccamera {
	color:#F50023;
}

.tooltipster-sidetip.tooltipster-punk.tooltipster-jitpictogram .tooltipster-box {border-bottom: 6px solid #f7aeb1;}
.tooltipster-sidetip.tooltipster-punk.tooltipster-jitpictogram .tooltipster-arrow-border {border-top-color:#f7aeb1;}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

#animate {
	background-color: #ed1e79;
	background-image: -webkit-linear-gradient(top, #ed1e79, #f5afcd);
	background-image:    -moz-linear-gradient(top, #ed1e79, #f5afcd);
	background-image:     -ms-linear-gradient(top, #ed1e79, #f5afcd);
	background-image:      -o-linear-gradient(top, #ed1e79, #f5afcd);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ed1e79,endColorStr=#f5afcd);
}

#animate.ui-tabs-panel .panel {
	border-color: #E80067;
    background-size: auto;
    background-image: url(/assets/jit/paint/background.png);
}

#animate .toolbar.paint .plusSize,
#animate .toolbar.paint .minusSize,
#animate .toolbar.paint .flip,
#animate .toolbar.paint .rotate,
#animate .toolbar.paint .colourInput,
#animate .toolbar.paint .chooseTexture,
#animate .toolbar.paint .chooseColour {
	border-color:#ea2c80;
}

#animate .toolbar.paint .picturebank span,
#animate .toolbar.paint .picturebankopen {
	background-color:#fdf0f6;
	border-color:#ea2c80;
}


#animate .toolbar.paint .picturebankleft span,
#animate .toolbar.paint .picturebankright span {
	border-color:#ea2c80;
}

#animate .toolbar.paint .paintPalBlock{
	box-shadow: 2px 2px 2px #ea2c80;
}


#animate #titlebox {
	background-color: #B30054;
}

#onionskin + #maincanvas {
	background-color: transparent !important;
}

/* Animate Control Styles */

.animatecontrols {
	position: absolute;
	width: 100%;
	height: 100px;
	bottom: 5px;
}

.animatecontrols.hidden{
	display:none !important;
}

.animatecontrols > #play,
.animatecontrols > #del,
.animatecontrols > #add,
.animatecontrols > #clone,
.animatecontrols > #playcontrols div {
	border: 5px solid;
	border-radius: 40px;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	behavior: url(./e5/css3pie/PIE.htc);
	color: #7ac943;
	background-color: #FFFFFF;
	box-shadow: 1px 1px 1px #686868;
	font-size: 25px;
}

.animatecontrols > #play {
	width: 40px;
	height: 40px;
	border-color: #ed1e79;

	margin-left: 15px;
	display: inline-block;
	vertical-align: middle;
}
.animatecontrols > #play > i {
	margin-top: 8px;
	margin-left: 12px;
}
.animatecontrols > #play > i.fa-stop {
	color: #FF8200;
	margin-left: 9px;
}

.animatecontrols > #background {
	display: inline-block;
	vertical-align: middle;
	width: 80px;
	height: 60px;
	border: 4px solid #262626;
	margin-left: 15px;
	margin-top: 5px;
    background-size: 15px;
    background-image: url(/assets/jit/paint/background.png);
}

.animatecontrols > ul#frames  {
	position: absolute;
	top: -10px;
	left: 190px;
	right: 5px;
	padding: 8px 12px;

	list-style: none;
	background-color: #262626;

	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;

	border-radius: 15px 0px 15px 15px;
	-webkit-border-radius: 15px 0px 15px 15px;
	-moz-border-radius: 15px 0px 15px 15px;
	behavior: url(./e5/css3pie/PIE.htc);
}

.animatecontrols > ul#frames li {
	display: inline-block;
	margin-right: 8px;
	padding: 1px 0px;
	border-top: 5px dotted white;
	border-bottom: 5px dotted white;
}

.animatecontrols > ul#frames li:last-child {
    margin-right: 0px;
}

.animatecontrols > ul#frames canvas, .animatecontrols > ul#frames div.capturing {
	width: 80px;
	height: 60px;
	background-color: white;
	vertical-align: middle;
	border-top: 4px solid #262626;
	border-bottom: 4px solid #262626;
	display: inline-block;
}
.animatecontrols > ul#frames canvas.active,
.animatecontrols > #background.active {
	border: 4px solid #3fa9f5;
}

.animatecontrols > #del,
.animatecontrols > #add,
.animatecontrols > #clone {
	width: 35px;
    height: 35px;
    position: absolute;
}

.animatecontrols > #del,
.animatecontrols > #add {
    border-color: #3FA9EF;
    top: -25px;
}

.animatecontrols > #del > i,
.animatecontrols > #add > i,
.animatecontrols > #clone > i {
	margin-top: 5px;
	margin-left: 8px;
}

.animatecontrols > #del {color: red;}

.animatecontrols > #clone {
	top: 25px;
	width: 20px;
	height: 20px;
	font-size: 15px;
}

.animatecontrols > #clone > i {
	margin-top: 3px;
	margin-left: 4px;
	color: red;
}

.animatecontrols > #playcontrols {
	position: absolute;
	bottom: -25px;
	right: 5px;
}

.animatecontrols > #playcontrols div {
	width: 20px;
	height: 20px;
	display: inline-block;

	border: 4px solid #3FA9EF;
	font-size: 15px;
	vertical-align: middle;
}

.animatecontrols > #playcontrols i.fa {
	margin-left: 4px;
	margin-top: 3px;
}

.animatecontrols > #playcontrols > #loop {
	width: 60px;
	margin-left: 25px;
}
.animatecontrols > #playcontrols > #loop > i.fa-repeat {
	margin-left: 22px;
}
.animatecontrols > #playcontrols > #loop > i.fa-arrows-h {
	position: relative;
    top: -3px;
    left: 15px;
    margin-left: 3px;
    font-size: 22px;
}
.animatecontrols > #playcontrols i.fa.fa-long-arrow-right {
	position: relative;
    top: -3px;
    left: 16px;
    margin-left: 3px;
    font-size: 22px;
}

.animatecontrols > #playcontrols > #speed {
	width: 165px;
}

.animatecontrols > #playcontrols #slower {
	float: left;
	margin: -4px;
}

.animatecontrols > #playcontrols #faster {
	float: right;
    margin: -4px;
    box-shadow: none;
    width: 45px;
}

.animatecontrols > #playcontrols #arrows {
    text-align: center;
    width: 70px;
    border: none;
    box-shadow: none;
    height: 10px;
    background-color: #7ac943;
    background-image: none;
    margin-left: 15px;
}

#playcontrols #arrows .ui-slider-handle{
	background-color:#7ac943;
	border:solid 5px #36485A;
	border-radius:50%;
	width:10px;
	height:10px;

}

.animatecontrols > #playcontrols #arrows > i { margin-left: 0px; }

#background-frame-text {
	width: 122px;
	margin-left: 63px;
	margin-top: 8px;
	text-align: center;
	color: #777;
}

#animate .toolbar.paint .bankPrev.enabled, #animate .toolbar.paint .bankNext.enabled,
#animate .toolbar.paint .googlePrev.enabled, #animate .toolbar.paint .googleNext.enabled {
	background-color:#ED1E79;
}
#animate .toolbar.paint .bankPrev, #animate .toolbar.paint .bankNext,
#animate .toolbar.paint .googlePrev, #animate .toolbar.paint .googleNext {
    background-color: #F5AFCD;
}

#animate .toolbar.paint #paintpiccamera {
	color:#ED1E79;
}

.tooltipster-sidetip.tooltipster-punk.tooltipster-jitanimate .tooltipster-box {border-bottom: 6px solid #F5AFCD;}
.tooltipster-sidetip.tooltipster-punk.tooltipster-jitanimate .tooltipster-arrow-border {border-top-color:#F5AFCD;}

.animatecontrols ~ .hideshowanimate{
    position: absolute;
    bottom: 19px;
    right: -19px;
    width: 16px;
    height: 88px;
    color: #262626;
    border: 4px solid #262626;
    background-color: white;
    border-radius: 0px 5px 5px 0px;
    -webkit-border-radius: 0px 5px 5px 0px;
}

.animatecontrols ~ .hideshowanimate .fa{
	margin:6px;
}
/*
// Copyright Just2easy Limited 2014 all rights reserved.
*/

#mix {
	background-color: #333333;
	background-image: -webkit-linear-gradient(top, #333333, #b6b6b6);
	background-image:    -moz-linear-gradient(top, #333333, #b6b6b6);
	background-image:     -ms-linear-gradient(top, #333333, #b6b6b6);
	background-image:      -o-linear-gradient(top, #333333, #b6b6b6);
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#333333,endColorStr=#b6b6b6);
}

#mix.ui-tabs-panel .panel {
	border-color: #262626;
}

#mix #titlebox {
	background-color: #262626;
	color:white;
}

#mix #titlebox #addPage, #mix #titlebox #removePage{
	display: inline-block;
	color: green;
	float: right;
}

#mix #removePage i,
#mix #addPage i {
	font-size: 21px;
	padding-left: 7px;
	padding-top: 4px;
}

#mix #prevPage,
#mix #nextPage {
	position: absolute;
	width: 28px;
	height: 28px;
	border-width: 4px;
	box-shadow: none;
	margin: 0;
	color: #FF8200;
	font-size: 16px;
	line-height: 28px;
	vertical-align: middle;
	text-align: center;
	transition: opacity .3s ease-out;
}

#mix #nextPage {
	right: 2px;
}

#mix #prevPage {
	left: 2px;
}

#mix #nextPage i {
	margin-left: 2px
}
#mix #prevPage i {
	margin-right: 2px
}



#mix #titlebox{
	width:500px;
}

#mix #titleContainer #pagesLabel {
	font-family: "Lexend", ABeeZee, sans-serif;
	margin: 6px;
	float: right;
}

#mix #titlebox #removePage{
	color:red;
}

#mix #content {
	background-color: #EFEAD5;
}

#mix #maincanvas.landscape,
#mix #onionskin.landscape,
#mix #mainPictogramCanvas.landscape,
#mix .writewrapper.landscape,
#mix .branchwrapper.landscape,
#mix .chartwrapper.landscape {
	background-color: white;
	top: 5%;
	left: 15%;
	width: 70%;
	height: 70%;
}

#mix .landscape + .pictoControls,
#mix .landscape + .animatecontrols {
	position: absolute;
	left: 15%;
	width: 70%;
	bottom: 25%;
}

#mix #maincanvas.portrait,
#mix #onionskin.portrait,
#mix #mainPictogramCanvas.portrait,
#mix .writewrapper.portrait,
#mix .branchwrapper.portrait,
#mix .chartwrapper.portrait {
	background-color: white;
	top: 15%;
	left: 0;
	width: 70%;
	height: 70%;
}

#mix .portrait + .pictoControls,
#mix .portrait + .animatecontrols {
	position: absolute;
	bottom: 15%;
	width: 70%;
}

#mix #maincanvas.whole,
#mix #onionskin.whole,
#mix #mainPictogramCanvas.whole,
#mix .writewrapper.whole,
#mix .branchwrapper.whole,
#mix .chartwrapper.whole {
	background-color: white;
	top: 5%;
	left: 5%;
	width: 90%;
	height: 90%;
}

#mix .whole + .pictoControls,
#mix .whole + .animatecontrols {
	position: absolute;
	left: 5%;
	bottom: 5%;
	width: 90%;
}

#mix canvas.square1,
#mix canvas.square2,
#mix canvas.square3,
#mix canvas.square4 {
	background-color: white;
}

#mix canvas.square1,
#mix .writewrapper.square1,
#mix .chartwrapper.square1 {
	top: 4%;
	left: 2%;
	width: 47%;
	height: 47%;
}

#mix canvas.square2,
#mix .writewrapper.square2,
#mix .chartwrapper.square2 {
	position: absolute;
	top: 4% !important;
	right: 2%;
	left: auto;
	width: 47%;
	height: 47%;
}

#mix canvas.square3,
#mix .writewrapper.square3,
#mix .chartwrapper.square3 {
	position: absolute;
	top: auto;
	bottom: 1%;
	left: 2% !important;
	width: 47%;
	height: 47%;
}

#mix canvas.square4,
#mix .writewrapper.square4,
#mix .chartwrapper.square4 {
	top: auto;
	right: 2%;
	bottom: 1%;
	left: auto;
	width: 47%;
	height: 47%;
}

#mix canvas.square1, #mix canvas.square2,
#mix canvas.square3, #mix canvas.square4 {
    position: absolute;
    border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

#mixLayoutDialog #whole,
#mixLayoutDialog #landscape,
#mixLayoutDialog #square,
#mixLayoutDialog #portrait {
	width: 260px;
	height: 150px;
	margin: 10px;
	display: inline-block;
	border: 1px solid #222222;
	vertical-align: middle;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	behavior: url(./e5/css3pie/PIE.htc);
	box-shadow: 2px 2px 5px #888888;
}

#mixLayoutDialog i.prev, #mixLayoutDialog i.next {
	font-size: 25px;
	position: absolute;
	color: white;
	z-index:1;
}

#mixLayoutDialog #whole.selected,
#mixLayoutDialog #landscape.selected,
#mixLayoutDialog #square.selected,
#mixLayoutDialog #portrait.selected {
	border: 5px solid #E80067;
	margin: 5px;
}

#mixLayoutDialog div.iconImg{
	background-color:#D1DF00;
	width:155px;
	height:85px;
	display:inline-block;
}

#mixLayoutDialog div.iconImg span{
	color:white;
	text-align: center;
	font-family: "Lexend", ABeeZee, sans-serif;
	top: 40px;
	left: 50px;
	position: relative;
}

#mixLayoutDialog #whole .iconImg {
	vertical-align: middle;
	width: 230px !important;
	margin: 10px 15px;
}

#mixLayoutDialog #landscape .iconImg, #mixLayoutDialog #portrait .iconImg {
	width: 155px !important;
}

#mixLayoutDialog #whole div.iconImg {
	height:126px;
}

#mixLayoutDialog #whole div.iconImg span{
	top: 50px;
	left: 80px
}

#mixLayoutDialog #whole.selected i {margin-top: 60px;}
#mixLayoutDialog #whole.selected i.prev {margin-left: 25px;}
#mixLayoutDialog #whole.selected i.next {margin-left: -45px;}

#mixLayoutDialog .writebox {
	border: 2px solid #D1DF00;
	text-align: center;
	margin: 10px;
	font-family: comicFont;
	padding: 6px;
	color: #555555;
}

#mixLayoutDialog #landscape .iconImg {margin:10px 50px 5px;}
#mixLayoutDialog #landscape .writebox {
	width: 230px;
	height: 23px;
	margin-top: 0px;
}
#mixLayoutDialog #landscape.selected i {margin-top: 40px;}
#mixLayoutDialog #landscape.selected i.prev {margin-left: 55px;}
#mixLayoutDialog #landscape.selected i.next {margin-left: -75px;}

#mixLayoutDialog #portrait .iconImg {
	vertical-align: middle;
	margin: 0px 13px;
}

#mixLayoutDialog #portrait .writebox {
	width: 50px;
	height: 112px;
	display: inline-block;
	vertical-align: middle;
	margin-left:0px;
}
#mixLayoutDialog #portrait i {margin-top:60px;}
#mixLayoutDialog #portrait i.prev {margin-left:25px;}
#mixLayoutDialog #portrait i.next {margin-left:-40px;}

/* Mix buttons on panel - new and open */

#mixButtonContainer {
	position: absolute;
	width: 100%;
	z-index: 2;
    pointer-events: none;
}

#mixButtonContainer.square1, #mixButtonContainer.square2,
#mixButtonContainer.square3, #mixButtonContainer.square4 {
	width: 50%;
	z-index: 100;
}

#mixButtonContainer.square2 {
	right: 0;
}

#mixButtonContainer.square3 {
	top: calc(50% - 15px);
	margin-top: 0px;
}

#mixButtonContainer.square4 {
    top: calc(50% - 15px);
	right: 0;
	margin-top: 0px;
}

#mixButtons, .blogButtons{
	margin: 0 auto;
	width: 70px;
    pointer-events: auto;
}

#mixButtons > div, .blogButtons > div{
	height: 30px;
	width: 30px;
	display: inline-block;
}

.blogButtons #goBlog.goTurtle {
  margin-left: 0px !important;
  margin-top: 0px !important;
  padding: 0px !important;
}

.blogButtons #goBlog.goTurtle > span {
  padding: 5px !important;
  padding-left: 6px !important;
  font-size: 0.5em !important;
 }

.mixLayoutDia .toolbarButton.tick, .mixLayoutDia .toolbarButton.tick.ui-state-hover {
	background-color: transparent !important;
	margin-right: 35px;
}

.mixLayoutDia .tickButton {
	height: 51px;
	width: 51px;
	background-position: -339px -1px;
	background-size: 614px 51px;
	background-color: transparent !important;
}

#mixButtons > .new {
	background-size: 455px 38px;
	margin-right: 10px;
}

#mixButtons > .load {
	background-position: -26px 0px;
	background-size: 383px 32px;
}

/* end Mix buttons on panel */

#square .writebox {
	width: 88px;
	height: 38px;
	display: inline-block;
	vertical-align: middle;
}
#square .iconImg {
	width: 110px !important;
	vertical-align: middle;
	margin: 10px 10px 0px 10px;
}

#square div.iconImg{
	height:60px;
}

#square div.iconImg span{
	top: 25px;
	left: 35px
}



#square > i {margin-top: 30px;}
#square > i.prev {margin-left: 15px;}
#square > i.next {margin-left: -35px;}

.j2text.landscape, .j2text.portrait,
.j2text.square1, .j2text.square2 {
	left: auto !important;
	top: auto !important;
	margin: 0;
}

#writework.portrait, .j2text.portrait {
	position: absolute;
	right: 0;
	width: 28%;
	height: 98%;
	margin:1%;
	-webkit-transform-origin:100% 0%;
	-moz-transform-origin:100% 0%;
	-o-transform-origin:100% 0%;
	-ms-transform-origin:100% 0%;
	transform-origin: 100% 0%;
}

#writework.landscape, .j2text.landscape {
	position: absolute;
	bottom: 0;
	width: 98%;
	height: 20%;
	margin:1%;
	-webkit-transform-origin:0% 100%;
	-moz-transform-origin:0% 100%;
	-o-transform-origin:0% 100%;
	-ms-transform-origin:0% 100%;
	transform-origin: 0% 100%;
}

#mix .writewrapper,
#mix .branchwrapper,
#mix .chartwrapper {
	position:absolute;
	background:white;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);

	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.j2text[wrapperId]{
	overflow-y: auto;
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	transform-origin: 0 0;
	padding-bottom: 1em;
	position:absolute;
}

#mix .toolbar.write button.fontsize span,
#mix .toolbar.write button.fontfamily span {color: white;}


#writework {
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	behavior: url(./e5/css3pie/PIE.htc);
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	background: white;
}

#mix .tempPage{
	top:0px;
	left:0px;
	position: absolute;
	width:100%;
	height:100%;
	background-color: #EFEAD5;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border: 2px;
	border-style: solid;
	border-color: #262626;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.animatingPages{
	background-color: transparent !important;
	border:none !important;
}

#mix .chartwrapper.landscape > .table > table {margin-top: 25%;}

#mix .chartwrapper.square1 .table,
#mix .chartwrapper.square2 .table,
#mix .chartwrapper.square3 .table,
#mix .chartwrapper.square4 .table {width:30%}
#mix .chartwrapper.square1 .table > table,
#mix .chartwrapper.square2 .table > table,
#mix .chartwrapper.square3 .table > table,
#mix .chartwrapper.square4 .table > table {margin-top:15%}


#mix .square1 .table .chartColourBox,
#mix .square2 .table .chartColourBox,
#mix .square3 .table .chartColourBox,
#mix .square4 .table .chartColourBox {border-left-width:15px;height:15px;}
/*
// Copyright Just2easy Limited 2014-15 all rights reserved.
*/

#bgprint {display: none;}

@media print
{
	ul.ui-tabs-nav,
	.ui-dialog,
	#tabsDropdown,
	#j2buttonBar,
	#buttonBarRight,
	.toolbar,
	.recorderButton,
	#pagesLabel,
	#addPage,
	#removePage,
	#prevPage,
	#nextPage,
	#speakwrite,
	#speaktext,
	#savepic,
	#savestamp,
	#savegif,
	.hideshowanimate,
	.animatecontrols,
	#mixButtonContainer,
	#qhistory,
	svg#dummy {
		display: none !important;
	}

    #content.panel {
        background-image: none ! important; /*we're adding the background images to the dom separately*/
    }

	#tabs .ui-tabs-panel,
	#tabs #titlebox,
	#mix #content {
		background: none;
	}

	#tabs {position: relative !important;} /* page-break-before do not work with absolutly positioned elements */

	#titlebox {box-shadow: none;}
	#title {
		float: none;
		padding: 5px;
		width: 100%;
		text-align: center;
		border: none;
		margin-top: -5px;
	}

	#content {
		left:0 !important;
		top: 35px !important;
		margin: auto;
		border: none;
	}

	#bgprint {
		position: absolute;
		display: block;
	}

	#content,
	#bgprint {
		width: 297mm;
		height: 210mm;
		width: 197mm !important;
		height: 150mm !important;
		/*this was relative and had no margin top*/
		position: absolute;
  		margin-top: 0px;
	}

	/*for mix*/
	.square1 #bgprint, .square2 #bgprint,
	.square3 #bgprint, .square4 #bgprint {
		width: 100% !important;
		height: 100% !important;
	}

	#mix .pictoControls {
		height:25px;
	}

	/* Write printing style to print all the text */
	.j2text {
		background-color: transparent !important;
		max-height: none !important
	}

	/* Turtle printing styles */
	#turtle #content {position: relative;}

	.toolbar.turtle {
		display:block !important;
		width: 650px; /*width of 4 instruction containers */
		top: 130px;
		position: relative;
	}

	.toolbar.turtle .switchModeSimple,
	.toolbar.turtle .switchModeAdvanced,
	.addTurtle,
	.homeTurtle,
	.clearTurtle,
	.goTurtle,
	.deleteTurtle,
	.deleteCommand,
	.turtleDragBox > div,
	.paint-icon {
		display:none;
	}

	.toolbar.turtle #instructionContainer {
		margin-top: 50px;
		width: 100%;
	}

	.toolbar.turtle .instruction {
		height:auto !important;
		margin-right:15px;
		margin-top: 40px;
		overflow: visible;
	}

	.toolbar.turtle .instructionImg {
		float: left;
		margin-top: -88px;
		margin-left: -126px;
	}

	.toolbar.turtle .instruction .ui-sortable {
		margin-top:10px;
	}

	/* Chart printing styles */
	.panel table,
	.panel table thead td {
		border:none !important;
	}
	.panel table td,
	.panel table tbody tr {border: thin solid #40aaf5 !important;}
	.panel .table .chartColourContainer {
		border: none !important;
		background-color: transparent;
	}

	.panel .table table {width:100% !important;}

	.panel .charts { margin-left: 30px;}

	/*for mix*/
	.square1 .charts, .square2 .charts,
	.square3 .charts, .square4 .charts {
		 margin-left: 0px;
	}

	/* Pictogram printing styles */
	#pictogramItems li {
		border: none;
		box-shadow: none;
	}


	#pictogramItems canvas,
	#pictogramItems .itemButtons,
	.pictoControls #addDelItems {
		display: none;
	}

	.pageWrapper {
		position: relative;
		width: 100%;
		height: 100%;
		page-break-before: always;
	}
	.page {
		display: block !important;
		left: 0 !important;
		opacity: 1 !important;
		border: none !important;
	}

	/* Branch printing styles */
	#branch #instruction,
	#branch #bucketButton,
	#branch svg .qedit,
	#branch svg .aedit {
		display: none;
	}

	.j2text.scrollable {
	    overflow-y: visible;
	}

	#mix.ui-tabs-panel .panel {position:relative;} /* page-break-before do not work with absolutly positioned elements */

	.chartDataTable {
		margin-top: 20px !important;
	}
}
body.compass .toolbar.turtle .homeTurtle,
body.compass .toolbar.turtle .addTurtle {
    display: none;
}

body.compass .toolbar.turtle .goTurtle {
    margin-left: 50px;
}

body.compass button.switchModeSimple,
body.compass .toolbar.turtle .goTurtle {
    float: none;
    display: block;
    position: relative;
    margin: 0;
    margin-left: 25px;
    margin-bottom: 4px;
    bottom: 165px;
}

body.compass .toolbar.turtle .clearTurtle {
	margin-left: 115px;
    bottom: -30px;
}
body.compass div#title {
	background-color: white;
    padding: 6px;
    text-align: center;
    font-weight: bold;
}