.sbPage, .sbDrawer, .sbPageHolder, .sbDrawerHolder, .sbTrashBin, .sbCopyPasteBar, .sbContext, .sbPickerOptions {
	/* Disable default HTML text selection */
	-moz-user-select: -moz-none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	user-select: none;

	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;

	margin: 0px;
	padding: 0px;

	font-family: 'Open Sans', 'sans-serif';
	font-size: 15px;
}

/*
These styles were installed via installStyles prior to 11/2017
Moved them from blockView.js to scriptBlocks.css
*/

/* warning - do not change these variables without changing the corresponding variables in BlockView.js */
:root {
	--minHeight: 16px;
	--fontSize: 14px;
	--lineHeight: 1.3;
	--fontFamily: "Arial";
	--hNotchHeight: 5px;
	--barHeight: 8px;
}

.sbBlock {
	position: relative;
	vertical-align: middle;
	display: block;
	height: auto;
	width: auto;
	min-width: 28px;
	min-height: var(--minHeight);
	padding: 0px;
	text-align: left;
	margin: 0px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-family: var(--fontFamily);
	font-size: var(--fontSize);
	line-height: var(--lineHeight);
}

.sbBlockElement {
	pointer-events: none;
}

.sbBlockLine, .sbInternalInput, .sbButton, .sbList, .sbBottomBlockLine {
	pointer-events: all;
}


.sbAfterSocket {
	min-height: var(--hNotchHeight);
	width: auto;
	height: auto;
	display: inline-block;
	min-width: 26px;
	float: left;
	clear:both;
}

.sbAfterSocket > .sbBlockElement {
	margin-top: -1px !important;
}

.sbReturnBlock {
	padding-left: 10px;
}

.sbBlockLine {
	padding: 1px 7px;
	margin: 0px;
	white-space: nowrap;
	width: auto;
	display: inline-block;
}

.sbBlockLine > * {
	vertical-align: middle;
	margin: 0px 0px 0px 5px;
}

.sbBlockLine > div:first-child {
	margin-left: 0px;
}

.sbBlockLine > input:first-child {
	margin-left: 0px;
}

.sbTopBlockLine {
	padding-top: 3px;
}

.sbTopBlock > .sbTopBlockLine:first-child {
	padding-top: 5px;
}

.sbBeforeConBlock > .sbTopBlockLine:first-child {
	padding-top: 5px;
}

.sbBottomBlockLine {
	clear: both;
	padding-bottom: 3px;
}

.sbLabel {
	white-space: nowrap;
	cursor: default;
	display: inline;
	padding: 0px;
	line-height: var(--lineHeight);
}

.sbEditableLabel {
	display: inline-block;
	background-color: transparent;
	border: none;
	width: 80px;
	padding: 1px;
	font-family: var(--fontFamily);
	font-size: var(--fontSize);
	line-height: var(--lineHeight);
}

.sbEditableLabel:hover {
	border: 1px dashed #FFF;
	padding: 0px;
}
	
sbEditableLabel:focus {
	background-color: #FFF;
	border: 1px dashed #999;
	padding: 0px;
	-moz-user-select: text;
}

.sbSocket {
	position: relative;
	height: auto;
}

.sbInternal {
	display: inline-block;
	padding: 0px 2px 0px 0px;
	margin: 0px 0px 0px 3px;
}
	
.sbInternalInput {
	vertical-align: top;
	background-color: transparent;
	border: none;
	margin: 0px 0px 0px 10px;
	padding: 0px 2px 0px 2px;
	min-width: 20px;
	font-family: var(--fontFamily);
	font-size: var(--fontSize);
	line-height: var(--lineHeight);
}
.sbInternalInput::placeholder {
    font-style: italic;
}

.sbList {
	display: inline-block;
	padding: 0px;
	line-height: var(--lineHeight);
}


.sbList select {
	font-family: var(--fontFamily);
	font-size: var(--fontSize);
	line-height: var(--lineHeight);
}

.sbHilight {
	box-shadow: inset 0 0 2em gold;
}

.sbNested {
	display: inline-block;
	border: 0px;
	padding: 0px;
	height: auto;
	width: 26px;
	vertical-align: top;
	min-height: var(--minHeight);
}

/* Sets the height of the bar that comes after a nested socket */
.sbAfterBar {
	display: block;
	height: var(--barHeight);	
}

/* Sets the height of the bottom of the C bar that comes after a nested socket, 
	to make the height of the bottom bar match the height of internal afterBars,
	add more height since some of the height in an afterBar is the top padding in the block line around the nested socket after it	
*/
.sbBottomBlockLine.sbAfterBar {
	height: calc(var(--barHeight) + 2px);	
}

.sbEdge {
	display: inline-block;
	border: 0px;
	padding: 0px;
	height: auto;
	margin: -1px 0px 0px 0px;
	vertical-align: top;
	width: 10px; /* sb.BlockView.notchWidth + 1*/
	min-height: 11px;
}

/*
END OF PREVIOUSLY INSTALLED STYLES
*/

.sbUnselectable {
	/* Disable default HTML text selection */
	-moz-user-select: -moz-none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

.sbPageHolder {
	position: relative;
	border: 1px solid #BBB;
	padding: 0px;
	margin: 0px;
	overflow: auto;
	float:left;
}

.sbDrawerHolder {
	position: absolute;
	width: 200px;
	top: 0px;
	left: 0px; /* auto !important; //this fixes a problem with jQuery resizable on Safari in TaleBlazer */
	min-width: 100px;
	margin: 0px 5px 0px 0px;
	height: 100%;
	background-color: #BBB;
}

.sbDrawerHolder.ui-resizable {
	position: absolute;
}

.sbDrawer:last-child {
	min-height: 110%;
}

.sbDrawers {
	padding-top: 30px; /* leave room for the drawerPicker at the top */
	overflow: auto;
	height: 100%;
	box-sizing: border-box;
}

.sbPage {
	position: absolute;
	overflow: hidden;
	background-color: #FFF;
	padding:5px;
}

.sbDrawer {
	position: relative;
	padding: 5px 0px 10px 5px;
	overflow: hidden;
}

.sbDrawerCTA {
	display: none;
	visibility: hidden;
	color: #000;
	text-shadow: none;
}

.sbDrawerCTA:only-child {
	display: initial;
	visibility: visible;
}

.sbDrawerCTA p {
	margin-top: 1rem;
}

.sbCopyBtn {
	background-image: url('img/copy.png');
	background-position: center 0px;
	background-repeat: no-repeat;
	background-size: 22px 22px;
	cursor: pointer;
	height: 22px;

}

.sbBtnWrapper {
	display: inline-block;
	margin: 0px 6px 6px 6px;
	padding: 2px;
	color: black;
	background-color: white;
}

.sbBtnWrapper:hover {
	color: #124d77;
}

.sbBtnWrapper:hover{
	-ms-transition: background 0.3s ease;
	-moz-transition: background 0.3s ease;
	-webkit-transition: background 0.3s ease;
	transition: background 0.3s ease;
	background-color: #DDD;
}


.sbCopyBtnWrapper:active .sbCopyBtn{
	background-image: url('img/copy_blue.png');
	background-position: center 0px;
	background-repeat: no-repeat;
	background-size: 22px 22px;
	cursor: pointer;
	height: 22px;
	background-position: center 1px;
}

.sbBtnText {
	text-align: center;
	font-size: smaller;
	width: 30px;
	cursor: pointer;

}

.sbCutBtn {
	background-image:url('img/cut.png');
	background-position: center 0px;
	background-repeat: no-repeat;
	background-size: 22px 22px;
	cursor: pointer;
	height: 22px;
}

.sbCutBtnWrapper:active .sbCutBtn{
	background-image: url('img/cut_blue.png');
	background-position: center 0px;
	background-repeat: no-repeat;
	background-size: 22px 22px;
	cursor: pointer;
	height: 22px;
	background-position: center 1px;
}

.sbPasteBtn {
	background-image:url('img/paste.png');
	background-position: center 0px;
	background-repeat: no-repeat;
	background-size: 22px 22px;
	cursor: pointer;
	height: 22px;
}

.sbPasteBtnWrapper:active .sbPasteBtn{
	background-image: url('img/paste_blue.png');
	background-position: center 0px;
	background-repeat: no-repeat;
	background-size: 22px 22px;
	cursor: pointer;
	height: 22px;
	background-position: center 1px;
}

.sbToolBar {
	height: auto;
	/* top: 31px;  this value is based on the auto height of the tab bar */
	right: 1px;
	/* min-width: 400px; */
	position: absolute;
	z-index: 100;
}

.sbTrashBin {
	background-image:url('img/trash.png');
	background-position: 10px 5px;
	background-size: 28px 32px;
	background-repeat: no-repeat;
	cursor: arrow;
	background-color: inherit;
	font-size: 13px;
	width: 100px;
	height: 50px;
	position: absolute;
	top: 0px;
	right: 0px;
	border: 3px dashed #333;
	text-align: center;
	background-color: #DDD;
	margin-left: 5px;
	padding-top: 3px;
	padding-left: 30px;
}

.sbSticky.sbFixed {
	position: fixed !important;
	height: auto;
}

.sbTrashBinOpen {
	background-color: #E8ACAF;
	border: 3px dashed #F22260;
	/*-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all 0.3s ease;*/
}

.sbCopyPasteBar {
	position: absolute;
	top: 8px;
	right: 100px;
	margin-right: 15px;
	/*-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all 0.3s ease;*/
}

.sbSelection {
	position: absolute;
	border: 2px dashed #9C6;
}


.sbPageTab.goog-tab {
  background: #ddd;
  border: 1px solid #CCC;
  color: black;
  cursor: default;
  padding: 5px 8px;
  position: relative;
  text-decoration: none;
  z-index: 1;
  display:inline-block;
}

/* State: Hover */
.sbPageTab.goog-tab-hover {
  background: #eee;
}

/* State: Disabled */
.sbPageTab.goog-tab-disabled {
  background: #ccc;
  border-color: #ccc;
  color: #fff;
}
/* State: Selected */
.sbPageTab.goog-tab-selected {
  background: #fff !important; /* Selected trumps hover. */
}

.sbPageTabBar {
	display: block;
}

.sbPageTabBar.goog-tab-bar-top {
	height: auto;
	background-color: transparent;
	border-bottom: none !important;
	padding-top: 0px !important;
	position: relative;
}

.sbPageTabBar.goog-tab-bar-top .goog-tab-selected {
	top: 3px;
	border-bottom: none !important;
}

.sbHidden {
	display: none;
}

.sbContext {
	position: absolute;
	cursor:default;
	z-index: 99;
	height: auto;
	width: auto;
}

.sbContext ul{
	padding: 0px 0px 0px 0px;
 	border-radius: 5px;
	border: 1px solid grey;
	box-shadow: 2px 2px 2px #888888;
	overflow:hidden;
	margin: 0px;
}

.sbContext li{
	display: block;
	padding: 5px 10px;
	text-decoration: none;
	color: black;
	background: #F3F3F3;
	border-bottom: 1px solid grey;
	font-family: 'Arial';
	font-size: 12px;
	white-space: nowrap;
}

.sbContext li:hover {
	background: #1a85ff;
	color: #FFF;
}

.sbContext div{
	display: block;
	position: absolute;
}

.sbContext li.disabled{
	color: gray;
	background:#F3F3F3;
}

.sbContext li.disabled:hover {
	border:0px;
	background:#F3F3F3;
}

.sbPicker,.sbPickerOptions {
	background: #F3F3F3;
	cursor: pointer;
}

.sbPickerLabel {
	display: inline-block;
}

.sbPicker {
	position: absolute;
	top: 0px;
	left:0px;
	width: 100% !important;
	box-sizing: border-box;
	vertical-align: middle;
	z-index: 1;
	padding: 3px 10px;
	font-size: 14px;
	font-weight: bold;
	border-radius: 0px;
	border: 1px #BBB solid;
	border-bottom-color: white;
}

.sbPickerOptions {
	height: 0px;
	box-sizing: content-box;
	overflow-y: hidden;
	box-shadow: 0px 0px 10px #888888;
	position: fixed;
	z-index: 2000 !important;
	box-sizing:border-box;
	-webkit-transition: height .5s;
	-moz-transition: height .5s;
	-ms-transition: height .5s;
	-o-transition: height .5s;
	transition: height .5s;
}

.sbPickerOptions::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 7px;
}

.sbPickerOptions::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: rgba(0,0,0,.5);
}

.sbPickerOptions ul{
	display: block;
	padding: 0px;
	overflow:hidden;
	margin: 0px;
}

.sbPickerOptions li{
	display: block;
	padding: 5px 10px;
	border-bottom: 1px solid grey;
	white-space: nowrap;
}

.sbPickerOptions li:hover {
	position: relative;
}

.sbPicker:hover .sbPickerLabel, .sbPickerOptions li:hover .sbOptionText{
	position: absolute;
	top: 1px;
	left: 10px;
	font-size: 120%;
	font-weight: bolder;
}

.sbPickerOptions li:hover .sbOptionText{
	left: 30px;
	top: 3px;
}

.sbOptionText {
	display: inline-block;
	pointer-events: none;
}

.sbExpanded.sbPickerOptions {
	visibility: inherit;
	overflow-y: auto;
 	border-radius: 5px;
	border: 1px solid grey;
}

.sbExpanded.sbBelow {
	border-top: none;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}

.sbExpanded.sbAbove {
	border-bottom: none;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;
}

.sbCaret {
	float: right;
	display: inline-block;
}

.sbCaret:before {
	content: '\25BE';
}

.sbExpanded .sbCaret:before {
	content: '\25B4';
}

.sbCheckmark {
	display: inline-block;
	margin-right: 10px;
	pointer-events: none;
	visibility: hidden;
}

.sbChecked .sbCheckmark {
	visibility: inherit;
}

/* Optimization for block dragging performance */
body.sb-dragging .sbBlock {
	pointer-events: none;
}

body.sb-dragging .sbBlock * {
	pointer-events: none;
}