.ioty-circuit-loader {
	position : absolute;
	left : 400px;
	top : 130px;
}

.IoTyLabCircuitView {
	padding-left : 0px;
	padding-right : 0px;
	margin-left : 0px;
	margin-right: 0px;
}

.componentList {
	padding-top : 20px;
}

.IoTyVLInstructions{
  .currentLevel-Instructions {
    padding: 20px;
    font-family: 'Roboto Slab Regular';
    font-size: 15px;
    min-height : 200px;
  }
}

.IoTyVLOutput {
	padding: 20px;
    font-family: 'Roboto Slab Regular';
    font-size: 15px;
    min-height : 200px;
}

#IoTyLabCodeCircuitView {
	min-height : 275px;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

.IoTyVLabComponentSlider {
	margin-left : 0px;
	margin-right: 0px;
}

.IoTyVLabCodeEditor {
	margin-left : 0px;
	margin-right: 0px;
}

.IoTyVLabComponentImage {
	margin-left : 40px;
	padding-top : 20px;
	width : 140px;
	height : 150px;
	cursor : pointer;
	border-radius : 10px;
}

.IoTyVLabComponentImage:hover {
	border : 1px solid rgb(26, 49, 65);
	box-shadow : 1px 1px 1px rgb(26, 49, 65);
}

.selectedIoTyVLabComponent {
	border : 2px solid rgb(255, 111, 0);
}

.disabled {
	opacity : 0.3;
	background-color : #CCC;
	pointer-events : none;
}

.disableArrow {
	opacity : 0.3;
	pointer-events : none;
}

.IoTyVLabComponentName {
	color : rgb(26, 49, 65);
	font-weight : bold;
}

#svgPanel {
	background-color : #f2f2f2;
	min-height : 700px;
	min-width : 1130px;
}

.breadBoardConnectionPoint:hover {
	fill:red;
	stroke:black;
	stroke-width:1px;
}

.arduinoConnectionPoint:hover {
	fill:green;
	stroke:black;
	stroke-width:1px;
}

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

.blink {
    -webkit-animation: blink 500ms infinite alternate;
    -moz-animation: blink 500ms infinite alternate;
    -o-animation: blink 500ms infinite alternate;
    animation: blink 500ms infinite alternate;
}
@-webkit-keyframes blink {
	from { opacity:1.5; }
	to { opacity:0.1; }
}
@-o-keyframes blink {
	from { opacity:1.5; }
	to { opacity:0.1; }
}
@-moz-keyframes blink {
	from { opacity:1.5; }
	to { opacity:0.1; }
}
@keyframes blink {
	from { opacity:1.5; }
	to { opacity:0.1; }
};

.breadBoardComponent {
	position : absolute;
	user-drag: none; 
	user-select: none;
	-moz-user-select: none;
	-webkit-user-drag: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

.circuitSuccess {
	color: green;
	padding: 10px;
	font-weight : bold;
	font-family: 'Roboto Slab Regular';
	font-size: 15px;
}

.circuitError {
	color : red;
	padding: 20px;
	font-weight : bold;
	font-family: 'Roboto Slab Regular';
	font-size: 15px;
}


.IoTyVLabAceEditorComponent {
	.ace_scroller {
		pointer-events : none;
	}
	.ace_gutter-layer  {
		pointer-events : none;
	}
	.ace_scrollbar-v {
		pointer-events : all;
	}
}

.codeOptions {
	padding-left : 0px;
}

.SerialMonitor__stdout {
	background-color: black;
    color: green;
	overflow-y: scroll;
    padding: 8px;
    font-size: 12px;
    font-family: 'monospace';
    min-height : 120px;
    max-height : 120px;
	white-space: pre-wrap;      /* CSS3 */   
	white-space: -moz-pre-wrap; /* Firefox */    
	white-space: -pre-wrap;     /* Opera <7 */   
	white-space: -o-pre-wrap;   /* Opera 7 */    
	word-wrap: break-word;      /* IE */
}

.IoTyBrowswer {
	.browswerAdressBar {
		width : 85%;
	}
	.BrowserContentView {
		min-height : 100px;
		max-height : 100px;
		max-width : 305px;
		background-color : #FFF;
		font-size: 12px;
		padding: 8px;
	    font-family: 'monospace';
	}
	margin-top: 10px;
	border : 1px solid #CCC;
}

.IoTyVLabOutputOptions {
	cursor : pointer;
}

#showLoadingBeforeOutput {
	padding: 10px;
	font-size : 12px;
	font-weight : bold;
	font-family: 'Roboto Slab Regular';
}