@charset "utf-8";
/* CSS Document */

#ui_container1
{
	height: 100px;
	width: 260px;
	position:absolute;
	top: 420px;
	left: 640px;
	background-color: #F4EAF4;
    border: 1px solid #999999
}

#ui_container2
{
	height: 100px;
	width: 260px;
	position:absolute;
	top: 420px;
	left: 370px;
	background-color: #F4EAF4;
    border: 1px solid #999999
}

#anim_background
{
	height: 100px;
	width: 880px;
	position:absolute;
	top: 300px;
	left: 20px;
}
#anim_container
{
	height: 100px;
	width: 880px;
	position:absolute;
	top: 300px;
	left: 20px;
}

.item
{
	position:absolute;
	width:60px;
	height:60px;
	background-image:url("../assets/engine1.png");	
	background-size:100%;
	background-repeat:no-repeat;
	background-position:center;
}

.queue_item
{
	position:absolute;
	width:60px;
	height:60px;
	/*background-image:url("../assets/engine2.png");*/
	background-image:url("../assets/engine1.png");	
	background-size:100%;
	background-repeat:no-repeat;
	background-position:center;
}

#queue0
{
	position:absolute;
	left:210px;
}

.item_target
{ 
	position:absolute;
	height:60px;
	width:60px;
	top:20px;
	-moz-border-radius: 8px; 
	border-radius: 8px;
	/*background-color:#81a1b6;*/
	background-color:#FFFFFF;
	/*border:thick #960 solid;*/
}

#item0_target{ position:absolute; left:110px; }
#item1_target{ position:absolute; left:410px; }
#item2_target{ position:absolute; left:710px; }

#queue0_item0{ position:absolute; left:120px; }
#queue0_item1{ position:absolute; left:80px; }
#queue0_item2{ position:absolute; left:40px; }
#queue0_item3{ position:absolute; left:0px; }

#queue1
{
	position:absolute;
	left:510px;

}

#queue1_item0{ position:absolute; left:120px; }
#queue1_item1{ position:absolute; left:80px; }
#queue1_item2{ position:absolute; left:40px; }
#queue1_item3{ position:absolute; left:0px; }

#queue2
{
	position:absolute;
	left:710px;
}
#queue2_item0{ position:absolute; left:0px; }

#speed_slider_container
{
	height: 100px;
	width: 340px;
	position:absolute;
	top: 420px;
	left: 20px;
}

.workstation_container
{
	height: 120px;
	width: 280px;
	position:absolute;
	top: 170px;
	/*background-image:url("../assets/worker.png");
	background-image:url(file:../assets/worker.png);
	background-size:40%;*/
	background-repeat:no-repeat;
	background-position:center;
}

.workstation_title
{
	position:absolute;
	width:100%;
	text-align:center;
	top: 0px;
	font-size:13px;
	color:#666;
	font-weight:bold;
}

.workstation_status
{
	position:absolute;
	height:125px;
	width:100px;
	bottom:-110px;
	left:90px;
	-moz-border-top-left-radius: 8px; 
	border-top-left-radius: 8px;
	-moz-border-top-right-radius: 8px; 
	border-top-right-radius: 8px;
	/*background-color:#81a1b6;*/
	background-color:#FF0000;
	text-align:center;
	font-size:15px;
	font-weight:bold;
	color:#FFFFFF;
	padding-top:5px;
}

#workstation1_container
{
	left: 20px;
	background-image:url("../assets/worker1_working.png");
}
#workstation1_containerStarved
{
	left: 20px;
	background-image:url("../assets/worker1_starved.png");
}
#workstation1_containerWork
{
	left: 20px;
	background-image:url("../assets/worker1_working.png");
}

#workstation1_containerBlocked
{
	left: 20px;
	background-image:url("../assets/worker1_blocked.png");
}

#workstation2_container
{
	left: 320px;
	background-image:url("../assets/worker2_working.png");
}

#workstation2_containerStarved
{
	left: 320px;
	background-image:url("../assets/worker2_starved.png");
}

#workstation2_containerWork
{
	left: 320px;
	background-image:url("../assets/worker2_working.png");
}


#workstation2_containerBlocked
{
	left: 320px;
	background-image:url("../assets/worker2_blocked.png");
}


#workstation3_container
{
	left: 620px;
	background-image:url("../assets/worker3_working.png");
}

#workstation3_containerStarved
{
	left: 620px;
	background-image:url("../assets/worker3_starved.png");
}

#workstation3_containerWork
{
	left: 620px;
	background-image:url("../assets/worker3_working.png");
}

#workstation3_containerBlocked
{
	left: 620px;
	background-image:url("../assets/worker3_blocked.png");
}


.control_container
{
	height: 120px;
	width: 280px;
	position:absolute;
	top: 40px;
}

#control1_container
{
	left: 20px;
}

#control2_container
{
	left: 320px;
}

#control3_container
{
	left: 620px;
}

.slider_title
{
	width: 100%;
	height: 30px;
	top:0px;
	position:absolute;
	padding-top:5px;
	font-size:13px;
	text-align:center;
	background-color:#DDD;
	border: solid #999 1px;
	color:#666;
	font-weight:bold;
}

.control_title
{
	width: 100%;
	height: 30px;
	top:20px;
	position:absolute;
	padding-top:5px;
	font-size:13px;
	text-align:center;
	background-color:#DDD;
	border: solid #999 1px;
	color:#666;
	font-weight:bold;
}

.slider_holder
{
	width: 100%;
	height: 70px;
	position:absolute;
	left:0px;
	top:30px;
	background-color:#EAF4FF;
	border: solid #999 1px;
}

.control_holder
{
	width: 100%;
	height: 70px;
	position:absolute;
	left:0px;
	top:50px;
	background-color:#EAF4FF;
	border: solid #999 1px;
}

.control_slider
{
	width: 240px;
	/*height: 80px;
	width:80%;*/
	position:absolute;
	left:20px;
	top:30px;
	/*background-color:#EAF4FF;
	border: solid #999 1px;*/
}

#speed_slider
{
	/*overflow:hidden;*/
	margin:auto;
	position:absolute;
	top:35px;
	left:20px;
	width:300px;
}
#row1
{
	position:absolute;
	left: 0px;
	top:0px;
	height:100%;
	width:100%;
}
#row2
{
	position:absolute;
	left: 0px;
	top:0px;
	height:100%;
	width:100%;
}

.col1
{
	position:absolute;
	left: 0px;
	top: 15px;
	width: 260px;
	height: 100%;
	text-align:center;
	font-size:15px;
	color:#000000;
	/*font-weight:bold;*/
}
.col2
{
	position:absolute;
	left: 50px;
	top: 15px;
	width: 130px;
}

#output_text1
{
	margin-top:5px;
	margin-left:10px;
}

#output_text2
{
	margin-top:10px;
	margin-left:10px;
}


.img_btn
{  
	display:block; 
	border:0px; 
	cursor:pointer;
	overflow:hidden;
}  
.img_btn_disabled
{  
	-moz-opacity: 0.5;
	-webkit-opacity: 0.5;
	opacity: 0.5;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity = 50);
	cursor:auto;
}  

.start_btn 
{  
	width:157px;  
	height:69px; 
	background-image:url("../assets/start_button.png");
	background-position: 0px 0px; 
}  
.start_btn.startHoverAction
{  
	background-position: 0px -69px; 
	background-position-y: -69px; 
} 
 
.stop_btn 
{  
	width:157px;  
	height:69px; 
	background-image:url("../assets/stop_button.png");
	background-position: 0px 0px; 
}  
.stop_btn.stopHoverAction
{  
	background-position: 0px -69px; 
	background-position-y: -69px; 
}