/* *********************************************************
	Import slide CSS
*/
@import url("slideSS.css");

/* *********************************************************
	Slideshow root page styles
*/
body{
}

div#tplRootPge{
	position: absolute;
	top:0px;
	left:0px;
	bottom:0px;
	right:0px;
	background: white;
}

div#tplToc{
	position: absolute;
	top:0px;
	left:0px;
	bottom: 0px;
	border-right:1px solid #fd7400;
	background-color:white;
	z-index:100
}
div.tplTocOn{
	width: 270px;
}
div.tplTocOff{
	width: 0px;
}
div#tplTocCo{
	position: absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom: 0px;
	background: white;
}

div#tplTocScroll{
	position: absolute;
	top:20px;
	left:0px;
	right:0px;
	bottom: 20px;
}
div.tocSrlUp{
	position: absolute;
	top:5px;
	left:0px;
	right:0px;
	height: 10px;
}
div.tocSrlDwn{
	position: absolute;
	bottom:5px;
	left:0px;
	right:0px;
	height: 10px;
}
div.tocSrlUp a,
div.tocSrlDwn a{
	position: absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom: 0px;
	text-align: center;
}
div.tocSrlUp span,
div.tocSrlDwn span{
	display: none;
}
a.tocSrlUpBtn{
	background: url(../img/toc/btnSrlUp.png) no-repeat center center;
}

a.tocSrlDwnBtn{
	background: url(../img/toc/btnSrlDwn.png) no-repeat center center;
}

#tplToc div.btnOff a.tocSrlDwnBtn, #tplToc div.btnOff a.tocSrlUpBtn{
	opacity:0.7;
}

a.btnTocTglOn,
a.btnTocTglOff{
	position: absolute;
	top: 10px;
	width:12px;
	height:27px;
	right:-12px;	
	background-repeat: no-repeat;
	background-position: left top;
}
a.btnTocTglOn{
	background-image: url(../img/toc/collapse.png);
}
a.btnTocTglOn:hover{
	background-image: url(../img/toc/collapseOver.png);
}
a.btnTocTglOff{
	background-image: url(../img/toc/open.png);
}
a.btnTocTglOff:hover{
	background-image: url(../img/toc/openOver.png);
}
a.btnTocTglOn span,
a.btnTocTglOff span{
	display: none;
}
div#tplSldFra{
	position: absolute;
	top:0px;
	right:0px;
	bottom: 40px;
}
div.tplSldFraTocOn{
	left: 270px;
}
div.tplSldFraTocOff{
	left: 37px;
}
div#tplRootNav{
	position: absolute;
	right: 0px;
	bottom: 0px;
	height: 35px;
	width: 100px;
}
div#tplTools{
	position: absolute;
	right: 0px;
	top: 0px;
	height: 44px;
	width: 20px;
}
a.btnModeHtml{
	position: absolute;
	height : 40px;
	top:0px;
	width:30px;
	right:10px;
	background-repeat: no-repeat;
	background-position: center;
}

a.btnModeHtml{
	background-image: url(../img/tools/btnMdeHtml.png);
	opacity:0.2;
	filter:Alpha(opacity=20); 
}
a.btnModeHtml:hover{
	opacity:1;
	filter:Alpha(opacity=100); 
}
a.btnEfcts,
a.btnNoEfcts{
	position: absolute;
	height : 40px;
	top:0px;
	width:30px;
	right:40px;
	background-repeat: no-repeat;
	background-position: center center;
}
a.btnEfcts{
	background-image: url(../img/tools/btnEfcts.png);
	opacity:0.2;
	filter:Alpha(opacity=20); 
}
a.btnEfcts:hover{
	opacity:1;
	filter:Alpha(opacity=100); 
}
a.btnNoEfcts{
	background-image: url(../img/tools/btnNoEfcts.png);
	opacity:0.2;
	filter:Alpha(opacity=20); 
}
a.btnNoEfcts:hover{
	opacity:1;
	filter:Alpha(opacity=100); 
}

a.btnEfcts span,
a.btnNoEfcts span,
a.btnModeHtml span{
	display:none
}

div.ssSlide{
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: white;
}

h1.slideTi{
	position: absolute;
	width: 100%;
	height: 10%;
	margin:0px;
	text-align: center;
}
iframe.slideFra{
	position: absolute;
	top:0px;
	left:0px;
	width: 100%;
	height: 100%;
	bottom:0px;
	border: 0px;
	overflow: hidden;
}
a.btnPrv,
a.btnNxt{
	position: absolute;
	width:30px;
	height:40px;
	bottom: 0px;
	background-repeat: no-repeat;
}
a.btnPrv{
	right: 40px;
	background-image: url(../img/nav/prev.png);
}
a.btnPrv:hover, a.btnNxt:hover{
	opacity:0.7;
}
a.btnNxt{
	right: 10px;
	background-image: url(../img/nav/next.png);
}
a.btnPrv span,
a.btnNxt span{
	display: none;
}
div#tplZoomFra{
	position: absolute;
	width:100%;
	height:100%;
	overflow:hidden;
	z-index:110
}
div.tplZoomOvr{
	position: absolute;
	width:100%;
	height:100%;
	background-color: #4E6AA1;
	opacity:0.5;
	filter:Alpha(opacity=50); 
}
div#tplZoomCo{
	position: absolute;
	left: 15px;
	right: 15px;
	top: 15px;
	bottom: 15px;
	background-color: white;
	border: 3px solid #4E6AA1;
}
div.sldZmFrg,
div.sldZmSld{
	position: absolute;
	left: 5px;
	right: 5px;
	top: 5px;
	bottom: 5px;
	overflow: hidden;
	text-align: center;
}
div.sldZmSld iframe{
	overflow: auto;
	
}
a.btnZmCls{
	position: absolute;
	width:31px;
	height:31px;
	top: -15px;
	right: -15px;
	background-repeat: no-repeat;
	background-image: url(../img/nav/btnZmCls.png);
	opacity:0.7;
	filter:Alpha(opacity=70); 
}
a.btnZmCls:hover{
	opacity:1;
	filter:Alpha(opacity=100); 
}
a.btnZmCls span{
	display: none;
}
div#tplFootBanner{
	position: absolute;
	bottom: 20px;
	left: 80px;
	font-size: 0.8em;
	color: gray;
	cursor:default;
	right:80px;
	text-align:center;
}

div#tplFootBanner.tplFootBannerTocOn{
	left: 270px;
}

div#tplFootBanner .copyright{
	font-style: italic;
}
div#tplFootBanner .version{
	color: #6A9662;
}
div#tplFootBanner img{
	vertical-align: middle;
}
.sldWaitMsg{
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left:-150px;
	margin-top:-20px;
	width: 300px;
	height: 40px;
	background-color: white;
	border: 6px solid #5B6F94;
	text-align: center;
	
}
.sldWaitMsg span{
	display:block;
	padding-top:10px;
	font-size:1.2em;
	font-weight:bold;
	font-style: italic;
	color: #5B6F94;
	background:url(../img/co/throbber.gif) 5px 13px no-repeat
}


/* *********************************************************
	Menu styles
*/
ul#toc{
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	margin: 0px;
	padding: 0px;
	text-align:left;
	cursor: default;
	margin-left:3px
}
ul#toc a {
	text-decoration: none;
	color: black;
}
ul#toc a span{
	color: black;
}
ul#toc a.toc_lnk span{
	padding: 2px 5px 2px 5px;
	display:inline-block;
	cursor:pointer;
	cursor:hand;
}
ul#toc a img{
	border: 0px;
	vertical-align: middle;
}
ul#toc ul{
	list-style-image:none;
	list-style-type:none;
	margin: 2px 0px 0px 0px;
	padding: 0px 0px 0px 14px;
	}
ul#toc li{
	margin: 0px 0px 0px 0px;
	padding: 2px 0px 2px 0px;
}

ul#toc .toc_i{
	color: black;
	padding-left: 15px;
	position: relative;
}
ul#toc a.toc_tgle_o,
ul#toc a.toc_tgle_c {
	position: absolute;
	top:0px;
	left:0px;
	height:100%;
	width: 15px;
}
ul#toc a.toc_tgle_o img,
ul#toc a.toc_tgle_c img{
	position: absolute;
	top:50%;
	left:50%;
	margin-top:-7px;
	margin-left:-7px;
}
ul#toc a.toc_lnk {
	padding: 2px 2px 2px 7px;
	display: inline-block;
}
/*** Leaf ***/
ul#toc .tocObj{
	background: url(../img/toc/objPedMnu.png) left center no-repeat;
}

ul#toc .tocIntro{
	background: url(../img/toc/introMnu.png) left center no-repeat;
}

ul#toc .tocConclu{
	background: url(../img/toc/concluMnu.png) left center no-repeat;
}

ul#toc .tocCourseUa{
	background: url(../img/toc/courseUaMnu.png) left center no-repeat;
}

ul#toc .tocAssmntUa{
	background: url(../img/toc/assmntUaMnu.png) left center no-repeat;
}

ul#toc .tocExpUc{
	background: url(../img/toc/expUcMnu.png) left center no-repeat;
}

ul#toc .tocVidUc{
	background: url(../img/toc/vidUcMnu.png) left center no-repeat;
}

ul#toc .tocQuest{
	background: url(../img/toc/questMnu.png) left center no-repeat;
}

ul#toc .pres{
	background: url(../img/toc/ueMnu.png) left center no-repeat;
}

ul#toc .tocPractUc{
	background: url(../img/toc/practUcMnu.png) left center no-repeat;
}

ul#toc .tocMcqSur{
	background: url(../img/toc/trainUcMnu.png) left center no-repeat;
}

ul#toc .tocMcqMur{
	background: url(../img/toc/trainUcMnu.png) left center no-repeat;
}

ul#toc .tocField{
	background: url(../img/toc/trainUcMnu.png) left center no-repeat;
}

ul#toc .tocCloze{
	background: url(../img/toc/trainUcMnu.png) left center no-repeat;
}

ul#toc .tocCoQuiz{
	background: url(../img/toc/trainUcMnu.png) left center no-repeat;
}

ul#toc .tocOrdWord{
	background: url(../img/toc/trainUcMnu.png) left center no-repeat;
}

ul#toc .tocMatch{
	background: url(../img/toc/trainUcMnu.png) left center no-repeat;
}

ul#toc .tocContact{
	background: url(../img/toc/contactMnu.png) 2px center no-repeat;
}

ul#toc div.toc_sel_no a.toc_lnk:hover, ul#toc div.toc_sel_no a.toc_lnk:hover span{
	color:#fd7400;
}
ul#toc div.toc_sel_yes a.toc_lnk span{
	display: inline-block;
	-webkit-border-radius: 50px;
	-moz-border-radius:50px;
	border-radius: 50px;
	background-color:#fd7400;
	color:white;
}

/* *********************************************************
	Prog bar styles
*/
.progFra{
	position:absolute;
	bottom: 2px;
	right: 80px;
	left: 80px;
	color:#94739d;
	text-align:center;
	background-color:#e0dcd8;
	-webkit-border-radius: 5px;
	-moz-border-radius:5px;
	border-radius: 5px;
	height:15px
}

.progTocOn{
	left:350px
}

.progCount{
	background-color:#94739d;
	-webkit-border-radius: 5px;
	-moz-border-radius:5px;
	border-radius: 5px;
	text-align: right;
	overflow: visible;
	left:0px;	
	color:#fff;
	position:absolute;
	height:15px;
	padding-right:5px;
	font-size:12px
}

.prog_0 .progCount{
	width:0%
}

.prog_5 .progCount{
	right:95%
}

.prog_10 .progCount{
	right:90%
}

.prog_15 .progCount{
	right:85%
}

.prog_20 .progCount{
	right:80%
}

.prog_25 .progCount{
	right:75%
}

.prog_30 .progCount{
	right:70%
}

.prog_35 .progCount{
	right:65%
}

.prog_40 .progCount{
	right:60%
}

.prog_45 .progCount{
	right:55%
}

.prog_50 .progCount{
	right:50%
}

.prog_55 .progCount{
	right:45%
}

.prog_60 .progCount{
	right:40%
}

.prog_65 .progCount{
	right:35%
}

.prog_70 .progCount{
	right:30%
}

.prog_75 .progCount{
	right:25%
}

.prog_80 .progCount{
	right:20%
}

.prog_85 .progCount{
	right:15%
}

.prog_90 .progCount{
	right:10%
}

.prog_95 .progCount{
	right:5%
}

.prog_100 .progCount{
	right:0px
}

/* *********************************************************
	Content styles
*/
.sldHome_ti{
	text-align: center;
	margin-top:4em;
}