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

html, body{ height:100%; background-image: url(../img/coolpattern.gif); font-family: 'Roboto Condensed', sans-serif; font-weight:400; font-style:normal; line-height:normal;
	margin: 0;
	padding: 0;
	}

body{ background:url(../img/coolpattern.gif); font-size:14pt; line-height:18pt; }

#header {
	background-image:url(../img/coolpattern.gif);
	height: 150px;
}

#header p {
	color: #333;
	padding-left: 20px;
}

#container {
	background-image: url(../img/witewall_tan.gif);
	width: 960px;
	margin: 0 auto;
	margin-bottom: 235px;
	/* border-style: solid; */
	/* border-width: 1px; */
	/* border-color: black; */
	}
a{
	color: #336666;
	-webkit-transition: color 1000ms ease;
	-moz-transition: color 500ms ease;
	-ms-transition: color 500ms ease;
	-o-transition: color 500ms ease;
	transition: color 500ms ease;
}

a:hover{
	color: #66CC99;
}

a{ text-decoration:none; border:none; padding:0; outline:none; }

.a {color:#336699;}


/*############ Navigation bar #####################*/
ul {
	margin: 0;
	padding: 0;
	list-style: none;
	/*background-image:url(../img/coolpattern_aqua.gif);*/
	}
#nav > ul {
	background-image:url(../img/coolpattern_aqua.gif);
	border-top: 1px solid #000;
}

ul li {
	position: relative;
	float: left;
	height: 20px;
	width: 192px;
	margin: 0;
	padding: 3px 0;
	border-bottom: 1px solid #000;
	background-image: url(../img/coolpattern_aqua.gif);
	}
	
li ul {
	position: absolute;
	left: -3px;
	top: 27px;
	display: none;
	z-index: 10;
	border-right: 1px solid #000;
	border-left: 1px solid #000;
	}
li ul#lessonlist li {
	width: 250px;
}
ul li a:link, ul li a:visited {
	display: block;
	height: 100%;
	text-decoration: none;
	color: #CCC;
	padding: 0px;
	margin: 0px;
	text-align: center;
}

ul li a:hover, ul li a:active {
	color:#366;
	text-decoration: underline;
}

li:hover ul { display: block; }

/*############ maincontent area #####################*/
#maincontent {
	padding: 20px;
	margin: 0 auto;
	height: auto;
}
.showmeContainer {
	width: 940px;
	padding: 0px 0px 10px 20px;
	height: 220px;
	overflow: scroll;
	bottom: 0;
	position: fixed;
	background-image: url(../img/coolpattern_aqua.gif);
	border-top: 3px solid #104E47;
}
#leftpanel {
	/* width: 435px; */
	float: left;
	margin: 0px 0px 10px 0px;
	padding: 0;
}
#rightpanel {
	width: 537px;
	height: 158px;
	float: left;
	margin: 0px 0px 0px 10px;
	padding: 0;
	background-color: #FFF;
	overflow: scroll;
}
#showHTMLiframe {
	width:100%;
	height: 137px;
	overflow: scroll;
}
textarea {
	margin-bottom: 15px;
}
.example {
	width:960px;
	height:auto;
	padding:0;
}
#groupOne {
	background-color: #366;
	margin: 0px 0px 28px 0px;
	color: #FFF;
	width: 878px;
	height: auto;
	overflow: auto;
	/* float: left; */
	border:1px inset #FFF;
	padding: 0px 20px 0px 20px;
}
#groupOne pre {
	color:#FFF;
	font-size: 11pt;
}
#groupTwo {
	style="font-size:9px;
	background-image:url(../img/witewall_off_tan.gif);
	color:#FFF;
	border: 1px inset #366;
	width: 526px;
	height: 313px;
	padding: 10px 10px 0px 10px;
	overflow:auto;
	/* float:left; */

}
#syntaxF1 {
}
pre {
	color: #066;
}
fStructure {
	padding:5px 20px 5px 20px;
	width:100%;
	height:100%;
	font-size:12px;
	color:#333;
}
#fStable1 {
	color:#699;
}
#fStable2 {
	color:#F96;
}
#fStable3 {
	color:#699;
}
#fStable4 {
	color:#F96;
}
#fStable5 {
	color:#699;
}
#fStable6 {
	color:#F96;
}
#fStable7 {
	color:#699;
}

#pictureBoxExample {
	width:100%;
	height:100%;
}

p.pictureText {
	padding: 0px 61px 50px 13px;
	width: 500px;
	height: 299px;
	float: left;
}

#pictureBoxExample2 {
	width:100%;
	height:100%;
}

p.pictureText2 {
	padding: 0px 61px 50px 13px;
	width: 100%;
	height: auto;
	float: left;
}
iframe {
	width: 100%;
	height: 300px;
}
#boxModelContainer {
	width: 800px;
	height:auto;
}
#boxModelContainer a img {
}
#creditsBlock {
	margin:0 auto;
	padding:20px;
	width:700px;
	height:auto;
	background-image:url(lib/img/witewall_off_tan.gif);
	border:1px inset #366;
}
.tableContainer {
	/* margin:0 auto; */
	/* padding:20px; */
	/* width:920px; */
	/* height:auto; */
	background-image: url(../img/witewall_off_tan.gif);
	border: 1px inset #FFF;
}
#tableCont1 {
	margin-right:20px;
	padding:5px;
	width: 906px;
	/* height:500px; */
	/* float:left; */
}
#tableCont2 {
	padding:5px;
	width: 338px;
	height:500px;
	/* float:left; */
	/* margin: 5px; */
}

/*############ Quiz ###########################*/
.quiz {
	background-image:url(lib/img/witewall_off_tan.gif);
	max-width:100%;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 50px;
}
div.question {
	position: relative;
	margin-bottom: 5px;
	padding-bottom: 10px;
}
.answer {
	position: absolute;
	padding-bottom: 5px;
	top: 0;
	left: 400px;
	color: #066;
}
p .answer {
	margin-bottom:10px;
}
p img {
	width:50%;
	height:auto;
}

p img {
	width:50%;
	height:auto;
}

/*############ Fototer Menu ###################*/

.menubody ul {float:left; margin:0; padding-left:10px; list-style-type:none;}

.menuhead li {float:left;}

/*############ Footer bar #####################*/
#footer {clear:both;}

#footer p {
	width: 400px;
	margin: 0 auto 20px;
	}
#footer p a {
	color: #777;
	text-decoration: underline;
}

.footerlinks {
	padding-left: 50px;
}