/* Wave Adder styles */

/* ============== */
/* main container */
/* ============== */

#mainContainerDivId
{
}


.mainContainerDivClass
{
	position         : relative;
	width            : 800px;
	height           : 420px;
	color            : white;
	background-image : url('waveAdderAppBk.jpg');
}




/* =============== */
/* wave parameters */
/* =============== */

#amplitudeLabelSpanId
{
	top  : 10px;
	left : 10px;
}


#amplitudeValueTextId
{
	top  : 40px;
	left : 10px;
}


#frequencyLabelSpanId
{
	top  : 75px;
	left : 10px;
}


#frequencyValueTextId
{
	top  : 105px;
	left : 10px;
}


#phaseShiftLabelSpanId
{
	top  : 140px;
	left : 10px;
}


#phaseShiftValueTextId
{
	top  : 170px;
	left : 10px;
}


.parameterLabelSpanClass
{
	position : absolute;
	display  : inline-block;
	width    : 100px;
	height   : 20px;
	color    : yellow;
}


.parameterValueTextClass
{
	position : absolute;
	display  : inline-block;
	width    : 100px;
	height   : 20px;
	background-color : yellow;
}




/* ========================== */
/* sine, cosine radio buttons */
/* ========================== */

#sineWaveLabelId
{
	top  : 210px;
	left : 10px;
}


#cosineWaveLabelId
{
	top  : 240px;
	left : 10px;
}


.typeWaveLabelClass
{
	position : absolute;
	display  : inline-block;
	width    : 100px;
	height   : 20px;
	color    : yellow;
}




/* =============== */
/* command buttons */
/* =============== */

#drawButtonId
{
	top  : 275px;
	left : 10px;
}


#addButtonId
{
	top  : 310px;
	left : 10px;
}


#subtractButtonId
{
	top  : 345px;
	left : 10px;
}


#resetButtonId
{
	top  : 380px;
	left : 10px;
}


.commandButtonClass
{
	position : absolute;
	display  : inline-block;
	width    : 170px;
	height   : 30px;
}




/* ============== */
/* display canvas */
/* ============== */

#displayCanvasId
{
	background-color : black;
	top : 10px;
	left : 190px;
}


.displayCanvasClass
{
	position : absolute;
	display  : inline-block;
	width    : 600px;
	height   : 400px;
}