@charset "utf-8";

body {
	height: 610px;
	text-align: center;
}

.whiteWindow {
	position: relative;
	left: 15px;
	width: 440px; height: 440px;
}

.formulas {
	display: inline-block;
	position: relative;
	left: 65px;
	margin-top: 310px
}

.formulaText {
	display: inline-block;
	position: relative;
	margin-right: 130px;
}

.arrowVertLine {
	position: absolute;
	width: 1px; height: 11px;
	background-color: black;
}

.rightArrowVertLine {
	position: absolute;
	left: 5px;
	width: 1px; height: 11px;
	background-color: black;
}

.horizLine {
	position: absolute;
	height: 1px;
	background-color: black;
}

.controlBack {
	height: 90px;
}

.controlPanelBack {
	display: inline-block;
	width: 150px; height: 80px;
	margin-top: 5px;
	overflow: hidden;
	position: absolute;
	left: 160px;
}

.samplePanelLeft {
	left: 5px;
}

.samplePanelRight {
	left: 315px;
}

#lensCan {
	position: relative;
	top: 313px;
}

#lightBeamCan {
	position:absolute;
	left: 183px; top: 330px;
}

#blackLine {
	position: absolute;
	width: 350px; height: 2px;
	left: 55px; top: 306px;
	background-color: black;
}

#leftWaveContainer {
	position: absolute;
	width: 172px; height: 100px;
	left: 47px; top: 206px;
	overflow: hidden;
}

#leftWaveCan {
	position: absolute;
}

#rightWaveContainer {
	position: absolute;
	width: 190px; height: 100px;
	left: 219px; top: 206px;
	overflow: hidden;
}

#rightWaveCan {
	position: absolute;
}

#circlesContainer {
	position: absolute;
	left: 48px; top: 10px;
	width: 362px; height: 305px;
}

#leftCirclesMask {
	position: absolute;
	left: 0px; top: 0px;
	width: 172px; height: 305px;
	overflow: hidden;
}

#leftCircles {
	position: absolute;
	left: 0px; top: 16px;
	width: 169px; height: 169px;
}

#leftCirclesCan {
	position: absolute;
	left: 50px; top: -15px;
	width: 169px; height: 169px;
}

#rightCirclesMask {
	position: absolute;
	left: 171px; top: 0px;
	width: 175px; height: 305px;
	overflow: hidden;
}

#rightCircles {
	position: absolute;
	left: 0px; top: 16px;
	width: 169px; height: 169px;
}

#rightCirclesCan {
	position: absolute;
	left: 0px; top: -15px;
	width: 169px; height: 169px;
}

#radiusHorizLine {
	left: 144px; top: 74px;
	width: 20px;
}

#distanceHorizLine {
	left: 144px; top: 197px;
	width: 130px;
}

#radiusVertLine {
	position: absolute;
	left: 154px; top: 22px;
	width: 1px; height: 68px;
	background-color: black;
}

#topLeftArrow {
	position: absolute;
	left: 147px; top: 88px;
}

#topRightArrow {
	position: absolute;
	left: 160px; top: 88px;
}

#bottomLeftArrow {
	position: absolute;
	left: 164px; top: 192px;
}

#bottomRightArrow {
	position: absolute;
	left:288px; top: 192px;
}

#radiusLbl {
	position: absolute;
	left: 205px; top: 10px;
}

#patternsLbl {
	position: absolute;
	left: 290px; top: 160px;
}

#distanceLbl {
	position: relative;
	top: 110px;
}

#intensityLbl {
	position: absolute;
	left: 55px; top: 260px;
}

#illuminationLbl {
	position: relative;
	top: 305px;
}

#sparrowLbl {
	position: absolute;
	left: 90px; top: 207px;
}

#rayleighLbl {
	position: absolute;
	left: 270px; top: 207px;
}

#wavelengthSlider {
	display: inline-block;
	position: relative;	
	width: 136px;
	margin-top: 5px;
}

#distanceSlider {
	display: inline-block;
	position: relative;	
	width: 136px;
	margin-top: 5px;
}

#apertureSlider {
	display: inline-block;
	position: relative;	
	width: 136px;
	margin-top: 5px;
}