body {
	margin: 30px;
	background: #202020;
}
#page_container {
	border: 1px solid #fff;
	position:relative;
	margin: 0 auto;
	width: 1000px;
	height: 500px;
	background: url(../images/bg.png);
}
.panel_button {
	margin-left: auto;
	margin-right: auto;
	position: relative;
	width: 96px;
	height: 23px;
	background: url(../images/panel_button.png);
	z-index: 20;
	cursor: pointer;
}
.panel_button img {
	position: relative;
	top: -2px;
	border: none;
}
.panel_button a {
	text-decoration: none;
	color: #545454;
	font-size: 20px;
	font-weight: bold;
	position: relative;
	top: 5px;
	left: 10px;
	font-family: Arial, Helvetica, sans-serif;
}
.panel_button a:hover {
	color: #999999;
}
#toppanel {
	position: absolute;
	width: 1000px;
	left: 0px;
	z-index: 25;
	text-align: center;

}
#panel {
	width: 1000px;
	position: relative;
	height: 0px;
	margin-left: auto;
	margin-right: auto;
	z-index: 10;
	overflow: hidden;
	text-align: left;
}
#panel_contents {
	background: url(../images/panelbg.png);
	height: 100%;
	width: 1000px;
	position: absolute;
	z-index: -1;
}
#line1,
#line2 {
	float:left;
	position:relative;
	width:1px;
	height: 100%;
	border-left: 1px dotted #86959d;
}

#line1 {
	left:548px;
}

#line2 {
	left:776px;
}

#box {
	margin-left: auto;
	margin-right: auto;
	width: 1000px;
	position: relative;
	top: 20px;
	text-align: left;
	color: #545454;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-bottom: 30px;
}

#content {
	margin-left: auto;
	margin-right: auto;
	width: 940px;
	position: relative;
	top: 10px;
	text-align: left;
	color: #545454;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	height:440px;
}

#vocabulary,
#units,
#lessons {
	float:left;
}

#icons {
	top: 345px;
	left: 620px;
	position: absolute;
}

#units {
	margin-left:24px;
}

#lessons {
	margin-left:20px;
}

#lessonlogo{
	background: url(../images/lessons.png) top left no-repeat;
	width:121px;
	height:36px;
	margin-left:11px;
	margin-top:11px;
}


#voclogo{
	background: url(../images/vocabulary.png) top left no-repeat;
	width:163px;
	height:36px;
	margin-left:11px;
	margin-top:11px;
}

#unitlogo{
	background: url(../images/units.png) top left no-repeat;
	width:72px;
	height:36px;
	margin-left:11px;
	margin-top:11px;
}

#vocIndexMenu,
#pageIndexMenu,
#iconmenu,
#lessonmenu,
#unitmenu,
#vocmenu {
	display:table;
	margin:0px;
	padding:0px;
}

#vocIndexMenu li,
#pageIndexMenu li,
#lessonmenu li,
#unitmenu li,
#vocmenu li {
	list-style: none;
	display: block;
	float: left;
	width: 30px;
	height: 30px;
	margin-left:11px;
	margin-top:11px;
}

#vocIndexMenu li,
#pageIndexMenu li {
	margin-left:0px !important;
	margin-top:0px !important;
}

#vocIndexMenu li img,
#pageIndexMenu li img,
#lessonmenu li img,
#unitmenu li img,
#vocmenu li img {
	border: 0px;
	width:30px;
	height:30px;
}

#iconmenu li {
	list-style: none;
	display: block;
	float: left;
	width: 61px;
	height: 76px;
	margin-right:11px;
}

#iconmenu li img {
	border: 0px;
	width:61px;
	height:76px;
}

#vocIndexMenu .vocSelected,
#vocmenu .selected{
	background-color:#ff6600;
}

#pageIndexMenu .unitSelected,
#unitmenu .selected{
	background-color:#498cc2;
}
#pageIndexMenu .lessonSelected,
#lessonmenu .selected{
	background-color:#1a862d;
}

DIV.unitSelected {
	width:30px;
	height:30px;
	float:left;
	margin-right: 10px;
	background-color:#498cc2;
}

DIV.lessonSelected {
	width:30px;
	height:30px;
	float:left;
	margin-right: 10px;
	background-color:#1a862d;
}

#vocmenu li:hover{
	background-color:#ff6600;
}
#unitmenu li:hover{
	background-color:#498cc2;
}
#lessonmenu li:hover{
	background-color:#1a862d;
}

#prev_button img,
#next_button  img{
	width:24px;
	height:95px;
	border: 0px;
}

#prev_button,
#next_button {
	position:relative;
	top:180px;
	float:left;
}

#next_button {
	float:right !important;
}

#title img {
	border:0px;
	width:301px;
	height:17px;
}

#title {
	margin-left: auto;
	margin-right: auto;
	position:relative;
	top:460px;
	width:300px;
}

.lessonTitle {
	position:absolute;
	padding-left:15px;
	padding-right:15px;
	padding-top:5px;
	padding-bottom:5px;
	background-color:#333;
	border:1px solid #fff;
	font-size: 12px;
	color:#fff;
	left: -1px;
	top: 350px;
	line-height:30px;
}

.unitTitle {
	position:absolute;
	padding-left:15px;
	padding-right:15px;
	padding-top:5px;
	padding-bottom:5px;
	background-color:#333;
	border:1px solid #fff;
	font-size: 16px;
	color:#fff;
	left: -1px;
	top: 309px;
	font-weight:bold;
	line-height:30px;
}


#flags {
	position:absolute;
	top:0px;
	left:267px;
}

#flagmenu {
	display:table;
	margin:0px;
	padding:0px;
}

#flagmenu li {
	list-style: none;
	display: block;
	float: left;
	width: 32px;
	height: 32px;
	margin-left:11px;
	margin-top:11px;
}

#flagmenu .selected {
	padding-left:4px;
	padding-right:4px;
	background-color:#fff;
}
	
#flagmenu li img {
	border: 0px;
	width:32px;
	height:32px;
}

#pageIndex {
	padding:8px;
	float:left;
	position:relative;
	width: 30px;
	height: 30px;
	background: url(../images/panelbg.png);
	left:642px;
	top:417px;
}

#vocIndex {
	padding:8px;
	float:left;
	position:relative;
	width: 30px;
	height: 30px;
	background: url(../images/panelbg.png);
	left:930px;
	top:417px;
}

#framecontainer {
	float:right;
	position:relative;
	top: 165px;
	border: #3d6294 solid 4px;
	background-color:#fff;
	width: 600px;
	height: 170px;
	overflow: auto;
	margin-right:30px;
	padding: 10px;
}


#wordscontainer {
	float:left;
	position:relative;
	top: 165px;
}

.scroll-pane
{
	border: #3d6294 solid 4px;
	background-color:#fff;
	width: 200px;
	height: 190px;
	overflow: auto;
	padding: 10px;
}

.scroll-pane A {
	font-weight: bold;
	color: #336699;
	text-decoration:none;
	padding:5px;
}

.scroll-pane A:hover {
	color: #ff6600;
}