﻿@charset "utf-8";

#zeiss_tutorial 
{
    font-family:Arial, sans-serif;
    font-weight:bolder;
    color:white;

	width:550px;
	height:500px;
    margin:10px auto;
    box-shadow:3px 3px 5px #999999;
}
#zeiss_mainscene 
{
    position: absolute;
    background-color:#f0f0f0;
    opacity: 0;
}
.zeiss_title {
    position:absolute;
    top:18px;
    width:390px;
    text-align:center;
    font-size:22px;
    text-shadow:3px 3px 3px rgba(0,0,0,.5);
    z-index:1;
}
.window_label {
    position:absolute;
    font-size:12px;
    color:#003E77;
    text-shadow:1px 1px 2px rgba(0,0,0,.3);
    text-align: center;
}
.diagram_label {
    position: absolute;
    font-size:12px;
    text-shadow:1px 1px 3px rgba(0,0,0,.7);
    text-align: center;
}
.ctl_label {
	position:absolute;
	top:436px;
    font-size:13px;
    text-shadow:1px 1px 3px rgba(0,0,0,.7);
    text-align: center;
}
#mainContainer {
    position:absolute;
    left:5px;
    top:0px;
    width:351px;
    height:429px;
    overflow:hidden;
}
#mainCanvas {
    left:-5px;
    width:351px;
    height:429px;
}
#photodiodeCanvas {
    position:absolute;
    left:353px;
    top:35px;
    width:175px;
    height:175px;
}
#projectionContainer {
    position:absolute;
    left:353px;
    top:242px;
    width:175px;
    height:175px;
    overflow:hidden;
}
#projectionCanvas {
    width:175px;
    height:175px;
}
#pwrBtn {
    position:absolute;
    left:-43px;
    top: 370px;
    width:171px;
    height:171px;
    background:url(../images/power.png) 171px 0px;
    position:absolute;
    transform: scale(0.24, 0.24);
    -webkit-transform: scale(0.24, 0.24);
    -moz-transform: scale(0.24, 0.24);
    -ms-transform: scale(0.24, 0.24);
    -o-transform: scale(0.24, 0.24);
}
#pwrTxt {
    position:absolute;
    left:24.5px;
    top: 477px;
    font-size:12px;
    color:#24658E;
    text-shadow:1px 1px rgba(255,255,255,.5);
}
#lineCanvas1 {
    position:absolute;
    left:163px;
    top:100px;
    width:300px;
    height:20px;
    transform: rotate(-63deg);
    -ms-transform: rotate(-63deg);
    -webkit-transform: rotate(-63deg);
    -o-transform: rotate(-63deg);
    -moz-transform: rotate(-63deg);
}
#lineCanvas2 {
    position:absolute;
    left:250px;
    top:219px;
    width:300px;
    height:20px;
    transform: rotate(-8deg);
    -ms-transform: rotate(-8deg);
    -webkit-transform: rotate(-8deg);
    -o-transform: rotate(-8deg);
    -moz-transform: rotate(-8deg);
}
#windowLbl1 {
    left:351px;
    top:18px;
    width:179px;
}
#windowLbl2 {
    left:351px;
    top:225px;
    width:179px;
}
#sldrLbl1 {
    left:235px;
    width:140px;
}
#sldr1 {
	position:absolute;
	left:245px;
	top:456px;
	width:120px;
}
#sldrLbl2 {
    left:390px;
    width:140px;
}
#sldr2 {
    position:absolute;
    left:400px;
    top:456px;
    width:120px;
}
#btnLbl {
    left:80px;
    width:140px;
}
#btn {
	position:absolute;
	left:100px;
	top:455px;
    width:100px;
    height:30px;
}
.scale {
    position:absolute;
    transform: scale(0.5, 0.5);
    -webkit-transform: scale(0.5, 0.5);
    -moz-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    -o-transform: scale(0.5, 0.5);
}